summaryrefslogtreecommitdiff
path: root/css
diff options
context:
space:
mode:
Diffstat (limited to 'css')
-rw-r--r--css/base.css38
-rw-r--r--css/content.css34
-rw-r--r--css/main.css6
-rw-r--r--css/nojs.css2
-rw-r--r--css/page.css25
-rw-r--r--css/pageFooter.css0
-rw-r--r--css/pageHeader.css (renamed from css/pghdr.css)8
-rw-r--r--css/pgftr.css18
-rw-r--r--css/root.css23
9 files changed, 60 insertions, 94 deletions
diff --git a/css/base.css b/css/base.css
index 094f0c8..fc0cd76 100644
--- a/css/base.css
+++ b/css/base.css
@@ -2,11 +2,11 @@
margin-top:1rem;
}
-div.graphicsPreview + *,img + *,ol + *,p.graphicText + *,p.large + *,p.small + *,ul + *,table + * {
+div.graphicsPreview + *,img + *,ol + *,p.large + *,p.small + *,ul + *,table + * {
margin-top:1rem;
}
-ol ol,ol ul,p.large + p.small,p.small + p.small,ul ol, ul ul {
+ol ol,ol ul,ul ol, ul ul {
margin-top:0;
}
@@ -33,13 +33,13 @@ p.pageTitle {
}
p.pageTitle {
- font-size: 3rem;
- text-align: center;
+ font-size: 3rem;
+ text-align: center;
+ font-weight:bold;
}
p.pageTitle sub {
- font-size: 1rem;
- font-style:italic;
+ font-size:1rem;
}
p.large {
@@ -47,12 +47,11 @@ p.large {
font-weight: bold;
}
-p.small,p.graphicText {
- font-size:calc(11rem / 12);
-}
-
p.small {
+ font-size: calc(7rem / 8);
+ font-style: italic;
font-weight:bold;
+ margin-top: 0;
}
p.small span.data + span.data::before {
@@ -77,8 +76,8 @@ div.graphicsPreview {
}
div.graphicsPreview img {
- background-color:var(--backgroundColour);
- border-color: var(--backgroundColour);
+ background-color:var(--backgroundColour0);
+ border-color: var(--backgroundColour0);
border-radius: calc(1rem / 3 * 2);
border-style: solid;
border-width: calc(1rem / 3);
@@ -87,15 +86,6 @@ div.graphicsPreview img {
max-width: 12rem;
}
-p.graphicText {
- font-style:italic;
- margin-top:calc(1rem / 2);
-}
-
-p.graphicText + p.graphicText {
- margin-top:0;
-}
-
img {
background-color:var(--foregroundColour);
border-color: var(--foregroundColour);
@@ -114,7 +104,7 @@ p img {
}
img.mcBanner {
- background-color:var(--backgroundColour);
+ background-color:var(--backgroundColour1);
border-radius: 0;
border-style: none;
height: 6rem;
@@ -146,7 +136,7 @@ table {
border-color: var(--foregroundColour);
border-style: solid;
border-width: calc(1rem / 12);
- color: var(--backgroundColour);
+ color: var(--backgroundColour0);
}
table.data {
@@ -165,7 +155,7 @@ table tr td,table tr th {
}
table tr td {
- background-color:var(--backgroundColour);
+ background-color:var(--backgroundColour0);
color: var(--foregroundColour);
}
diff --git a/css/content.css b/css/content.css
deleted file mode 100644
index 08b5b8b..0000000
--- a/css/content.css
+++ /dev/null
@@ -1,34 +0,0 @@
-div.content {
- background-color:var(--backgroundColour);
- border-top-color:var(--foregroundColour);
- border-top-style:solid;
- border-top-width:calc(1rem / 3);
- box-sizing: border-box;
- height: 100%;
- margin: auto;
- max-width: var(--maximumPageWidth);
- min-width: var(--minimumPageWidth);
- padding: 1rem 2rem;
- padding-bottom: calc(3rem / 2 + 2rem);
- width: 100%;
-}
-
-div.section + div.section::before {
- content: "";
- background-color:var(--colour);
- display: block;
- height: calc(1rem / 3);
- margin: 1rem 0;
- width: calc(100% / 2);
-}
-
-div.subsection {
- border-left-color:var(--colour);
- border-left-style:solid;
- border-left-width:calc(1rem / 3);
- padding: 0 1rem;
-}
-
-div.subsection + div.subsection {
- margin-top:1rem;
-}
diff --git a/css/main.css b/css/main.css
index d1980d8..c05e8f8 100644
--- a/css/main.css
+++ b/css/main.css
@@ -2,6 +2,6 @@
@import "/css/base.css";
-@import "/css/pghdr.css";
-@import "/css/content.css";
-@import "/css/pgftr.css";
+@import "/css/pageHeader.css";
+@import "/css/page.css";
+@import "/css/pageFooter.css";
diff --git a/css/nojs.css b/css/nojs.css
index c49504d..a793d2f 100644
--- a/css/nojs.css
+++ b/css/nojs.css
@@ -2,7 +2,7 @@ img.themeToggler {
display:none;
}
-div.content {
+div.page {
padding-bottom:1rem;
}
diff --git a/css/page.css b/css/page.css
new file mode 100644
index 0000000..1a94139
--- /dev/null
+++ b/css/page.css
@@ -0,0 +1,25 @@
+div.page {
+ background-color: var(--backgroundColour1);
+ border-bottom-left-radius: 1rem;
+ border-bottom-right-radius:1rem;
+ border-top-color: var(--foregroundColour);
+ border-top-style: solid;
+ border-top-width: calc(1rem / 3);
+ box-sizing: border-box;
+ height: 100%;
+ margin: auto;
+ margin-bottom: 1rem;
+ max-width: var(--maximumPageWidth);
+ min-width: var(--minimumPageWidth);
+ padding: 1rem 2rem;
+ width: 100%;
+}
+
+div.section + div.section::before {
+ content: "";
+ background-color:var(--colour);
+ display: block;
+ height: calc(1rem / 3);
+ margin: 1rem 0;
+ width: calc(100% / 2);
+}
diff --git a/css/pageFooter.css b/css/pageFooter.css
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/css/pageFooter.css
diff --git a/css/pghdr.css b/css/pageHeader.css
index 4944ff7..baeecfd 100644
--- a/css/pghdr.css
+++ b/css/pageHeader.css
@@ -16,7 +16,7 @@ div.navbar p span.section + span.section::before {
}
div.navbar p,div.navbar p span.section a,div.navbar p span.section a:visited {
- color: var(--backgroundColour);
+ color: var(--backgroundColour0);
text-decoration:none;
}
@@ -33,12 +33,12 @@ div.navbar p span.section a.mandelbrot-link:hover {
}
div.navbar img.themeToggler {
- background-color:var(--backgroundColour);
- border-color: var(--backgroundColour);
+ background-color:var(--backgroundColour0);
+ border-color: var(--backgroundColour0);
border-radius: calc(1rem / 3 * 2);
border-width: calc(1rem / 3);
border-style: solid;
- color: var(--backgroundColour);
+ color: var(--backgroundColour0);
cursor: pointer;
display: block;
margin: 0 auto;
diff --git a/css/pgftr.css b/css/pgftr.css
deleted file mode 100644
index 7a229a7..0000000
--- a/css/pgftr.css
+++ /dev/null
@@ -1,18 +0,0 @@
-div.toTop {
- background-color: var(--foregroundColour);
- border-radius: calc(1rem / 3);
- bottom: 1rem;
- cursor: pointer;
- display: block;
- height: 1rem;
- left: calc(100vw / 2 - 6rem / 2);
- opacity: calc(1 / 2);
- position: fixed;
- width: 6rem;
- z-index: 1;
-}
-
-div.toTop:hover {
- height: calc(3rem / 2);
- opacity:1;
-}
diff --git a/css/root.css b/css/root.css
index 4ff2826..258c4ea 100644
--- a/css/root.css
+++ b/css/root.css
@@ -1,14 +1,17 @@
:root {
- --black: #2E2E2E;
- --white: #FCF9F9;
- --red: #A6192E; /* 187 C */
- --yellow:#FFA400; /* 137 C */
- --green: #00965E; /* 340 C */
- --blue: #006BA6; /* 307 C */
+ --black: #202020;
+ --darkgrey: #2B2B2B;
+ --lightgrey:#EAEAEA;
+ --white: #F4F4F4;
+ --red: #A50034; /* 207 C */
+ --yellow: #FFA400; /* 137 C */
+ --green: #00965E; /* 340 C */
+ --blue: #006BA6; /* 307 C */
- --backgroundColour:var(--black);
- --foregroundColour:var(--white);
- --colour: var(--red);
+ --backgroundColour0:var(--black);
+ --backgroundColour1:var(--darkgrey);
+ --foregroundColour: var(--white);
+ --colour: var(--red);
--minimumPageWidth:12rem;
--maximumPageWidth:52rem;
@@ -23,6 +26,6 @@
}
body {
- background-color:var(--backgroundColour);
+ background-color:var(--backgroundColour0);
color: var(--foregroundColour);
}