sapper-example/static/global.css at master · radical-ui/sapper-example · 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
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
/* Copied from https://unpkg.com/svelte-toolbox/public/global.css */

/* Roberto font */
@import url('https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i&display=swap&subset=cyrillic,cyrillic-ext,greek,greek-ext,latin-ext,vietnamese');

:root {
	font-family: 'Roboto', sans-serif;

    /* ripple */
    --ripple-color: rgba(0, 0, 0, 0.3);

	/* buttons */
	--buttons: #303ba6;
	--primary-buttons-text-color: white;
	--buttons-hover-color: #303ca649;
	--primary-buttons-hover-color: var(--buttons);
	--buttons-ripple-color: #303ca69d;
	--primary-buttons-ripple-color: rgba(255, 255, 255, 0.5);

	/* inputs */
	--inputs: var(--buttons);
	--inputs-background: #ecebeb;
	--inputs-background-hover: #ebebeb;
	--inputs-background-focus: #e7e4e4;
	--inputs-placeholder: #696969;
	--inputs-outline: grey;
	--inputs-outline-hover: var(--inputs-outline);

	/* switch */
	--switch-on-color: green;
	--switch-off-color: #ddd;
	--switch-on-color-track: rgba(16, 122, 4, 0.5);
	--switch-off-color-track: #aaa;
	--switch-active-color: rgba(187, 187, 187, 0.253);
	--switch-on-active-color: rgba(16, 122, 4, 0.2);
	--switch-hover-color: rgba(0, 0, 0, 0.07);
	--switch-hover-on-color: rgba(16, 112, 4, 0.07);

	/* IconButtons */
	--icon-buttons: var(--buttons);
	--icon-buttons-hover: rgba(0, 0, 0, 0.07);
	--icon-buttons-active: rgba(0, 0, 0, 0.1);
	--icon-buttons-ripple: rgba(0, 0, 0, 0.2);

	/* error */
	--all-errors: #b00020;
}

/* icons */
@font-face {
	font-family: 'Material Icons';
	font-style: normal;
	font-weight: 400;
	src: url(https://fonts.gstatic.com/s/materialicons/v47/flUhRq6tzZclQEJ-Vdg-IuiaDsNcIhQ8tQ.woff2)
		format('woff2');
}

.material-icons {
	font-family: 'Material Icons';
	font-weight: normal;
	font-style: normal;
	font-size: 24px;
	line-height: 1;
	letter-spacing: normal;
	text-transform: none;
	display: inline-block;
	white-space: nowrap;
	word-wrap: normal;
	direction: ltr;
	-webkit-font-feature-settings: 'liga';
	font-feature-settings: 'liga';
	-webkit-font-smoothing: antialiased;
}