Skip to content

Commit 74a7971

Browse files
wintondeshongwintondeshong
authored
Merge pull request #3 from wintondeshong/master
SCSS for existing components
2 parents 5c6779a + 8700b46 commit 74a7971

27 files changed

Lines changed: 1453 additions & 27 deletions

‎.storybook/config.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import { setDefaults } from "@storybook/addon-info";
33
import { withKnobs } from "@storybook/addon-knobs";
44
import { withInfo } from "@storybook/addon-info";
55
import "./storybook.css";
6+
import "assets/scss/andculturecode-javascript-react-components.scss";
67

78
setDefaults({
89
header: true,

‎.travis.yml‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ before_script:
99
script:
1010
- npm run clean
1111
- npm run build-typescript
12+
- npm run build-storybook
1213
- npm run coverage
1314
- codecov --disable=gcov
1415
notifications:

‎package-lock.json‎

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

‎package.json‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,9 @@
2626
"@types/react-router-dom": "5.1.5",
2727
"andculturecode-javascript-core": "0.1.0",
2828
"andculturecode-javascript-react": "0.0.9",
29+
"andculturecode-scss-grid": "2.0.4",
2930
"axios": "0.19.2",
31+
"bourbon": "6.0.0",
3032
"i18next": "19.4.5",
3133
"immutable": "4.0.0-rc.12",
3234
"react": "16.11.0",
@@ -112,8 +114,8 @@
112114
},
113115
"scripts": {
114116
"build": "npm run build-typescript",
115-
"build-typescript": "tsc --pretty --project tsconfig.dist.json",
116117
"build-storybook": "build-storybook -o storybook",
118+
"build-typescript": "tsc --pretty --project tsconfig.dist.json",
117119
"clean": "rimraf dist && rimraf coverage",
118120
"coverage": "react-scripts test --coverage --watchAll=false",
119121
"deploy-storybook": "storybook-to-ghpages",

‎src/assets/scss/0-vendor/__vendor.scss‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
@import "~bourbon";
2+
@import "~andculturecode-scss-grid/src/andculturecode-scss-grid";

‎src/assets/scss/1-settings/__settings.scss‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
@import "breakpoints";
2+
@import "colors";
3+
@import "fonts";
4+
@import "grid";
5+
@import "particles";

‎src/assets/scss/1-settings/_breakpoints.scss‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
/*------------------------------------*\
2+
SETTINGS - BREAKPOINTS
3+
\*------------------------------------*/
4+
// Merge with andculturecode-scss-grid breakpoints
5+
$breakpoints: (
6+
"phone": 480px,
7+
"sm-tablet": 600px,
8+
"tablet": 768px,
9+
"laptop": 940px,
10+
"lg-laptop": 980px,
11+
"sm-desktop": 1024px,
12+
"desktop": 1180px,
13+
"lg-desktop": 1408px,
14+
"wide-desktop": 1664px,
15+
"ultrawide": 1920px,
16+
"super-ultrawide": 2560px,
17+
);

‎src/assets/scss/1-settings/_colors.scss‎

Lines changed: 75 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
/*------------------------------------*\
2+
SETTINGS - COLORS
3+
\*------------------------------------*/
4+
5+
$colors: (
6+
"accents": (
7+
"blue-dark": #007283,
8+
"blue-base": #00b0ca,
9+
"blue-light": #e3f1f8,
10+
"orange-light": #fff1d9,
11+
"yellow": #fdc82f,
12+
),
13+
"primary": (
14+
"black": #000000,
15+
"error": #d50032,
16+
),
17+
"secondary": (
18+
"blue": #3d5cc2,
19+
),
20+
"neutral": (
21+
"90": #001a39,
22+
"70": #646a82,
23+
"50": #aeb3c5,
24+
"30": #d4d6de,
25+
"05": #f1f1f4,
26+
"02": #f5f6fa,
27+
"white": #ffffff,
28+
"lighter": #fefefe,
29+
"light": #c5d4d8,
30+
"dark": #9ea7a9,
31+
"darker": #6e848c,
32+
"dark-text": #57666a,
33+
),
34+
"background": (
35+
"dark": #001a39,
36+
"medium": #425163,
37+
"neutral": #f1f1f4,
38+
"primary": #fefefe,
39+
"secondary": #f5f6fa,
40+
),
41+
"buttons": (
42+
"destructive": #ffd9e3,
43+
"destructive-hover": #d50032,
44+
"destructive-disabled": #d4d6de,
45+
"primary": #001a39,
46+
"primary-hover": #646a82,
47+
"primary-disabled": #d4d6de,
48+
"secondary": #ffffff,
49+
"secondary-border": #646a82,
50+
"secondary-hover": #f1f1f4,
51+
"secondary-disabled": #aeb3c5,
52+
"tertiary": #f1f1f4,
53+
"tertiary-alt": #ffffff,
54+
"tertiary-hover": #d4d6de,
55+
"tertiary-disabled": #f1f1f4,
56+
),
57+
"links": (
58+
"default": #001a39,
59+
"secondary": #ffffff,
60+
),
61+
"status": (
62+
"success": #61af27,
63+
"success-light": #eaf5e0,
64+
"success-dark": #2a5923,
65+
"warning": #ffa000,
66+
"warning-light": #fff1d9,
67+
"warning-dark": #8c3b17,
68+
"error": #d50032,
69+
"error-light": #ffd9e3,
70+
"error-dark": #9c0036,
71+
"info": #00b0ca,
72+
"info-light": #e3f1f8,
73+
"info-dark": #007283,
74+
),
75+
);

‎src/assets/scss/1-settings/_fonts.scss‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
/*------------------------------------*\
2+
SETTINGS - FONTS
3+
\*------------------------------------*/
4+
5+
@import url("https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,700,700i&display=swap");
6+
7+
$font-sizes: (
8+
"base": 16px,
9+
"large": 18px,
10+
"small": 14px,
11+
"xlarge": 24px,
12+
"xsmall": 12px,
13+
);
14+
15+
$line-heights: (
16+
"base": 1.2em,
17+
"large": 1.5em,
18+
"small": 1.5em,
19+
"xlarge": 1.4em,
20+
"xsmall": 1.5em,
21+
);
22+
23+
$font-weights: (
24+
"base": 400,
25+
"bold": 700,
26+
);
27+
28+
$font-primary: "Roboto", serif !default;
29+
$font-icon: "icomoon" !default;

‎src/assets/scss/1-settings/_grid.scss‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
/*------------------------------------*\
2+
SETTINGS - GRID
3+
\*------------------------------------*/
4+
5+
/*------------------------------------*\
6+
andculture-scss-grid overrides
7+
\*------------------------------------*/
8+
9+
$no-gutter-grid: (
10+
columns: 12,
11+
gutter: 0px,
12+
);

0 commit comments

Comments
 (0)