typography-project/index.html at master · AntonV0/typography-project · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
<!DOCTYPE html>
<html>
  <head>
    <title>Morocco</title>
    <link rel="stylesheet" type="text/css" href="styles/reset.css" />
    <link rel="stylesheet" type="text/css" href="styles/style.css" />
  </head>
  <body>
    <!-- Header -->
    <nav class="header">
      <span class="logo">AOFIE CONLEAVY</span>
      <ul>
        <li><a href="#">TRAVELS</a></li>
        <li><a href="#">FICTION</a></li>
        <li><a href="#">CONTACT</a></li>
      </ul>
    </nav>

    <!-- Banner -->
    <div class="banner">
      <h2>DEC 20XX</h2>
      <h1>Morocco</h1>
    </div>

    <!-- Journal -->
    <div class="journal">
      <div class="first photo">
        <div class="image-container">
          <img
            src="https://content.codecademy.com/courses/freelance-1/unit-6/project-morocco/photo1.png"
          />
        </div>
        <span class="caption"
          >A convoy of camels criss-crossing the crests of the Sahara</span
        >
      </div>
      <p>
        <span class="first-letter">I</span> am in the Great Sahara Desert for
        the third sundown in a row. Fouad and I pass back and forth a
        sun-bleached map of the stars. It’s more of a tug-of-war to be honest.
        With what remains of the daylight, we commit to memory the positions of
        spots on the page. We hope to find some correlation in its negative,
        which slides overhead as the sun rapidly dies.
      </p>
      <p>
        "Navigating by night is always easier." Fouad flicks these English words
        as ash from a cigarette. "You’ll see."
      </p>
      <p>"We won't see anything. That's my point!"</p>
      <p>How did we get here?</p>
      <p>
        It started eight days ago when I arrived in Malilla on the boat from
        Malaga. The sun hit me like a judgement as I stepped onto the gangplank.
        A bit about Morocco:
      </p>
      <div class="photo">
        <div class="image-container">
          <img
            src="https://content.codecademy.com/courses/freelance-1/unit-6/project-morocco/photo2.png"
          />
        </div>
        <span class="caption">The long and winding road to Merrakec</span>
      </div>
      <p>
        Morocco has a population of over 33.8 million and an area of 446,550 km2
        (172,410 sq mi). Its capital is Rabat, and the largest city is
        Casablanca. Other major cities include Marrakesh, Tangier, Tetouan,
        Sale, Fes, Agadir, Meknes, Oujda, Kenitra, and Nador. A historically
        prominent regional power, Morocco has a history of independence not
        shared by its neighbours.
      </p>
      <span class="quote">"Navigating by night is always easier."</span>
      <p>
        Since the foundation of the first Moroccan state by Idris I in 789, the
        country has been ruled by a series of independent dynasties, reaching
        its zenith under the Almoravid and Almohad dynasty, spanning parts of
        Iberia and Northwestern Africa. Marinid and Saadi dynasties continued
        the struggle against foreign domination, and Morocco remained the only
        North-African country to avoid Ottoman occupation.
      </p>
      <p>
        The Alaouite dynasty, the current ruling dynasty, seized power in 1666.
        In 1912 Morocco was be divided into a French and Spanish protectorates,
        with an international zone in Tangier, and regained its independence in
        1956. Moroccan culture is a blend of Arab, indigenous Berber,
        Sub-Saharan African, and European influences.
      </p>
      <div class="photo">
        <div class="image-container">
          <img
            src="https://content.codecademy.com/courses/freelance-1/unit-6/project-morocco/photo3.png"
          />
        </div>
        <span class="caption">A stall at the Jemaa El Fnaa street market</span>
      </div>
      <p>
        Morocco claims the non-self-governing territory of Western Sahara as its
        Southern Provinces. Morocco annexed the territory in 1975, leading to a
        guerrilla war with indigenous forces until a cease-fire in 1991. Peace
        processes have thus far failed to break the political deadlock.
      </p>
      <p>
        Morocco is a constitutional monarchy with an elected parliament. The
        King of Morocco holds vast executive and legislative powers, especially
        over the military, foreign policy and religious affairs. Executive power
        is exercised by the government, while legislative power is vested in
        both the government and the two chambers of parliament, the Assembly of
        Representatives and the Assembly of Councillors. The king can issue
        decrees called dahirs which have the force of law. He can also dissolve
        the parliament after consulting the Prime Minister and the president of
        the Constitutional court.
      </p>
      <span class="quote">“Navigating by night is always easier.”</span>
      <p>
        Morocco's predominant religion is Islam, and the official languages are
        Arabic and Tamazight. Moroccan dialect, referred to as Darija, and
        French are also widely spoken. Morocco is an influential member of the
        Arab League and a part of the Union for the Mediterranean. It has the
        fifth largest economy of Africa.
      </p>
      <div class="photo">
        <div class="image-container">
          <img
            src="https://content.codecademy.com/courses/freelance-1/unit-6/project-morocco/photo4.png"
          />
        </div>
        <span class="caption"
          >The desert at night is strange and beautiful</span
        >
      </div>
    </div>

    <!-- Footer -->
    <footer>
      <div class="image-container">
        <img
          src="https://content.codecademy.com/courses/freelance-1/unit-6/project-morocco/author.png"
        />
      </div>
      <div class="content">
        <p>
          <span class="author">Aoife Donleavy</span> has been writing on her
          travels for over two decades. After graduating from the
          <em>Idaho Writers' Workshop</em>, she piloted a biplane on a two-year
          voyage from <em>Anchorage</em>, <em>Alaska</em> to
          <em>Isafjorour</em>, <em>Iceland</em> stopping along the way for
          adventures throughout Europe.
        </p>
        <p>
          Since then, she has camped on all seven continents, and has been
          recognized worldwide for her spare, ageless prose. Aoife's new novel,
          <em>Tide Blade</em>, is currently available from
          <em>Walrus Publishing</em>.
        </p>
      </div>
    </footer>
  </body>
</html>