Skip to content

Commit 451a05f

Browse files
catarakcatarak
committed
Make minor adjustments in all themes
1 parent edb5187 commit 451a05f

File tree

9 files changed

+54
-43
lines changed

9 files changed

+54
-43
lines changed

‎client/styles/abstracts/_placeholders.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -172,7 +172,7 @@
172172
%link {
173173
@include themify() {
174174
text-decoration: none;
175-
color: getThemifyVariable('secondary-text-color');
175+
color: getThemifyVariable('inactive-text-color');
176176
cursor: pointer;
177177
&:hover {
178178
text-decoration: none;

‎client/styles/abstracts/_variables.scss‎

Lines changed: 16 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,7 @@ $darkest: #000;
3737
$themes: (
3838
light: (
3939
logo-color: $p5js-pink,
40+
logo-background-color: $lightest,
4041
heavy-text-color: $darker,
4142
primary-text-color: $dark,
4243
secondary-text-color: $medium-dark,
@@ -75,6 +76,7 @@ $themes: (
7576
file-selected-color: $medium-light,
7677
input-text-color: $dark,
7778
input-background-color: $lightest,
79+
input-secondary-background-color: $lightest,
7880
input-border-color: $middle-light,
7981
search-background-color: $lightest,
8082
search-clear-background-color: $light,
@@ -109,6 +111,7 @@ $themes: (
109111
),
110112
dark: (
111113
logo-color: $p5js-pink,
114+
logo-background-color: $lightest,
112115
heavy-text-color: $lightest,
113116
primary-text-color: $lightest,
114117
dropzone-text-color: $black,
@@ -147,6 +150,7 @@ $themes: (
147150
file-selected-color: $medium-dark,
148151
input-text-color: $lightest,
149152
input-background-color: $dark,
153+
input-secondary-background-color: $medium-dark,
150154
input-border-color: $middle-dark,
151155
search-background-color: $lightest,
152156
search-clear-background-color: $medium-dark,
@@ -179,6 +183,7 @@ $themes: (
179183
),
180184
contrast: (
181185
logo-color: $yellow,
186+
logo-background-color: $darker,
182187
heavy-text-color: $yellow,
183188
primary-text-color: $lightest,
184189
dropzone-text-color: $black,
@@ -217,6 +222,7 @@ $themes: (
217222
file-selected-color: $medium-dark,
218223
input-text-color: $lightest,
219224
input-background-color: $dark,
225+
input-secondary-background-color: $medium-dark,
220226
input-border-color: $middle-dark,
221227
search-background-color: $white,
222228
search-clear-background-color: $medium-dark,
@@ -226,7 +232,7 @@ $themes: (
226232
nav-hover-color: $yellow,
227233
nav-border-color: $middle-dark,
228234
error-color: $p5-contrast-pink,
229-
table-row-stripe-color: dark,
235+
table-row-stripe-color: $dark,
230236
codefold-icon-open: url(../images/triangle-arrow-down-white.svg),
231237
codefold-icon-closed: url(../images/triangle-arrow-right-white.svg),
232238

@@ -249,11 +255,16 @@ $themes: (
249255
)
250256
);
251257

252-
$console-warn-color: #ffbe05;
253-
$console-error-color: #ff5f52;
254-
255-
$toast-background-color: #4A4A4A;
258+
$toast-background-color: $medium-dark;
256259
$toast-text-color: $lightest;
257260

261+
$light-console-error-color: #D11518;
262+
$light-console-warn-color: #FAAF00;
263+
$light-console-debug-color: #007BBB;
264+
265+
$dark-console-error-color: #DF3A3D;
266+
$dark-console-warn-color: #F5BC38;
267+
$dark-console-debug-color: #0C99E2;
268+
258269
$about-play-background-color: rgba(255, 255, 255, 0.7);
259270
$about-button-border-color: rgba(151, 151, 151, 0.7);

‎client/styles/components/_collection.scss‎

Lines changed: 4 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -39,12 +39,8 @@
3939
// padding: #{8 / $base-font-size}rem 0;
4040
}
4141

42-
.collection-metadata__name .editable-input__label span {
43-
padding: 0.83333rem 0;
44-
45-
@include themify() {
46-
color: getThemifyVariable('primary-text-color');
47-
}
42+
.collection-metadata__name .editable-input__label {
43+
padding: 0.83333rem #{7 / $base-font-size}rem;
4844
}
4945

5046
.collection-metadata__name,
@@ -63,9 +59,9 @@
6359
}
6460

6561
.collection-metadata__description {
66-
margin-top: #{8 / $base-font-size}rem;
62+
padding-top: #{8 / $base-font-size}rem;
6763
text-align: left;
68-
font-size: 14px;
64+
font-size: #{14 / $base-font-size}rem;
6965
}
7066

7167
.collection-metadata__description .editable-input__label {

‎client/styles/components/_editable-input.scss‎

Lines changed: 12 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -4,15 +4,18 @@
44
align-items: center;
55
}
66

7-
.editable-input__label {
7+
button.editable-input__label {
88
display: flex;
99

1010
@include themify() {
1111
color: getThemifyVariable('inactive-text-color');
12+
& path {
13+
fill: getThemifyVariable('inactive-text-color');
14+
}
1215
&:hover {
13-
color: getThemifyVariable('primary-text-color');
14-
& .editable-input__icon path {
15-
fill: getThemifyVariable('primary-text-color');
16+
color: getThemifyVariable('logo-color');
17+
& path {
18+
fill: getThemifyVariable('logo-color');
1619
}
1720
}
1821
}
@@ -23,23 +26,13 @@
2326
font-weight: unset;
2427
}
2528

29+
.editable-input__input {
30+
width: 100%;
31+
}
32+
2633
.editable-input__icon svg {
2734
width: 1.5rem;
2835
height: 1.5rem;
29-
30-
@include themify() {
31-
path {
32-
fill: getThemifyVariable('inactive-text-color');
33-
}
34-
}
35-
}
36-
37-
.editable-input:hover {
38-
@include themify() {
39-
.editable-input__icon path {
40-
fill: getThemifyVariable('primary-text-color');
41-
}
42-
}
4336
}
4437

4538
.editable-input--is-not-editing .editable-input__input,
@@ -49,5 +42,5 @@
4942

5043
.editable-input--is-editing .editable-input__input,
5144
.editable-input--is-not-editing .editable-input__label {
52-
display: block;
45+
display: flex;
5346
}

‎client/styles/components/_nav.scss‎

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -173,13 +173,19 @@
173173
}
174174
.svg__logo g > path {
175175
@include themify() {
176-
fill: getThemifyVariable('logo-color');
177-
}
176+
fill: getThemifyVariable('logo-color');
177+
}
178178
}
179179
.svg__logo g g:first-of-type path {
180180
fill: none;
181181
}
182182

183+
.svg__logo g g:first-of-type use {
184+
@include themify() {
185+
fill: getThemifyVariable('logo-background-color');
186+
}
187+
}
188+
183189
.nav__keyboard-shortcut {
184190
font-size: #{12 / $base-font-size}rem;
185191
font-family: Inconsololata, monospace;

‎client/styles/components/_preferences.scss‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -99,9 +99,9 @@
9999

100100
.preference__label {
101101
@include themify() {
102-
color: getThemifyVariable("inactive-text-color");
102+
color: getThemifyVariable("secondary-text-color");
103103
&:hover {
104-
color: getThemifyVariable("primary-text-color");
104+
color: getThemifyVariable("heavy-text-color");
105105
}
106106
}
107107
margin: #{-15 / $base-font-size}rem 0 0 #{-5 / $base-font-size}rem;

‎client/styles/components/_sidebar.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -235,7 +235,7 @@
235235
margin-right: #{5 / $base-font-size}rem;
236236
& g {
237237
@include themify() {
238-
fill: getThemifyVariable('icon-color');
238+
fill: getThemifyVariable('secondary-text-color');
239239
}
240240
}
241241
& svg {

‎client/styles/components/_toolbar.scss‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -109,11 +109,11 @@
109109

110110
.toolbar__project-name {
111111
@include themify() {
112-
color: getThemifyVariable('logo-color');
112+
color: getThemifyVariable('secondary-text-color');
113113
&:hover {
114-
color: getThemifyVariable('primary-text-color');
114+
color: getThemifyVariable('logo-color');
115115
& .toolbar__edit-name-button path {
116-
fill: getThemifyVariable('primary-text-color');
116+
fill: getThemifyVariable('logo-color');
117117
}
118118
}
119119
}
@@ -159,7 +159,7 @@
159159
}
160160
@include themify() {
161161
& path {
162-
fill: getThemifyVariable('logo-color');
162+
fill: getThemifyVariable('secondary-text-color');
163163
}
164164
}
165165
}

‎client/styles/components/_uploader.scss‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,14 @@
11
.dropzone {
22
@include themify() {
3-
color: getThemifyVariable('dropzone-text-color');
3+
background-color: getThemifyVariable('input-secondary-background-color');
4+
color: getThemifyVariable('input-text-color');
45
}
56
}
67

8+
.dropzone .dz-preview.dz-image-preview {
9+
background-color: transparent;
10+
}
11+
712
.uploader {
813
min-height: #{200 / $base-font-size}rem;
914
width: 100%;

0 commit comments

Comments
 (0)