summaryrefslogtreecommitdiff
path: root/out/main.css
diff options
context:
space:
mode:
Diffstat (limited to 'out/main.css')
-rw-r--r--out/main.css233
1 files changed, 145 insertions, 88 deletions
diff --git a/out/main.css b/out/main.css
index 511cb85..278d4f5 100644
--- a/out/main.css
+++ b/out/main.css
@@ -1,83 +1,93 @@
+@import url(https://fonts.googleapis.com/css?family=Neucha|Patrick+Hand+SC);
+* {
+ box-sizing: border-box; }
+
body {
margin: 0;
padding: 0;
- font-family: Baskerville, "Goudy Old Style", "Palatino", "Book Antiqua", "Warnock Pro", serif; }
+ background: ivory; }
+ body a {
+ text-decoration: none;
+ color: #1963b6; }
+ body a:hover, body a:focus {
+ text-decoration: underline; }
+ body a:visited {
+ color: #460fb3; }
+ body a.external {
+ background-position: center right;
+ background-repeat: no-repeat;
+ background-image: url(external.svg);
+ background-size: 12px 12px;
+ padding-right: 13px; }
+ body a.feed {
+ background-position: center left;
+ background-repeat: no-repeat;
+ background-image: url(feed.svg);
+ background-size: 0.65em 0.65em;
+ padding-left: 0.8em; }
header {
- width: 100%; }
+ width: 20%;
+ position: fixed;
+ height: 100%;
+ left: 0;
+ top: 0;
+ display: flex;
+ flex-direction: column;
+ text-align: center;
+ font-family: 'Patrick Hand SC', sans-serif;
+ background-color: #c8c8a0; }
header h1 {
- margin: 0;
- background-color: rgba(0, 0, 0, 0.6);
- padding: 4px;
- padding-bottom: 0;
- text-align: middle; }
- header h1 a:first-child {
- font-size: 50px;
- color: white; }
- header h1, header h1 a:not(:first-child) {
- color: white;
- font-size: 15px;
- color: white; }
+ background-color: #ce795e;
+ padding: 0.5em 0;
+ margin: 0; }
header h1 a {
- text-decoration: none; }
- header h1 a:hover, header h1 a:focus {
- text-decoration: underline; }
- header nav {
- /* layout */
- line-height: 1;
- width: 100%;
- /* pretty */
- background-color: Maroon; }
- header nav ul {
- padding: 0;
- margin: 0;
- list-style: none; }
- header nav li {
- display: inline-block; }
- header nav a {
- display: block; }
- header nav a {
- padding: 0.2em 1em;
- font-size: 40px;
- color: GoldenRod;
- text-decoration: none; }
- header nav a:hover, header nav a:focus {
- background-color: white; }
- header nav a:hover, header nav a:visited {
- color: GoldenRod; }
- header nav a:active {
- color: Black; }
- header nav form {
- padding: 0.2em 0;
- font-size: 40px;
- display: block; }
- header nav form input {
- font-size: 25px;
- border: solid 1px #333333;
- vertical-align: middle; }
- header nav form input[type="search"] {
- max-width: 10em; }
- header nav form input:first-child {
- border-top-left-radius: 4px;
- border-bottom-left-radius: 4px; }
- header nav form input:not(:last-child) {
- border-right: 0; }
- header nav form input:last-child {
- border-top-right-radius: 4px;
- border-bottom-right-radius: 4px; }
+ color: black !important; }
+ header nav ul {
+ display: flex;
+ flex-direction: column;
+ margin: 0;
+ padding: 0; }
+ header nav ul li {
+ display: block;
+ font-size: 2em;
+ margin: 0.25em 0.5em;
+ border: 2px solid #41403e;
+ border-top-left-radius: 255px 15px;
+ border-top-right-radius: 15px 225px;
+ border-bottom-right-radius: 225px 15px;
+ border-bottom-left-radius: 15px 255px;
+ background-color: #f0f0f0;
+ transition: background-color 0.5s ease; }
+ header nav ul li:hover {
+ background-color: #c8c8c8; }
+ header nav ul li form {
+ display: inline-block;
+ width: calc(100% - 0.5em);
+ line-height: 0;
+ margin: 0.25em 0; }
+ header nav ul li form input {
+ width: 100%; }
+
+article, footer {
+ width: 80%;
+ margin-left: 20%;
+ font-family: 'Neucha', sans-serif;
+ padding: 1em; }
article {
- max-width: 6.5in;
- margin: 0 auto;
- border-bottom: solid 1px #333333; }
+ overflow: hidden;
+ border-bottom: solid 1px #c9cacc; }
article .tag {
font-size: 60%;
- font-family: Baskerville, "Goudy Old Style", "Palatino", "Book Antiqua", "Warnock Pro", serif;
- color: white;
- text-decoration: none;
+ color: white !important;
text-align: center;
+ margin-left: 2px;
padding: 4px 7px 5px 7px;
- border-radius: 2px; }
+ border-top-left-radius: 255px 15px;
+ border-top-right-radius: 15px 225px;
+ border-bottom-right-radius: 225px 15px;
+ border-bottom-left-radius: 15px 255px; }
article .tag.ff {
background: FireBrick; }
article .tag.ss {
@@ -90,33 +100,80 @@ article {
background: DarkSlateGray; }
article .tag.wp {
background: GhostWhite;
- color: black; }
+ color: black !important;
+ border-color: Gray;
+ border: solid 1.2px LightGray; }
footer {
- max-width: 6.5in;
- margin: 0 auto;
- padding: 1em 0;
- font-size: 60%; }
+ font-size: 70%; }
footer p {
margin: 0; }
-body.index article ul {
- list-style: none;
- display: table;
- padding: 0; }
- body.index article ul li {
- display: table-row;
- line-height: 1.3em; }
- body.index article ul li > * {
- display: table-cell;
- padding-right: 0.1em; }
-body.index article a.external {
- background-position: center right;
- background-repeat: no-repeat;
- background-image: url(external.svg);
- background-size: 12px 12px;
- padding-right: 13px; }
+/* Index pages ****************************************************************/
+body.index article {
+ display: flex;
+ flex-direction: row;
+ flex-wrap: wrap;
+ align-items: flex-start;
+ font-family: 'Patrick Hand SC', sans-serif; }
+ body.index article > h1 {
+ display: block;
+ width: 100%;
+ text-align: center;
+ margin: 0; }
+ body.index article > ul {
+ display: flex;
+ flex-direction: row;
+ flex-wrap: wrap;
+ align-items: flex-start;
+ width: 100%;
+ padding: 0;
+ margin: 0; }
+ body.index article > ul li {
+ display: block;
+ background-color: white;
+ border: 2px solid #e6e7e9;
+ padding: 1em;
+ margin: 1em;
+ box-shadow: 15px 28px 25px -18px rgba(0, 0, 0, 0.2);
+ transition: box-shadow .5s ease; }
+ body.index article > ul li:hover {
+ box-shadow: 2px 8px 4px -6px rgba(0, 0, 0, 0.3); }
+ body.index article > section {
+ display: block;
+ background-color: white;
+ border: 2px solid #e6e7e9;
+ padding: 1em;
+ margin: 1em;
+ box-shadow: 15px 28px 25px -18px rgba(0, 0, 0, 0.2);
+ transition: box-shadow .5s ease; }
+ body.index article > section:hover {
+ box-shadow: 2px 8px 4px -6px rgba(0, 0, 0, 0.3); }
+ body.index article > section h2 {
+ margin-top: 0; }
+ body.index article > section ul {
+ display: flex;
+ flex-direction: column;
+ padding: 0;
+ margin: 0; }
+ body.index article > section ul li {
+ display: flex;
+ flex-direction: row;
+ justify-content: space-between;
+ padding: 0.5em 0;
+ border-top: 1px dashed #d9d9d8; }
+ body.index article > section ul li .link-main {
+ display: inline-block;
+ max-width: 12em;
+ line-height: 1.5em; }
+ body.index article > section ul li .link-categories {
+ display: flex;
+ flex-direction: row;
+ flex-wrap: wrap;
+ justify-content: flex-end;
+ align-items: flex-start; }
+/* D&D-style pages ************************************************************/
body.dnd {
background: url(dnd/background.png) repeat-y;
background-size: 100%;