Styling images on frontpage a bit

This commit is contained in:
Víðir Valberg Guðmundsson 2016-07-28 12:44:26 +02:00
parent f387c0a394
commit 0bc64a7d6d
2 changed files with 81 additions and 42 deletions

View file

@ -113,3 +113,9 @@ footer {
.nav li a {
padding: 30px 7px;
}
.text-container {
display: flex;
align-items: center;
height: 200px;
}

View file

@ -7,41 +7,65 @@
<div class="col-md-12">
<img src="{% static 'img/logo.png' %}" class="img-responsive"
id="front-logo" />
<p class="lead">
<strong>Bornhack</strong> is a 7 day outdoor tent camping festival where
hackers, makers and people with an interest in technology and security
<br />
<div class="row">
<div class="col-md-8 text-container">
<div class="lead">
<strong>Bornhack</strong> is a 7 day outdoor tent camping festival
people with an interest in technology and security
come together to celebrate technology, socialise, learn and <strong>have fun</strong>.
</p>
</div>
</div>
<div class="col-md-4">
<a href="https://people.bornhack.org/tyk/ohm_cccamp_pics/1440021030983232.jpg">
<img class="img-thumbnail"
src="https://people.bornhack.org/tyk/ohm_cccamp_pics/1440021030983232_tn.jpg"
alt="Tents at CCCamp2015">
</a>
</div>
</div>
<p>
<a href="https://people.bornhack.org/tyk/ohm_cccamp_pics/inconvenience.jpg"><img class="img-thumbnail" src="https://people.bornhack.org/tyk/ohm_cccamp_pics/inconvenience_tn.jpg" alt="Sorry for the inconvenience"></a>
<a href="https://people.bornhack.org/tyk/ohm_cccamp_pics/ohm2013-0a-hacking.jpg"><img class="img-thumbnail" src="https://people.bornhack.org/tyk/ohm_cccamp_pics/ohm2013-0a-hacking_tn.jpg" alt="Hacking"></a>
<a href="https://people.bornhack.org/tyk/ohm_cccamp_pics/1440021030983232.jpg"><img class="img-thumbnail" src="https://people.bornhack.org/tyk/ohm_cccamp_pics/1440021030983232_tn.jpg" alt="Tents at CCCamp2015"></a>
</p>
<br />
<p class="lead">
<div class="row">
<div class="col-md-4">
<a href="https://people.bornhack.org/tyk/ohm_cccamp_pics/ohm2013-0a-hacking.jpg">
<img class="img-thumbnail"
src="https://people.bornhack.org/tyk/ohm_cccamp_pics/ohm2013-0a-hacking_tn.jpg"
alt="Hacking">
</a>
</div>
<div class="col-md-8 text-container">
<div class="lead">
It takes place for the first time from <strong>August 27 to September 3rd
2016</strong> on the Danish island of <strong>Bornholm</strong> where we
have found the geography and backbone to make it happen.
</p>
</div>
</div>
</div>
<p>
<a href="https://people.bornhack.org/tyk/ohm_cccamp_pics/camp_villages.jpg"><img class="img-thumbnail" src="https://people.bornhack.org/tyk/ohm_cccamp_pics/camp_villages_tn.jpg" alt="Hacking tent at OHM2013"></a>
<a href="https://people.bornhack.org/tyk/ohm_cccamp_pics/ccc2-5e6cdc7575a1ef63.jpg"><img class="img-thumbnail" src="https://people.bornhack.org/tyk/ohm_cccamp_pics/ccc2-5e6cdc7575a1ef63_tn.jpg" alt="Tents at CCCamp2015"></a>
<a href="https://people.bornhack.org/tyk/ohm_cccamp_pics/datenklo.jpg"><img class="img-thumbnail" src="https://people.bornhack.org/tyk/ohm_cccamp_pics/datenklo_tn.jpg" alt="Datenklo at CCCamp2015"></a>
</p>
<br />
<div class="row">
<div class="col-md-8 text-container">
<p class="lead">
Bornhack is a <strong>participatory</strong> event where we expect people
to come up with ideas and projects, and help make the content. We will reach out to
people to ensure interesting, high quality talks and workshops.
</p>
</div>
<div class="col-md-4">
<a href="https://people.bornhack.org/tyk/ohm_cccamp_pics/0021652.jpg">
<img class="img-thumbnail"
src="https://people.bornhack.org/tyk/ohm_cccamp_pics/0021652_tn.jpg"
alt="Campsite at nighttime">
</a>
</div>
</div>
<p>
<a href="https://people.bornhack.org/tyk/ohm_cccamp_pics/0021652.jpg"><img class="img-thumbnail" src="https://people.bornhack.org/tyk/ohm_cccamp_pics/0021652_tn.jpg" alt="Campsite at nighttime"></a>
<a href="https://people.bornhack.org/tyk/ohm_cccamp_pics/MgpF-OHM2013-2005.jpg"><img class="img-thumbnail" src="https://people.bornhack.org/tyk/ohm_cccamp_pics/MgpF-OHM2013-2005_tn.jpg" alt="Noisy Square at OHM2013"></a>
<a href="https://people.bornhack.org/tyk/ohm_cccamp_pics/OHM2013_big_tux.png"><img class="img-thumbnail" src="https://people.bornhack.org/tyk/ohm_cccamp_pics/OHM2013_big_tux_tn.jpg" alt="Big Tux at OHM2013"></a>
</p>
<br />
<p class="lead">
You are very welcome to ask questions and show your interest on our different channels:
@ -61,7 +85,17 @@
The Bornhack Team
</p>
</div>
<p>
<a href="https://people.bornhack.org/tyk/ohm_cccamp_pics/inconvenience.jpg">
<img class="img-thumbnail" src="https://people.bornhack.org/tyk/ohm_cccamp_pics/inconvenience_tn.jpg"
alt="Sorry for the inconvenience">
</a>
<a href="https://people.bornhack.org/tyk/ohm_cccamp_pics/MgpF-OHM2013-2005.jpg"><img class="img-thumbnail" src="https://people.bornhack.org/tyk/ohm_cccamp_pics/MgpF-OHM2013-2005_tn.jpg" alt="Noisy Square at OHM2013"></a>
<a href="https://people.bornhack.org/tyk/ohm_cccamp_pics/OHM2013_big_tux.png"><img class="img-thumbnail" src="https://people.bornhack.org/tyk/ohm_cccamp_pics/OHM2013_big_tux_tn.jpg" alt="Big Tux at OHM2013"></a>
<a href="https://people.bornhack.org/tyk/ohm_cccamp_pics/camp_villages.jpg"><img class="img-thumbnail" src="https://people.bornhack.org/tyk/ohm_cccamp_pics/camp_villages_tn.jpg" alt="Hacking tent at OHM2013"></a>
<a href="https://people.bornhack.org/tyk/ohm_cccamp_pics/ccc2-5e6cdc7575a1ef63.jpg"><img class="img-thumbnail" src="https://people.bornhack.org/tyk/ohm_cccamp_pics/ccc2-5e6cdc7575a1ef63_tn.jpg" alt="Tents at CCCamp2015"></a>
<a href="https://people.bornhack.org/tyk/ohm_cccamp_pics/datenklo.jpg"><img class="img-thumbnail" src="https://people.bornhack.org/tyk/ohm_cccamp_pics/datenklo_tn.jpg" alt="Datenklo at CCCamp2015"></a>
<a href="https://people.bornhack.org/tyk/ohm_cccamp_pics/dome.jpg"><img class="img-thumbnail" src="https://people.bornhack.org/tyk/ohm_cccamp_pics/dome_tn.jpg" alt="Dome at CCCamp2015"></a>
<a href="https://people.bornhack.org/tyk/ohm_cccamp_pics/hacking-hard-drive-controllers.jpg"><img class="img-thumbnail" src="https://people.bornhack.org/tyk/ohm_cccamp_pics/hacking-hard-drive-controllers_tn.jpg" alt="Hacking harddrive controllers"></a>
<a href="https://people.bornhack.org/tyk/ohm_cccamp_pics/img_20150816_184130-sarah-crop.jpg"><img class="img-thumbnail" src="https://people.bornhack.org/tyk/ohm_cccamp_pics/img_20150816_184130-sarah-crop_tn.jpg" alt="Hacking in progress at CCCamp2015"></a>
@ -73,7 +107,6 @@
<a href="https://people.bornhack.org/tyk/ohm_cccamp_pics/wide__820x461.png"><img class="img-thumbnail" src="https://people.bornhack.org/tyk/ohm_cccamp_pics/wide__820x461_tn.jpg" alt="CCCamp2015 at night"></a>
</p>
</div>
</div>
{% endblock %}