homer77
/
PodcastLektor
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Bassic stylesheet

This commit is contained in:
Homer S. 2022-02-10 22:37:51 +01:00
parent 4dafd4cbfc
commit eabf4c1f5b
2 changed files with 63 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

66
Podcast/assets/static/style.css
View File

@ -1,6 +1,7 @@
body { body {
font-family: 'Verdana', sans-serif; font-family: 'Verdana', sans-serif;
margin: 50px 25px; margin:0;
} }
a { a {
@ -11,32 +12,75 @@ a:hover {
color: #33bbdf; color: #33bbdf;
} }
header, footer, div.page {
width: 760px; header {
margin: 0 auto; display: flex;
background: #daeef3; flex-flow: row-reverse wrap;
padding: 20px 30px;
height:auto;
width:100%;
background: transparent;
} }
header h1 { header h1 {
color: #169bbd; flex: 1;
background: #5522ee;
color: #4010b0;
margin: 0; margin: 0;
font-weight: normal; font-weight: normal;
font-size: 42px; font-size: 42px;
} }
header nav {
background:#4010b0;
color: #5522ee;
flex: 3;
}
header nav ul { header nav ul {
display: flex;
flex-flow: row wrap;
justify-content: space-around;
width:100%;
list-style: none; list-style: none;
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
header nav ul li { header nav ul li {
display: inline; display: block;
margin: 0 8px 0 0; margin:0;
padding: 0; padding: 0;
} }
div.page { header nav ul li a {
background: #f1fbfe; color: #5522ee;
text-decoration: none;
font-weight: bold;
}
header nav ul li a:hover {
color: #7744ff;
}
div#flex {
display: flex;
flex-flow: row wrap;
}
main {
flex: 3;
background: #4010b0;
color: #5522ee;
}
aside {
flex: 1;
background: #5522ee;
color: #4010b0;
}
footer {
width:100%;
height:auto;
} }

11
Podcast/templates/layout.html
View File

@ -4,7 +4,7 @@
<title>{% block title %}Welcome{% endblock %} — PodcastLektor</title> <title>{% block title %}Welcome{% endblock %} — PodcastLektor</title>
<body> <body>
<header> <header>
<h1>PodcastLektor</h1> <h1>Podcast</h1>
<nav> <nav>
<ul class="nav navbar-nav"> <ul class="nav navbar-nav">
<li{% if this._path == '/' %} class="active"{% endif <li{% if this._path == '/' %} class="active"{% endif
@ -18,10 +18,15 @@
%}><a href="{{ href|url }}">{{ title }}</a></li> %}><a href="{{ href|url }}">{{ title }}</a></li>
{% endfor %} {% endfor %}
</ul> </ul>
</nav> </nav>
</header> </header>
<div class="page"> <div id="flex">
<main>
{% block body %}{% endblock %} {% block body %}{% endblock %}
</main>
<aside>
{% block aside %}<h1>Widgets</h1>{% endblock %}
</aside>
</div> </div>
<footer> <footer>
&copy; Copyright 2022 by Homer S.. &copy; Copyright 2022 by Homer S..