HackethonClient/styleguide.css at main · Akashpluralsight/HackethonClient · GitHub

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
43
44
45
46
47
48
49
50
51
:root {
  --headings-heading-4-font-family: "PSTT Commons-DemiBold", Helvetica;
  --headings-heading-4-font-size: 18px;
  --headings-heading-4-font-style: normal;
  --headings-heading-4-font-weight: 700;
  --headings-heading-4-letter-spacing: 0px;
  --headings-heading-4-line-height: 125%;
  --label-xsmall-font-family: "PSTT Commons-Regular", Helvetica;
  --label-xsmall-font-size: 12px;
  --label-xsmall-font-style: normal;
  --label-xsmall-font-weight: 400;
  --label-xsmall-letter-spacing: 0.3px;
  --label-xsmall-line-height: 16px;
  --palette-blue10: rgba(0, 68, 107, 1);
  --palette-yellow6: rgba(250, 208, 0, 1);
  --pando-colors-default-surface: rgba(19, 15, 37, 1);
  --pando-colors-default-text-medium: rgba(165, 170, 207, 1);
  --pando-colors-default-text-weak: rgba(139, 144, 193, 1);
  --paragraph-small-font-family: "PSTT Commons-Regular", Helvetica;
  --paragraph-small-font-size: 14px;
  --paragraph-small-font-style: normal;
  --paragraph-small-font-weight: 400;
  --paragraph-small-letter-spacing: 0.14px;
  --paragraph-small-line-height: 24px;
  --primary-actionbackground: rgba(0, 132, 189, 1);
  --text-iconhigh-on-dark: rgba(255, 255, 255, 0.95);
}

/*

To enable a theme in your HTML, simply add one of the following data attributes to an HTML element, like so:

<body data-pando-colors-mode="dark">
    <!-- the rest of your content -->
</body>

You can apply the theme on any DOM node, not just the `body`

*/

[data-pando-colors-mode="dark"] {
  --pando-colors-default-surface: rgba(19, 15, 37, 1);
  --pando-colors-default-text-medium: rgba(165, 170, 207, 1);
  --pando-colors-default-text-weak: rgba(139, 144, 193, 1);
}

[data-pando-colors-mode="light"] {
  --pando-colors-default-surface: rgba(255, 255, 255, 1);
  --pando-colors-default-text-medium: rgba(78, 101, 131, 1);
  --pando-colors-default-text-weak: rgba(84, 111, 146, 1);
}