aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorhellekin <hellekin@cepheide.org>2020-11-22 12:49:35 +0100
committerhellekin <hellekin@cepheide.org>2020-11-22 12:49:35 +0100
commitd7068cb4f6158795894624d5fab6b1a4cfb956de (patch)
tree4710642102c5a61f4b39be4b58b0cc73b9a41923
parent61826b1166b602231abda2a2cf61495e40c3d76f (diff)
downloaddream.public.cat-d7068cb4f6158795894624d5fab6b1a4cfb956de.tar.gz
Enhance contrast and readability
- Change link colors - Experiment with iframe colors - Experiment with tooltips (inspired by @dvn) but not active (the HTML was not changed)
-rw-r--r--main_style-004.css45
1 files changed, 41 insertions, 4 deletions
diff --git a/main_style-004.css b/main_style-004.css
index b715928..a99df7c 100644
--- a/main_style-004.css
+++ b/main_style-004.css
@@ -98,16 +98,16 @@ body {
}
:link {
- color: var(--ocean-green);
+ color: var(--opal2);
}
a:active {
- color: var(--celadon);
+ color: var(--light-gray);
}
a:hover, a:focus {
color: var(--screaming-green);
}
a:visited {
- color: var(--dark-sea-green);
+ color: var(--celadon);
}
h1, h2, h3, h4 {
@@ -211,6 +211,9 @@ main nav {
main nav a {
/* background-color: var(--vermilion); */
background-color: var(--orange-soda);
+ color: var(--arctic-lime);
+ font-weight: bold;
+ letter-spacing: 2pt;
border: none;
padding: 1rem 2rem;
text-align: center;
@@ -228,9 +231,35 @@ main nav a {
main nav a:hover {
box-shadow: 0 0 1px black;
}
+main nav a:link,
+main nav a:visited {
+ color: var(--dark-ocean-green);
+}
#pitch nav a {
bottom: -1.5rem;
}
+#pitch nav a span {
+ display:none;
+}
+#pitch nav a:hover span {
+ position: absolute;
+ top: calc(-40vh + 2rem);
+ margin: 0 auto;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ padding: 0;
+ font-size: 3rem;
+ height: auto;
+ line-height: 40vh;
+ width: calc(100%);
+ border-radius: 4rem;
+ background: url(https://images.unsplash.com/photo-1604542031658-5799ca5d7936?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1vZi10aGUtZGF5fHx8fGVufDB8fHw%3D&auto=format%2Ccompress&fit=crop&w=1000&h=1000) 50% 50%/cover no-repeat;
+ background-opacity: 0.4;
+ color: black;
+ opacity: 0.85;
+ display: block;
+}
nav>ul {
list-style: none;
@@ -338,9 +367,17 @@ body>footer a:visited {
.topics-list {
margin: 0 auto;
}
+.topics-list section {
+ border-radius: 2rem;
+ padding: 0.25rem 1rem;
+}
+.topics-list h2 a:link,
+.topics-list h2 a:visited {
+ color: var(--english-violet);
+}
.topics-list iframe {
width: 96vw; /* good for a single category */
- height: 55vh; /* with font-size: 1.5em in iframe body */
+ height: auto;
}
/**