-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.css
82 lines (74 loc) · 2.54 KB
/
index.css
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
74
75
76
77
78
79
80
81
82
:root {
/* Colors */
--malga-checkout-color-page-background: #eef2f6;
--malga-checkout-color-brand-accent-light: #79dbd4;
--malga-checkout-color-brand-accent-normal: #39bfad;
--malga-checkout-color-brand-clean: #c3f4ef;
--malga-checkout-color-brand-light: #79dbd4;
--malga-checkout-color-brand-normal: #39bfad;
--malga-checkout-color-brand-middle: #2fac9b;
--malga-checkout-color-brand-dark: #147f70;
--malga-checkout-color-grey-light: #666666;
--malga-checkout-color-grey-normal: #4d4d4d;
--malga-checkout-color-grey-middle: #333333;
--malga-checkout-color-grey-dark: #1a1a1a;
--malga-checkout-color-grey-darkness: #000000;
--malga-checkout-color-accent-light: #ffffff;
--malga-checkout-color-accent-normal: #f1f1f1;
--malga-checkout-color-accent-middle: #cbcbcb;
--malga-checkout-color-warning-light: #fff8e6;
--malga-checkout-color-warning-normal: #f9df8d;
--malga-checkout-color-warning-middle: #ffa400;
--malga-checkout-color-modal-success: #00ae42;
--malga-checkout-color-modal-error: #ed3a3d;
--malga-checkout-color-modal-neutral: #4d4d4d;
--malga-checkout-color-modal-action-button-error: #000000;
--malga-checkout-color-modal-action-button-error-hover: #333333;
--malga-checkout-color-modal-action-button-success: #000000;
--malga-checkout-color-modal-action-button-success-hover: #333333;
--malga-checkout-color-modal-action-button-success-font-color: #ffffff;
--malga-checkout-color-modal-action-button-error-font-color: #ffffff;
/* Typography */
--malga-checkout-typography-family: "Inter", sans-serif;
/* Spacings */
--malga-checkout-spacing-xxs: 4px;
--malga-checkout-spacing-xs: 8px;
--malga-checkout-spacing-sm: 16px;
--malga-checkout-spacing-default: 24px;
--malga-checkout-spacing-md: 32px;
--malga-checkout-spacing-lg: 48px;
--malga-checkout-spacing-xlg: 64px;
--malga-checkout-spacing-xxlg: 96px;
/* Sizes */
--malga-checkout-size-min-width: 250px;
/* Border Radius */
--malga-checkout-border-radius-default: 4px;
--malga-checkout-border-radius-md: 6px;
--malga-checkout-border-radius-lg: 20px;
/* Transitions Time */
--malga-checkout-transition-slow: 0.3s;
--malga-checkout-transition-default: 0.5s;
}
body {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
background: #eef2f6;
margin: 0;
padding: 8px;
}
main {
display: flex;
justify-content: center;
align-items: center;
background: white;
border-radius: 8px;
padding: 10px;
}
@media only screen and (min-width: 600px) {
main {
padding: 50px;
width: 500px;
}
}