lynnesbian
/
recipe-site
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

some more css

This commit is contained in:
Lynne Megido 2020-03-01 17:36:48 +10:00
parent cb10d8a7a7
commit af61f630bd
Signed by: lynnesbian
GPG Key ID: F0A184B5213D9F90
3 changed files with 50 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
_includes/ingredients.html
View File

@ -5,6 +5,6 @@
<{{tag}}>Ingredients</{{tag}}>
<ul>
{% for item in page.ingredients -%}
<li>{{ item[0] }} {%- if item[2] %} {{ item[2] }} of {% endif -%} {{ item[1] }}</li>
<li>{{ item[0] }} {%- if item[2] %} {{ item[2] }} of {%- endif %} {{ item[1] }}</li>
{% endfor -%}
</ul>

2
_layouts/default.html
View File

@ -9,7 +9,7 @@
</head>
<body>
<div>
<div id='main'>
{{ content }}
</div>

51
style.css
View File

@ -1,17 +1,48 @@
html {
overflow-y: scroll; /* force scrollbar to appear to stop elements jumping around when the scrollbar appears naturally */
}
body {
font-family: "DejaVu Sans", "Bitstream Vera Sans", "Helvetica", "Roboto", sans-serif;
display: flex;
flex-direction: column;
min-height: 100vh;
background: #fafafa;
margin: 0;
}
body div {
#main {
flex-grow: 1;
}
h1 {
margin: 0;
padding: 20px 0;
text-align: center;
background: linear-gradient(to right, turquoise, transparent 80%);
}
h2 {
padding-left: 10px;
background: linear-gradient(to right, turquoise 5px, transparent 5px 100%);
}
h1, h2, h3, h4, h5, h6 {
font-weight: 400;
}
h3 {
font-size: 1.3em;
}
h4 {
font-size: 1.2em;
margin: 0.75em 0;
}
.subrecipe {
background: #eee;
padding: 5px;
padding: 10px;
border-radius: 10px;
}
.subrecipe, p {
margin-left: 10px;
margin-right: 10px;
}
.subrecipe h3 {
margin: 0;
@ -33,6 +64,8 @@ body div {
}
.subrecipe-toggle::after {
font-style: italic;
font-size: 0.75em;
vertical-align: text-top;
}
.subrecipe .subrecipe-toggle::after {
content: "Show";
@ -41,6 +74,14 @@ body div {
content: "Hide";
}
a {
color: turquoise;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
ul {
list-style-type: "- ";
}
@ -51,7 +92,11 @@ ul, ol {
footer {
text-align: center;
margin: 20px auto;
background: #333;
display: block;
width: 100%;
padding: 20px 0;
margin: 0;
}
footer, .subtle {
color: grey;