1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
| :root {
/* mrmxf light pallette */
--mm-yellow: hsl(46, 50%, 52%);
--mm-green : hsl(80, 45%, 49%);
--mm-purple: hsl(324, 45%, 42%);
--mm-blue: hsl(243, 36%, 39%);
--mm-black: hsl(0, 0%, 0%);
--mm-dark: hsl(0, 0%, 20%);
--mm-light: hsl(0, 0%, 93%);
--mm-white: hsl(0, 0%, 100%);
/* mrmxf markup */
--acc1: var(-mm-yellow); /* default accent - heading text, primary button, diagram main elements etc. */
--acc2: var(-mm-purple); /* 2ndary accent - sidebars, heading text etc. */
--acc3: var(-mm-green); /* 3ary accent - links, reading times, */
--acc4: var(-mm-blue); /* 4ary accent - last resort - e.g. callouts, testing text */
--bg1: hsl(from var(-mm-yellow) h s 95%); /* desaturated accents for background */
--bg2: hsl(from var(-mm-purple) h s 95%); /* desaturated accents for background */
--bg3: hsl(from var(-mm-green) h s 95%); /* desaturated accents for background */
--bg4: hsl(from var(-mm-blue) h s 95%); /* desaturated accents for background */
--background: white;
--text: var(-mm-dark);
/* cartoon Bruce */
--shirtgrey: #cccccc;
--hatyellow: #FFEDB2;
--hair: #333333;
/* technical diagrams */
--mxf-picture: #F5F5a3;
--mxf-audio: #F5B8A3;
--mxf-data: #B8F5A3;
--mxf-meta: #A3A3F5;
--imf-cpl: #91B645;
--imf-pkl: #4D6E09;
--imf-opl: #9A3A73;
--imf-am: #433F87;
--imf-image: var(--mxf-picture);
--imf-audio: var(--mxf-audio);
--imf-caption: var(--mxf-data);
--imf-meta: var(--mxf-meta);
}
|
