Hacks-R-Us
/
hacksrus.uk
mirror of https://github.com/Hacks-R-Us/hacksrus.uk.git
3
Fork 0
Code Issues Projects Releases Activity

Add unicorns, and events wot we were at

This commit is contained in:
Sam W 2020-08-16 13:30:24 +01:00
parent a614748c4c
commit 4d7185792c
2 changed files with 42 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
index.html
View File

@ -9,7 +9,7 @@
<div class="container"> <div class="container">
<h1><a href="/"><img src="img/logo.svg" alt="Hacks 'R' Us Logo"></a></h1> <h1><a href="/"><img src="img/logo.svg" alt="Hacks 'R' Us Logo"></a></h1>
<h2>Who?</h2> <h2>Who?</h2>
<ul class="people"> <ul class="fisher-price-links">
<li><a href="https://twitter.com/sudoreboot">Sam W</a></li> <li><a href="https://twitter.com/sudoreboot">Sam W</a></li>
<li><a href="https://twitter.com/Rrah99">Robert Walker</a></li> <li><a href="https://twitter.com/Rrah99">Robert Walker</a></li>
<li><a href="https://twitter.com/thomasslee97">Tom Lee</a></li> <li><a href="https://twitter.com/thomasslee97">Tom Lee</a></li>
@ -19,9 +19,17 @@
<h2>What?</h2> <h2>What?</h2>
<p>Dumb stuff with technology</p> <p>Dumb stuff with technology</p>
<h2>Where?</h2> <h2>Where?</h2>
<p>Your local hacker camp or con</p> <p>Preferably, a hacker camp or con (probably under a <span class="unicorns">DOME</span>)</p>
<h2>When?</h2> <p>Failing that, the Internet</p>
<p>Since 2018</p> <h3>Events</h3>
<p>We were here:</p>
<ul class="fisher-price-links">
<li><a href="https://emfcamp.org">EMF2018</a></li>
<li><a href="https://events.ccc.de/congress/2018">35C3</a></li>
<li><a href="https://events.ccc.de/camp/2019/">CCCAMP19</a></li>
<li><a href="https://events.ccc.de/congress/2019">36C3</a></li>
<li><a href="https://emfcamp.org"><s>EMF2020</s></a> stupid virus</li>
</ul>
</div> </div>
</body> </body>
</html> </html>

38
style.css
View File

@ -8,14 +8,14 @@ div.container {
text-align: center; text-align: center;
} }
ul.people { ul.fisher-price-links {
display: flex; display: flex;
padding: 0px ; padding: 0px ;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
ul.people>li { ul.fisher-price-links>li {
padding: 2px; padding: 2px;
background-color: #adadad; background-color: #adadad;
list-style: none; list-style: none;
@ -24,29 +24,51 @@ ul.people>li {
transition: all 0.1s ease-in-out; transition: all 0.1s ease-in-out;
} }
ul.people>li:nth-of-type(4n+1) { ul.fisher-price-links>li:nth-of-type(4n+1) {
background-color: #ea1a5b; background-color: #ea1a5b;
} }
ul.people>li:nth-of-type(4n+2) { ul.fisher-price-links>li:nth-of-type(4n+2) {
background-color: #f48120; background-color: #f48120;
} }
ul.people>li:nth-of-type(4n+3) { ul.fisher-price-links>li:nth-of-type(4n+3) {
background-color: #73bd45; background-color: #73bd45;
} }
ul.people>li:nth-of-type(4n) { ul.fisher-price-links>li:nth-of-type(4n) {
background-color: #0862ad; background-color: #0862ad;
} }
ul.people>li:hover { ul.fisher-price-links>li:hover {
transform: translate(-2px, -2px); transform: translate(-2px, -2px);
box-shadow: 8px 8px; box-shadow: 8px 8px;
/*z-index: -1;*/ /*z-index: -1;*/
} }
ul.people>li>a { ul.fisher-price-links>li>a {
color: #fff; color: #fff;
text-decoration: none; text-decoration: none;
font-size: 20px; font-size: 20px;
}
.unicorns {
animation: unicornMode 2s linear 0s infinite;
}
@keyframes unicornMode {
from {
color: #6666ff;
}
10% {
color: #0099ff;
}
50% {
color: #00ff00;
}
75% {
color: #ff3399;
}
100% {
color: #6666ff;
}
} }