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

View File

@ -9,7 +9,7 @@
<div class="container">
<h1><a href="/"><img src="img/logo.svg" alt="Hacks 'R' Us Logo"></a></h1>
<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/Rrah99">Robert Walker</a></li>
<li><a href="https://twitter.com/thomasslee97">Tom Lee</a></li>
@ -19,9 +19,17 @@
<h2>What?</h2>
<p>Dumb stuff with technology</p>
<h2>Where?</h2>
<p>Your local hacker camp or con</p>
<h2>When?</h2>
<p>Since 2018</p>
<p>Preferably, a hacker camp or con (probably under a <span class="unicorns">DOME</span>)</p>
<p>Failing that, the Internet</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>
</body>
</html>

View File

@ -8,14 +8,14 @@ div.container {
text-align: center;
}
ul.people {
ul.fisher-price-links {
display: flex;
padding: 0px ;
align-items: center;
justify-content: center;
}
ul.people>li {
ul.fisher-price-links>li {
padding: 2px;
background-color: #adadad;
list-style: none;
@ -24,29 +24,51 @@ ul.people>li {
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;
}
ul.people>li:nth-of-type(4n+2) {
ul.fisher-price-links>li:nth-of-type(4n+2) {
background-color: #f48120;
}
ul.people>li:nth-of-type(4n+3) {
ul.fisher-price-links>li:nth-of-type(4n+3) {
background-color: #73bd45;
}
ul.people>li:nth-of-type(4n) {
ul.fisher-price-links>li:nth-of-type(4n) {
background-color: #0862ad;
}
ul.people>li:hover {
ul.fisher-price-links>li:hover {
transform: translate(-2px, -2px);
box-shadow: 8px 8px;
/*z-index: -1;*/
}
ul.people>li>a {
ul.fisher-price-links>li>a {
color: #fff;
text-decoration: none;
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;
}
}