Tiny HTML and CSS refactor
This commit is contained in:
parent
7eee4a5a5e
commit
e9ece025d0
@ -12,21 +12,19 @@ body {
|
||||
}
|
||||
|
||||
h1, h2, h3, h4 {
|
||||
display: inline;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.navbar-top-head {
|
||||
.navbar-top {
|
||||
padding: 12px;
|
||||
background: #472886;
|
||||
background: linear-gradient(0deg, rgba(71,40,134,1) 0%, rgba(81,24,195,1) 100%);
|
||||
}
|
||||
|
||||
.navbar-top-inner {
|
||||
.navbar-top .inner {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.navbar-top-inner a {
|
||||
.navbar-top .inner a {
|
||||
color: #f8f8f8;
|
||||
text-decoration: none;
|
||||
}
|
||||
@ -36,8 +34,7 @@ h1, h2, h3, h4 {
|
||||
background: rgb(54,148,37);
|
||||
background: linear-gradient(0deg, rgba(54,148,37,1) 0%, rgba(62,162,34,1) 50%, rgba(63,177,43,1) 100%);
|
||||
}
|
||||
|
||||
.login-statusbar-inner {
|
||||
.login-statusbar .inner {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
color: #fff;
|
||||
@ -49,11 +46,20 @@ h1, h2, h3, h4 {
|
||||
padding-bottom: 4px;
|
||||
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.login-statusbar-inner > a {
|
||||
.login-statusbar .inner > a {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.footer {
|
||||
background: #ddd;
|
||||
border-top: 1px solid #aaa;
|
||||
padding: 12px;
|
||||
}
|
||||
.footer .inner {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.grid-container {
|
||||
display: grid;
|
||||
grid-template-columns: max-content auto;
|
||||
@ -64,20 +70,19 @@ h1, h2, h3, h4 {
|
||||
padding: 12px;
|
||||
}
|
||||
|
||||
main img {
|
||||
.grid-container main img {
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
border: 1px solid #aaa;
|
||||
}
|
||||
|
||||
nav {
|
||||
background: #eee;
|
||||
.grid-container .nav-links {
|
||||
background: #e8e8e8;
|
||||
border: 1px solid #aaa;
|
||||
padding: 12px;
|
||||
}
|
||||
|
||||
nav > ul {
|
||||
.grid-container .nav-links ul {
|
||||
margin: 0;
|
||||
padding-left: 12px;
|
||||
}
|
||||
@ -86,17 +91,6 @@ a {
|
||||
color: rgb(0, 0, 255);
|
||||
}
|
||||
|
||||
footer {
|
||||
background: #ddd;
|
||||
border-top: 1px solid #aaa;
|
||||
padding: 12px;
|
||||
}
|
||||
|
||||
.footer-inner {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 600px) {
|
||||
.grid-container {
|
||||
grid-template-columns: auto;
|
||||
|
@ -10,8 +10,10 @@ if ($templateParameters["render"] === FALSE) {
|
||||
</div>
|
||||
|
||||
<footer>
|
||||
<div class="footer-inner">
|
||||
<small>Kopieringsrettigheter © 2021-2022 <a target="_blank" href="http://willy.club">WillySoft Solutions</a></small>
|
||||
<div class="footer">
|
||||
<div class="inner">
|
||||
<small>Kopieringsrettigheter © 2021-2022 <a target="_blank" href="http://willy.club">WillySoft Solutions</a></small>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
|
@ -17,33 +17,33 @@ if ($templateParameters["render"] === FALSE) {
|
||||
<link rel="icon" href="<?=$templateUrlPrefix;?>img/cropped-kf-propell-ikon-32x32.png" sizes="32x32">
|
||||
<body>
|
||||
|
||||
<div class="navbar-top-head">
|
||||
<div class="navbar-top-inner">
|
||||
<a href="<?=$templateUrlPrefix;?>" style="display: block; max-width: max-content;">
|
||||
<img style="display: block; height: 32px;" src="<?=$templateUrlPrefix;?>img/cropped-kf-propell-ikon-32x32.png" alt="">
|
||||
<div style="margin-left: 44px;">
|
||||
<div style="font-size: 24px; margin-top: -38px;">Stafett for livet</div>
|
||||
<div style="font-size: 10px; margin-top: -6px;"><b>KREFT</b>FORENINGEN</div>
|
||||
</div>
|
||||
</a>
|
||||
<header>
|
||||
<div class="navbar-top">
|
||||
<div class="inner">
|
||||
<a href="<?=$templateUrlPrefix;?>" style="display: block; max-width: max-content;">
|
||||
<img style="display: block; height: 32px;" src="<?=$templateUrlPrefix;?>img/cropped-kf-propell-ikon-32x32.png" alt="">
|
||||
<div style="margin-left: 44px;">
|
||||
<div style="font-size: 24px; margin-top: -38px;">Stafett for livet</div>
|
||||
<div style="font-size: 10px; margin-top: -6px;"><b>KREFT</b>FORENINGEN</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<?php if ((isset($_SESSION['logged_in'])) && ($_SESSION['logged_in'] === TRUE)) : ?>
|
||||
|
||||
<div class="login-statusbar">
|
||||
<div class="login-statusbar-inner">
|
||||
<div class="inner">
|
||||
<a href="<?=$templateUrlPrefix;?>logout.php" style="float: right;">Logg ut</a>
|
||||
<div>Inlogget som: <?=htmlspecialchars($_SESSION['username'])?></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="grid-container">
|
||||
|
||||
<div>
|
||||
<nav>
|
||||
<nav class="nav-links">
|
||||
<ul>
|
||||
<li><a href="<?=$templateUrlPrefix;?>">Forside</a></li>
|
||||
<li><a href="<?=$templateUrlPrefix;?>login.php">Logg inn</a></li>
|
||||
|
Reference in New Issue
Block a user