Very rough sample in place
This commit is contained in:
parent
ac32fa394f
commit
a43e45b237
|
@ -1,10 +1,15 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<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>
|
||||
<body>
|
||||
<div>
|
||||
<div id="header-block">
|
||||
<h1> Example </h1>
|
||||
</div>
|
||||
<div id="content-block">
|
||||
{% block content %}{% endblock %}
|
||||
</div>
|
||||
</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