git ssb

0+

Grey the earthling / gkn.me.uk



Commit b11df5af2a5f37490c79adb7b59892579870e3a8

Change colours

Express the colours using HSL and HSLA,
because it's easier to understand and manipulate.
Exclude the logo colours because they don't need manipulating,
and they just look nicer in hex.

Tint the background colour green, so it feels warmer.
Make the background slightly lighter,
mainly so its lightness value is a pleasingly round number.

Produce the dim colours using transparency.
They match the parent colour exactly,
and harmonise with the background colour.

The dim text colour is slightly higher contrast (using opacity);
the separator colour is now slightly lower contrast.

Other than the background colour, most colours look broadly the same.
Greg K Nicholson committed on 2/24/2018, 7:23:54 PM
Parent: 3f2b4a099adb08762b60eabb9c55a07ace77c3a6

Files changed

themes/ran/static/style/ran.csschanged
themes/ran/static/style/ran.cssView
@@ -6,14 +6,14 @@
66
77 :root {
88 --primary-color: #60c030;
99 --secondary-color: #ffffff;
10- --background-color: #111;
11- --foreground-color: #ccc;
12- --foreground-dim-color: #888;
10 + --background-color: hsl(100, 10%, 10%);
11 + --foreground-color: hsl(100, 10%, 80%);
12 + --foreground-dim-color: hsla(100, 10%, 80%, 70%);
1313 --link-color: hsl(100, 100%, 70%);
14- --link-dim-color: hsl(100, 50%, 35%);
15- --separator-color: #888;
14 + --link-dim-color: hsla(100, 100%, 70%, 50%);
15 + --separator-color: hsla(100, 10%, 80%, 50%);
1616 --box-shadow-style: inset 0 -1px 0;
1717 --fast: 0.2s;
1818 --slow: 0.4s;
1919 }
@@ -115,9 +115,9 @@
115115 .bottomnav .logo {
116116 margin-top: 2rem;
117117 }
118118 .bottomnav .logo circle {
119- fill: var(--background-color);
119 + fill: transparent;
120120 stroke: var(--foreground-dim-color);
121121 stroke-width: 12px;
122122 }
123123

Built with git-ssb-web