Very rough sample in place
This commit is contained in:
parent
ac32fa394f
commit
a43e45b237
|
@ -1,10 +1,15 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<title>Example</title>
|
<title>Example</title>
|
||||||
<style rel="stylesheet" href="/static/css/master.css"></style>
|
<link rel="stylesheet" type="text/css" href="/static/css/base.css" />
|
||||||
|
<link rel="stylesheet" type="text/css" href="/static/css/master.css" />
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div>
|
<div id="header-block">
|
||||||
|
<h1> Example </h1>
|
||||||
|
</div>
|
||||||
|
<div id="content-block">
|
||||||
{% block content %}{% endblock %}
|
{% block content %}{% endblock %}
|
||||||
</div>
|
</div>
|
||||||
</body>
|
</body>
|
||||||
|
|
|
@ -0,0 +1,22 @@
|
||||||
|
div {
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
body, html, div, p, h1, h2, h3, h4, h5 {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
font-family: sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
:root {
|
||||||
|
--site-width: 960px;
|
||||||
|
|
||||||
|
--bgcolor-1: rgb(225,220,220);
|
||||||
|
--bgcolor-2: rgb(250,250,250);
|
||||||
|
--bgcolor-3: rgb(245,65,45);
|
||||||
|
|
||||||
|
--header-height: 50px;
|
||||||
|
|
||||||
|
--shadow-size: 8px;
|
||||||
|
--shadow-color: rgba(0,0,0,0.35);
|
||||||
|
}
|
|
@ -1 +1,23 @@
|
||||||
/* Nothing here yet */
|
body {
|
||||||
|
background-color: var(--bgcolor-1);
|
||||||
|
}
|
||||||
|
|
||||||
|
#header-block {
|
||||||
|
display: block;
|
||||||
|
width: 100vw;
|
||||||
|
height: var(--header-height);
|
||||||
|
background-color: var(--bgcolor-3);
|
||||||
|
box-shadow: 0px 0px var(--shadow-size) var(--shadow-color);
|
||||||
|
margin-bottom: translateY(-100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
#content-block {
|
||||||
|
display: block;
|
||||||
|
max-width: var(--site-width);
|
||||||
|
width: 100vw;
|
||||||
|
padding: 10px;
|
||||||
|
background-color: var(--bgcolor-2);
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
box-shadow: 0px 0px var(--shadow-size) var(--shadow-color);
|
||||||
|
}
|
||||||
|
|
Loading…
Reference in New Issue