Commit df095486 authored by Shaphen's avatar Shaphen

Add descriptions and minimal styling

parent 670c7b28
.img {
height: 300px;
width: 300px;
padding: 5px;
}
\ No newline at end of file
<h2>England</h2>
<div class='imgContainer' >
<img class='img' src='assets/images/england/england-bridge.jpg' />
<img class='img' src='assets/images/england/england-parliament.jpg' />
<img class='img' src='assets/images/england/england-stonehedge.jpg' />
<div class="location-component-container">
<h2>England</h2>
<div class='imgContainer' >
<img class='img' src='assets/images/england/england-bridge.jpg' />
<img class='img' src='assets/images/england/england-parliament.jpg' />
<img class='img' src='assets/images/england/england-stonehedge.jpg' />
</div>
<p class="location-desc">
England is a country that is part of the United Kingdom. It shares land borders with Wales to its west and
Scotland to its north. The Irish Sea lies northwest of England and the Celtic Sea to the southwest.
England is separated from continental Europe by the North Sea to the east and the English Channel to the
south.
</p>
</div>
......@@ -8,6 +8,8 @@
}
ul {
display: flex;
justify-content: center;
font-family: Arial, Verdana;
font-size: 14px;
margin: 0 auto;
......@@ -21,5 +23,7 @@ ul li {
display: block;
position: relative;
float: left;
padding-left: 20px;;
margin-left: 15px;
padding: 0px 5px;
cursor: pointer;
}
\ No newline at end of file
.img {
height: 300px;
width: 300px;
padding: 5px;
}
\ No newline at end of file
<h2>France</h2>
<div class='imgContainer' >
<img class='img' src='assets/images/france/france-cafe.jpg' />
<img class='img' src='assets/images/france/france-tower.jpg' />
<img class='img' src='assets/images/france/france-town.jpg' />
<div class="location-component-container">
<h2>France</h2>
<div class='imgContainer' >
<img class='img' src='assets/images/france/france-cafe.jpg' />
<img class='img' src='assets/images/france/france-tower.jpg' />
<img class='img' src='assets/images/france/france-town.jpg' />
</div>
<p class="location-desc">
France, in Western Europe, encompasses medieval cities, alpine villages and Mediterranean beaches.
Paris, its capital, is famed for its fashion houses, classical art museums including the Louvre and
monuments like the Eiffel Tower. The country is also renowned for its wines and sophisticated cuisine.
Lascaux’s ancient cave drawings, Lyon’s Roman theater and the vast Palace of Versailles attest to its
rich history.
</p>
</div>
\ No newline at end of file
.img {
height: 300px;
width: 300px;
padding: 5px;
}
\ No newline at end of file
<h2>Greece</h2>
<div class='imgContainer' >
<img class='img' src='assets/images/greece/greece- beach.jpg' />
<img class='img' src='assets/images/greece/greece-steps.jpg' />
<img class='img' src='assets/images/greece/greese-santorini.jpg' />
<div class="location-component-container">
<h2>Greece</h2>
<div class='imgContainer' >
<img class='img' src='assets/images/greece/greece- beach.jpg' />
<img class='img' src='assets/images/greece/greece-steps.jpg' />
<img class='img' src='assets/images/greece/greese-santorini.jpg' />
</div>
<p class="location-desc">
Greece is a country in southeastern Europe with thousands of islands throughout the Aegean and
Ionian seas. Influential in ancient times, it's often called the cradle of Western civilization.
Athens, its capital, retains landmarks including the 5th-century B.C. Acropolis citadel with the
Parthenon temple. Greece is also known for its beaches, from the black sands of Santorini to the
party resorts of Mykonos.
</p>
</div>
......@@ -25,5 +25,7 @@ h3{
.account{
position:absolute;
right:10px;
margin-top: 20px;
margin-top: 15px;
padding: 5px 10px;
cursor: pointer;
}
\ No newline at end of file
.img {
height: 300px;
width: 300px;
padding: 5px;
}
\ No newline at end of file
<h2>Spain</h2>
<div class='imgContainer' >
<img class='img' src='assets/images/spain/spain-barcelona.jpg' />
<img class='img' src='assets/images/spain/spain-cathedral.jpg' />
<img class='img' src='assets/images/spain/spain-dance.jpg' />
</div>
<div class="location-component-container">
<h2>Spain</h2>
<div class='imgContainer' >
<img class='img' src='assets/images/spain/spain-barcelona.jpg' />
<img class='img' src='assets/images/spain/spain-cathedral.jpg' />
<img class='img' src='assets/images/spain/spain-dance.jpg' />
</div>
<p class="location-desc">
Spain, a country on Europe’s Iberian Peninsula, includes 17 autonomous regions with diverse geography
and cultures. Capital city Madrid is home to the Royal Palace and Prado museum, housing works by European
masters. Segovia has a medieval castle (the Alcázar) and an intact Roman aqueduct. Catalonia’s capital,
Barcelona, is defined by Antoni Gaudí’s whimsical modernist landmarks like the Sagrada Família church.
</p>
</div>
\ No newline at end of file
/* You can add global styles to this file, and also import other style files */
.dynamic-container {
width: 100%;
}
.location-component-container{
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
width: 100%;
}
.img {
height: 300px;
width: 300px;
padding: 5px;
}
.location-desc{
width: 80%;
margin-top: 20px;
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment