|
1 | | -* {/*global styles*/ |
2 | | - font-family: system-ui, Arial, Helvetica, sans-serif;/*set default font to system-based font*/ |
3 | | - line-height: 125%;/*set default line height to 125%*/ |
| 1 | +* { |
| 2 | + /*global styles*/ |
| 3 | + font-family: |
| 4 | + system-ui, Arial, Helvetica, sans-serif; /*set default font to system-based font*/ |
| 5 | + line-height: 125%; /*set default line height to 125%*/ |
4 | 6 | } |
5 | | -progress {/*progress element styles*/ |
6 | | - height: 50px; |
7 | | - padding: 5px; |
8 | | - max-width: 300px; |
9 | | - width: 100%; |
10 | | - accent-color: #4888c8; |
| 7 | +progress { |
| 8 | + /*progress element styles*/ |
| 9 | + height: 50px; |
| 10 | + padding: 5px; |
| 11 | + max-width: 300px; |
| 12 | + width: 100%; |
| 13 | + accent-color: #4888c8; |
11 | 14 | } |
12 | | -.progress-container {/*progress container styles*/ |
13 | | - position: relative; |
14 | | - width: 100%; |
15 | | - max-width: 300px; |
| 15 | +.progress-container { |
| 16 | + /*progress container styles*/ |
| 17 | + position: relative; |
| 18 | + width: 100%; |
| 19 | + max-width: 300px; |
16 | 20 | } |
17 | | -.progress-bar {/*progress bar styles*/ |
18 | | - width: 100%;/*use full width*/ |
| 21 | +.progress-bar { |
| 22 | + /*progress bar styles*/ |
| 23 | + width: 100%; /*use full width*/ |
19 | 24 | } |
20 | | -.progress-text {/*progress text styles*/ |
21 | | - position: absolute; |
22 | | - width: 100%;/*use full width*/ |
23 | | - text-align: center;/*center align text*/ |
24 | | - top: 15px; |
25 | | - color: black; |
| 25 | +.progress-text { |
| 26 | + /*progress text styles*/ |
| 27 | + position: absolute; |
| 28 | + width: 100%; /*use full width*/ |
| 29 | + text-align: center; /*center align text*/ |
| 30 | + top: 15px; |
| 31 | + color: black; |
26 | 32 | } |
27 | | -.popup-message {/*popup message styles*/ |
28 | | - position: absolute; |
29 | | - top: 20px; |
30 | | - right: 20px; |
31 | | - transform: translate(-50%, -50%); |
32 | | - background-color: #fff; |
33 | | - border: 1px solid #999; |
34 | | - padding: 20px; |
35 | | - border-radius: 10px; |
36 | | - box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); |
| 33 | +.popup-message { |
| 34 | + /*popup message styles*/ |
| 35 | + position: absolute; |
| 36 | + top: 20px; |
| 37 | + right: 20px; |
| 38 | + transform: translate(-50%, -50%); |
| 39 | + background-color: #fff; |
| 40 | + border: 1px solid #999; |
| 41 | + padding: 20px; |
| 42 | + border-radius: 10px; |
| 43 | + box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); |
37 | 44 | } |
38 | 45 |
|
39 | | -.popup-message p {/*popup message paragraph styles*/ |
40 | | - font-size: 18px; |
41 | | - font-weight: bold; |
42 | | - color: #333;/*dark gray*/ |
| 46 | +.popup-message p { |
| 47 | + /*popup message paragraph styles*/ |
| 48 | + font-size: 18px; |
| 49 | + font-weight: bold; |
| 50 | + color: #333; /*dark gray*/ |
43 | 51 | } |
0 commit comments