Skip to content

Commit 4e461ed

Browse files
artjacobartjacob
committed
Definições de cores unificadas para a criação do tema escuro
1 parent 09b6304 commit 4e461ed

File tree

12 files changed

+102
-55
lines changed

12 files changed

+102
-55
lines changed

‎.firebase/hosting.ZGVwbG95.cache‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1-
manifest.json,1560825739467,21839584ab1f6e8f85ac70fd11a8267a2faadb7706a466b002c75918086e1835
21
icon.png,1539479478000,27a3dbeb5916976c7132eadd036f7cd61e270b7ac6377f6fc168a88f7548204c
3-
service-worker.js,1560825740435,ddcba25dfccc8d582cd0f7714a8f04cb4142f487799ff420002b4582d2a017db
2+
manifest.json,1560835484725,21839584ab1f6e8f85ac70fd11a8267a2faadb7706a466b002c75918086e1835
3+
service-worker.js,1560835485773,e00ce8c7df2917b9e4cbc43a565ce86a8e4edfb52c8146d20ff0d3cfc8af87e8
4+
cabin-700.woff2,1560822840262,4acbf2507da66ea28cbf223e043df6a10353339eb5d11bee6db1319de328cb7b
45
cabin-400.woff2,1560822820822,801ab0789a3952093806871540942b18eade36e94b545b2b6ec72a4f5392b6e7
5-
index.html,1560825740435,122450ab8578c05e9ee31453aeb1b83eb19314de934794ab66e43e8c03486993
6+
index.html,1560835485773,90e1d0047e5e33ef0d17552c20689691c3910d2f8d779ecf16f25ca9821a6d11
67
cabin-500.woff2,1560822819681,2730fa6d8cbacbaf3a531673b501845c4ae54dccae05bc005045694af5e0e057
7-
cabin-700.woff2,1560822840262,4acbf2507da66ea28cbf223e043df6a10353339eb5d11bee6db1319de328cb7b
88
material-icons.woff2,1560822804019,fe00fc3a31cd4aa80dbf1f7c69d03c2765da28e648728fb0603fa00d7a11b9c3

‎deploy/index.html‎

Lines changed: 1 addition & 1 deletion
Large diffs are not rendered by default.

‎deploy/service-worker.js‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎public/index.html‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@ <h1><span class="station-name"></span><span class="placeholder">Estações</span
3030
</div>
3131
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js" integrity="sha384-vk5WoKIaW/vJyUAd9n/wmopsmNhiy+L2Z+SBxGYnUkunIxVxAv/UtMOhba/xskxh" crossorigin="anonymous"></script>
3232
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js" integrity="sha384-fYxN7HsDOBRo1wT/NSZ0LkoNlcXvpDpFy6WzB42LxuKAX7sBwgo7vuins+E1HCaw" crossorigin="anonymous"></script>
33+
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/locale/pt-br.js" integrity="sha384-rMnAUuld2UG2Cd+wqmGwCPZGHemXzhyJss9LFN3y2b8FNsBOrGEHpbeUFMiP1rx+" crossorigin="anonymous"></script>
3334
<script src="vlt.js"></script>
3435
</body>
3536
</html>

‎public/service-worker.js‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,8 @@ self.addEventListener("install", (event) => {
2121
"/cabin-700.woff2",
2222
"/material-icons.woff2",
2323
"https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js",
24-
"https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"
24+
"https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js",
25+
"https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/locale/pt-br.js"
2526
]))
2627
);
2728
});

‎public/vlt.css‎

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎source/assets/service-worker.js‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,8 @@ self.addEventListener("install", (event) => {
2121
"/cabin-700.woff2",
2222
"/material-icons.woff2",
2323
"https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js",
24-
"https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"
24+
"https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js",
25+
"https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/locale/pt-br.js"
2526
]))
2627
);
2728
});

‎source/css/_loading.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@
1313
$loading-size: 32px;
1414
width: $loading-size;
1515
height: $loading-size;
16-
background-color: #0af;
16+
background-color: $loading-animation-color;
1717
animation: loading $transition-timing-function 0.9s infinite;
1818
}
1919
}

‎source/css/_panel.scss‎

Lines changed: 45 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -3,23 +3,44 @@
33
////////////////////////////////////////////////////////////////////////////////////////////////////
44

55
.panel {
6+
--panel-background-color: #{$panel-background-color};
7+
--panel-text-color: #{$panel-text-color};
8+
--panel-accent-text-color: #{$panel-accent-text-color};
9+
--panel-shadow-color: #{$panel-shadow-color};
10+
--panel-badge-color: #{$panel-badge-color};
11+
12+
@media (prefers-color-scheme: dark) {
13+
--panel-background-color: #{$panel-dark-background-color};
14+
--panel-text-color: #{$panel-dark-text-color};
15+
--panel-accent-text-color: #{$panel-dark-accent-text-color};
16+
--panel-shadow-color: #{$panel-dark-shadow-color};
17+
--panel-badge-color: #{$panel-dark-badge-color};
18+
}
19+
20+
.-theme--dark & {
21+
--panel-background-color: #{$panel-dark-background-color};
22+
--panel-text-color: #{$panel-dark-text-color};
23+
--panel-accent-text-color: #{$panel-dark-accent-text-color};
24+
--panel-shadow-color: #{$panel-dark-shadow-color};
25+
--panel-badge-color: #{$panel-dark-badge-color};
26+
}
27+
28+
////////////////////////////////////////////////////////////////////////////////////////////////
29+
630
position: fixed;
731
top: $appbar-size;
832
bottom: 0;
933
left: 0;
1034
right: 0;
11-
// margin: 12px;
1235
border-radius: $panel-border-radius $panel-border-radius 0 0;
13-
// outline: 2px dashed #f0a;
14-
// padding: 24px;
15-
background-color: #fff;
16-
color: #000;
36+
background-color: var(--panel-background-color);
37+
color: var(--panel-text-color);
1738
overflow: auto;
1839

1940
box-shadow:
20-
0 -2px 4px -1px rgba(#000, 0.2),
21-
0 -4px 5px 0 rgba(#000, 0.14),
22-
0 -1px 10px 0 rgba(#000, 0.12);
41+
0 -2px 4px -1px rgba(var(--panel-shadow-color), 0.2),
42+
0 -4px 5px 0 rgba(var(--panel-shadow-color), 0.14),
43+
0 -1px 10px 0 rgba(var(--panel-shadow-color), 0.12);
2344

2445
transition: transform $transition-timing-function 0.24s;
2546

@@ -50,7 +71,7 @@
5071
height: $appbar-size;
5172
padding: 0 18px;
5273
font-size: 18px;
53-
color: #525252;
74+
color: var(--panel-accent-text-color);
5475
cursor: default;
5576

5677
display: flex;
@@ -67,7 +88,7 @@
6788
padding-left: 44px;
6889
padding-bottom: 4px;
6990
font-size: 16px;
70-
color: #525252;
91+
color: var(--panel-accent-text-color);
7192
}
7293

7394
// Trem
@@ -116,22 +137,29 @@
116137
}
117138

118139
.status-badge {
119-
border: 1px solid #777;
140+
border: 1px solid var(--panel-accent-text-color);
120141
border-radius: 6px;
121142
padding: 2px 6px;
122143
font-size: 13px;
123-
color: #777;
144+
color: var(--panel-accent-text-color);
124145
text-align: center;
146+
transition: opacity 0.5s $transition-timing-function;
125147

126148
&.-state--real-time {
127-
border-color: $primary-color;
128-
color: $primary-color;
149+
border-color: var(--panel-badge-color);
150+
color: var(--panel-badge-color);
129151
text-transform: uppercase;
130152
}
131153

132-
&.-state--no-connection {
133-
border-color: $danger-color;
134-
color: $danger-color;
154+
// &.-state--no-connection {
155+
// border-color: $danger-color;
156+
// color: $danger-color;
157+
// }
158+
}
159+
160+
.-mode--list & {
161+
.status-badge {
162+
opacity: 0;
135163
}
136164
}
137165

@@ -167,11 +195,6 @@
167195
display: inline-block;
168196
padding-left: 12px;
169197
}
170-
171-
// box-shadow:
172-
// 0 1px 2px -1px rgba(#000, 0.2),
173-
// 0 2px 3px 0 rgba(#000, 0.14),
174-
// 0 1px 2px 0 rgba(#000, 0.12);
175198
}
176199
}
177200
}

‎source/css/_stations.scss‎

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@
2424
left: 6px;
2525
right: 6px;
2626
height: 1px;
27-
background-color: rgba(#fff, 0.25);
27+
background-color: $list-divider-color;
2828
opacity: 0;
2929
transition: opacity $transition-timing-function 0.24s;
3030
content: "";
@@ -96,17 +96,15 @@
9696
}
9797

9898
a {
99-
// height: $appbar-size;
10099
border-radius: $panel-border-radius * 0.75;
101100
padding: 9px 12px;
102-
// background-color: rgba(#fff, 0.05);
103101

104102
display: flex;
105103
align-items: center;
106104
justify-content: space-between;
107105

108106
&:hover {
109-
background-color: rgba(#fff, 0.1);
107+
background-color: $list-hover-background-color;
110108
}
111109
}
112110

@@ -123,7 +121,7 @@
123121
padding-bottom: 24px;
124122

125123
a {
126-
border: 1px solid#fff;
124+
border: 1px solid $list-text-color;
127125
justify-content: center;
128126

129127
span {

0 commit comments

Comments
 (0)