Skip to content

Commit ac03e24

Browse files
jakefentressjakefentress
committed
updating color properties
1 parent 91b6e5e commit ac03e24

File tree

13 files changed

+64
-64
lines changed

13 files changed

+64
-64
lines changed

‎example-project/css/screen.css‎

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

‎example-project/scss/_1_base/properties/_colors.scss‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -2,18 +2,18 @@
22

33
// Color Roles
44
:root {
5-
--body-color: #{color('white')};
6-
--text-color: #{color('black')};
5+
--color-body: #{color('white')};
6+
--color-text: #{color('black')};
77

8-
--link-color: #{color('blue')};
9-
--link-color-hover: #{color('aqua')};
8+
--color-link: #{color('blue')};
9+
--color-link-hover: #{color('aqua')};
1010

11-
--border-color: #{color('gray')};
11+
--color-border: #{color('gray')};
1212

13-
--tap-highlight-color: rgba(0, 0, 0, 0.35);
14-
--highlight-color: #{color('blue')}; // used for text selections, etc.
13+
--color-tap-highlight: rgba(0, 0, 0, 0.35);
14+
--color-highlight: #{color('blue')}; // used for text selections, etc.
1515

16-
--placeholder-txt: #B2B2B2;
16+
--color-placeholder-txt: #B2B2B2;
1717

1818
// --error-bg: #FFE6E6;
1919
// --error-txt: #E04646;

‎example-project/scss/_3_elements/buttons/_settings.scss‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
@use 'config/borders' as *;
22

3-
$button-color: var(--text-color);
4-
$button-text-color: var(--body-color);
3+
$button-color: var(--color-text);
4+
$button-text-color: var(--color-body);
55

66
$button-font-size: var(--font-size-l);
77
$button-padding-v: 1em;
@@ -10,12 +10,12 @@ $button-padding-h: 3em;
1010
$button-border: $border-width $border-style transparent;
1111
$button-border-radius: $border-radius;
1212

13-
$button-active-color: var(--text-color);
14-
$button-active-text-color: var(--body-color);
13+
$button-active-color: var(--color-text);
14+
$button-active-text-color: var(--color-body);
1515
$button-active-border-color: transparent;
1616
$button-active-opacity: 0.75;
1717

18-
$button-hover-color: var(--body-color);
19-
$button-hover-text-color: var(--text-color);
20-
$button-hover-border-color: var(--text-color);
18+
$button-hover-color: var(--color-body);
19+
$button-hover-text-color: var(--color-text);
20+
$button-hover-border-color: var(--color-text);
2121
$button-hover-opacity: 0.85;

‎example-project/scss/_4_modules/modal/_settings.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
@use 'config/fonts' as *;
44

55
$modal-overlay-color: rgba(0, 0, 0, 0.6);
6-
$modal-background-color: var(--body-color);
6+
$modal-background-color: var(--color-body);
77

88
$modal-border-radius: $border-radius;
99
$modal-max-width: rem(500);

‎example-project/scss/config/_borders.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,4 +9,4 @@
99
$border-style: solid;
1010
$border-width: 1px;
1111
$border-radius: 3px;
12-
$border: $border-width $border-style var(--border-color);
12+
$border: $border-width $border-style var(--color-border);

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@fictivekin/fk-sass",
3-
"version": "1.0.6",
3+
"version": "1.0.7",
44
"description": "Fictive Kin starter sass framework",
55
"license": "MIT",
66
"scripts": {

‎scss/_1_base/_site-document.scss‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@
1818
//
1919
// --------------------------------------------------------
2020
html {
21-
background: var(--body-color);
21+
background: var(--color-body);
2222
min-height: 100%;
2323
}
2424

@@ -33,8 +33,8 @@ html {
3333
body {
3434
@include sans;
3535

36-
background: var(--body-color);
37-
color: var(--text-color);
36+
background: var(--color-body);
37+
color: var(--color-text);
3838
// font-size: set in _1_base/properties/_font-sizes.scss
3939
-moz-osx-font-smoothing: grayscale;
4040
-webkit-font-smoothing: antialiased;

‎scss/_1_base/properties/_colors.scss‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -2,18 +2,18 @@
22

33
// Color Roles
44
:root {
5-
--body-color: #{color('white')};
6-
--text-color: #{color('black')};
5+
--color-body: #{color('white')};
6+
--color-text: #{color('black')};
77

8-
--link-color: #{color('blue')};
9-
--link-color-hover: #{color('aqua')};
8+
--color-link: #{color('blue')};
9+
--color-link-hover: #{color('aqua')};
1010

11-
--border-color: #{color('gray')};
11+
--color-border: #{color('gray')};
1212

13-
--tap-highlight-color: rgba(0, 0, 0, 0.35);
14-
--highlight-color: #{color('blue')}; // used for text selections, etc.
13+
--color-tap-highlight: rgba(0, 0, 0, 0.35);
14+
--color-highlight: #{color('blue')}; // used for text selections, etc.
1515

16-
--placeholder-txt: #B2B2B2;
16+
--color-placeholder-txt: #B2B2B2;
1717

1818
// --error-bg: #FFE6E6;
1919
// --error-txt: #E04646;

‎scss/_3_elements/_links.scss‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -22,13 +22,13 @@
2222
//
2323
// --------------------------------------------------------
2424
a {
25-
color: var(--link-color);
25+
color: var(--color-link);
2626
transition: color $speed $ease;
2727
}
2828

2929
a:hover,
3030
a:focus {
31-
color: var(--link-color-hover);
31+
color: var(--color-link-hover);
3232
}
3333

3434

@@ -42,5 +42,5 @@ a:focus {
4242
//
4343
// --------------------------------------------------------
4444
body {
45-
-webkit-tap-highlight-color: var(--tap-highlight-color);
45+
-webkit-tap-highlight-color: var(--color-tap-highlight);
4646
}

‎scss/_3_elements/buttons/_settings.scss‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
@use 'config/borders' as *;
22

3-
$button-color: var(--text-color);
4-
$button-text-color: var(--body-color);
3+
$button-color: var(--color-text);
4+
$button-text-color: var(--color-body);
55

66
$button-font-size: var(--font-size-l);
77
$button-padding-v: 1em;
@@ -10,12 +10,12 @@ $button-padding-h: 3em;
1010
$button-border: $border-width $border-style transparent;
1111
$button-border-radius: $border-radius;
1212

13-
$button-active-color: var(--text-color);
14-
$button-active-text-color: var(--body-color);
13+
$button-active-color: var(--color-text);
14+
$button-active-text-color: var(--color-body);
1515
$button-active-border-color: transparent;
1616
$button-active-opacity: 0.75;
1717

18-
$button-hover-color: var(--body-color);
19-
$button-hover-text-color: var(--text-color);
20-
$button-hover-border-color: var(--text-color);
18+
$button-hover-color: var(--color-body);
19+
$button-hover-text-color: var(--color-text);
20+
$button-hover-border-color: var(--color-text);
2121
$button-hover-opacity: 0.85;

0 commit comments

Comments
 (0)