Add logo to header, add design colors
This commit is contained in:
parent
3447c5610c
commit
3d1a7f63a1
|
@ -1,4 +1,5 @@
|
|||
$color-burger: #aaa;
|
||||
$color-highlight: #0080ff;
|
||||
$color-link: #f0f;
|
||||
$color-text: #000;
|
||||
$color-background: #0646a5;
|
||||
$color-burger: #ddd;
|
||||
$color-highlight: #ffeb3d;
|
||||
$color-link: #ffeb3d;
|
||||
$color-text: #fff;
|
||||
|
|
|
@ -9,6 +9,7 @@
|
|||
}
|
||||
|
||||
body {
|
||||
background: $color-background;
|
||||
color: $color-text;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
@ -38,8 +39,10 @@ header {
|
|||
line-height: 1;
|
||||
user-select: none;
|
||||
|
||||
b {
|
||||
span {
|
||||
color: $color-highlight;
|
||||
font-family: monospace;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -47,6 +50,19 @@ header {
|
|||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.header-brand {
|
||||
display: flex;
|
||||
|
||||
img + pre {
|
||||
margin-left: 0.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
.header-logo {
|
||||
height: 3.2rem;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.nav-burger {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
|
|
|
@ -11,10 +11,13 @@
|
|||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<pre><b>I</b>NTER
|
||||
<b>G</b>ALAKTISCHE
|
||||
<b>E</b>RFAHRUNGS
|
||||
<b>R</b>EISE</pre>
|
||||
<div class="header-brand">
|
||||
<img alt="Logo der Intergalaktischen Erfahrungsreise, kurz IGER" class="header-logo" src="/icon.svg">
|
||||
<pre><span>I</span>NTER
|
||||
<span>G</span>ALAKTISCHE
|
||||
<span>E</span>RFAHRUNGS
|
||||
<span>R</span>EISE</pre>
|
||||
</div>
|
||||
<input class="nav-toggle" id="toggleMainNav" type="checkbox">
|
||||
<label class="nav-burger" for="toggleMainNav">
|
||||
<div></div>
|
||||
|
|
Loading…
Reference in New Issue