some design tests
This commit is contained in:
parent
3bc14213c7
commit
581012aa20
@ -8,9 +8,11 @@ http://roelof.info
|
|||||||
http://randomiser.info/
|
http://randomiser.info/
|
||||||
http://majesticmoo.se
|
http://majesticmoo.se
|
||||||
*/
|
*/
|
||||||
html {
|
|
||||||
font-size: 20px;
|
* {
|
||||||
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family:'OrkneyRegular';
|
font-family:'OrkneyRegular';
|
||||||
src: url('../fonts/Orkney Regular.woff') format('truetype');
|
src: url('../fonts/Orkney Regular.woff') format('truetype');
|
||||||
@ -22,24 +24,64 @@ header {
|
|||||||
|
|
||||||
#banner {
|
#banner {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-size: 5rem;
|
font-size: calc(12px + 4vw);
|
||||||
padding-bottom: 0.5em;
|
padding-bottom: 0.5em;
|
||||||
padding-top: 1em;
|
padding-top: 1em;
|
||||||
background: #EAEAEA;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#sitename {
|
#sitename {
|
||||||
color:#0074D9;
|
color:#0074D9;
|
||||||
text-decoration:none;
|
text-decoration:overline underline;
|
||||||
|
text-decoration-style:wavy;
|
||||||
|
text-decoration-color:rgba(255, 65, 54, 0.5)/*#FF4136;*/
|
||||||
}
|
}
|
||||||
pre {
|
pre {
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
}
|
}
|
||||||
|
|
||||||
#menu {
|
#menu {
|
||||||
font-size:2.5rem;
|
list-style:none;
|
||||||
|
font-size:calc(7px + 1.5vw);
|
||||||
margin-top:1.2em;
|
margin-top:1.2em;
|
||||||
font-weight:bold;
|
font-weight:bold;
|
||||||
text-align:center;
|
text-align:center;
|
||||||
|
text-transform:lowercase;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dropdown {
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
color:#FF4136;
|
||||||
|
text-decoration:underline;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.guides-index {
|
||||||
|
display: none;
|
||||||
|
position: absolute;
|
||||||
|
background-color: #9F9;
|
||||||
|
z-index: 1;
|
||||||
|
text-align:left;
|
||||||
|
box-sizing: initial;
|
||||||
|
padding-right:15%;
|
||||||
|
color:#0074D9;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.guides-index li{
|
||||||
|
font-size:calc(5px + 0.9vw);
|
||||||
|
font-weight:normal;
|
||||||
|
margin-top:10%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.guides-index li>a:hover{
|
||||||
|
color:#333;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.dropdown:hover .guides-index {
|
||||||
|
display: block;
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
@ -53,8 +95,9 @@ body {
|
|||||||
}
|
}
|
||||||
|
|
||||||
#index{
|
#index{
|
||||||
max-width:80%;
|
max-width:55%;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
|
color:#333;
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
@ -286,6 +329,7 @@ table tr:nth-child(even) {
|
|||||||
position:relative;
|
position:relative;
|
||||||
transition:0.5s;
|
transition:0.5s;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
|
box-sizing:initial;
|
||||||
}
|
}
|
||||||
|
|
||||||
#forkongithub a:hover{
|
#forkongithub a:hover{
|
||||||
|
@ -42,7 +42,7 @@
|
|||||||
|
|
||||||
<body>
|
<body>
|
||||||
<header id="banner">
|
<header id="banner">
|
||||||
<a href="{{ SITEURL }}" id="sitename">{{ SITENAME }}</a>
|
<a href="/" id="sitename">{{ SITENAME }}</a>
|
||||||
<span id="subtitle">{{ SITESUBTITLE }}</span>
|
<span id="subtitle">{{ SITESUBTITLE }}</span>
|
||||||
<!-- /#banner -->
|
<!-- /#banner -->
|
||||||
|
|
||||||
@ -56,11 +56,17 @@
|
|||||||
{% endfor %}
|
{% endfor %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% if DISPLAY_CATEGORIES_ON_MENU %}
|
{% if DISPLAY_CATEGORIES_ON_MENU %}
|
||||||
|
<div class='dropdown'>
|
||||||
|
<p class="hoverable"><span>guides</span> <span class="arrow">▼</span></p>
|
||||||
|
<div class="guides-index">
|
||||||
|
<ol id="title-list">
|
||||||
{% for cat, null in categories %}
|
{% for cat, null in categories %}
|
||||||
<li{% if cat == category %} class="active"{% endif %}><a href="{{ SITEURL }}/{{ cat.url }}">{{ cat }}</a></li>
|
<li {% if cat == category %} class="active"{% endif %}><a href="{{ SITEURL }}/{{ cat.url }}">{{ cat }}</a></li>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</ul></nav>
|
</ol>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</header><!-- /#menu -->
|
</header><!-- /#menu -->
|
||||||
<span id="forkongithub"><a href="xmpp:hbsc@muc.lurk.org?join">Yes We're Config!™</a></span>
|
<span id="forkongithub"><a href="xmpp:hbsc@muc.lurk.org?join">Yes We're Config!™</a></span>
|
||||||
<div id='index' class='home'>
|
<div id='index' class='home'>
|
||||||
|
Loading…
Reference in New Issue
Block a user