Add a few project links, improve for small screens (closes #4)
This commit is contained in:
parent
4e38387f92
commit
c768b92cad
|
@ -7,6 +7,13 @@ isPage: true
|
||||||
<section id="teaser">
|
<section id="teaser">
|
||||||
<h1><%= @document.title %></h1>
|
<h1><%= @document.title %></h1>
|
||||||
<h2>Open-source group communication for the 21st century</h2>
|
<h2>Open-source group communication for the 21st century</h2>
|
||||||
|
<nav>
|
||||||
|
<ul>
|
||||||
|
<li><a href="https://wiki.67p.io">Wiki</a></li>
|
||||||
|
<li><a href="https://github.com/67P">GitHub</a></li>
|
||||||
|
<li><a href="https://twitter.com/KosmosHQ">Twitter</a></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
<!--
|
<!--
|
||||||
<p>
|
<p>
|
||||||
Kosmos is a new kind of team communication service. All of it is based on
|
Kosmos is a new kind of team communication service. All of it is based on
|
||||||
|
|
|
@ -57,6 +57,48 @@ section#teaser {
|
||||||
p {
|
p {
|
||||||
margin-bottom: 2rem;
|
margin-bottom: 2rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
nav {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
ul {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
list-style: none;
|
||||||
|
|
||||||
|
@include display(flex);
|
||||||
|
@include flex-direction(row);
|
||||||
|
@include flex-wrap(nowrap);
|
||||||
|
@include align-items(center);
|
||||||
|
@include align-content(center);
|
||||||
|
@include justify-content(center);
|
||||||
|
@include flex-grow(1);
|
||||||
|
|
||||||
|
li {
|
||||||
|
@include flex(1);
|
||||||
|
height: 48px;
|
||||||
|
|
||||||
|
a {
|
||||||
|
display: block;
|
||||||
|
margin: 0 8px;
|
||||||
|
height: 48px;
|
||||||
|
line-height: 48px;
|
||||||
|
font-size: 24px;
|
||||||
|
font-weight: 300;
|
||||||
|
text-decoration: none;
|
||||||
|
color: #fff;
|
||||||
|
border: 1px solid #fff;
|
||||||
|
border-radius: 24px;
|
||||||
|
@include transition(all linear 150ms);
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: rgba(255,255,255,0.2);
|
||||||
|
@include transition(all linear 150ms);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
footer {
|
footer {
|
||||||
|
@ -69,3 +111,11 @@ footer {
|
||||||
opacity: 0.7;
|
opacity: 0.7;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 600px) {
|
||||||
|
section#teaser {
|
||||||
|
h1 {
|
||||||
|
font-size: 72px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
Loading…
Reference in New Issue