Skip to content

Commit

Permalink
Add stylelint to harmony (#6456)
Browse files Browse the repository at this point in the history
  • Loading branch information
dylanjeffers authored Oct 25, 2023
1 parent 084127a commit a9bae99
Show file tree
Hide file tree
Showing 10 changed files with 316 additions and 220 deletions.
File renamed without changes.
10 changes: 7 additions & 3 deletions packages/harmony/package.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "@audius/harmony",
"version": "0.0.5",
"description": "Audius Design System Component Library",
"description": "The Audius Design System",
"main": "dist/index.es.js",
"types": "dist/index.d.ts",
"module": "dist/index.es.js",
Expand All @@ -15,11 +15,15 @@
"test": "test-storybook",
"lint": "eslint src --ext=ts,tsx",
"lint:fix": "npm run lint -- --fix",
"stylelint": "stylelint 'src/**/*.css'",
"stylelint:fix": "npm run stylelint -- --fix",
"storybook": "storybook dev -p 6006",
"build-storybook": "storybook build",
"chromatic": "chromatic"
"chromatic": "chromatic",
"typecheck": "tsc --noEmit",
"verify": "concurrently \"npm:typecheck\" \"npm:lint:fix\" \"npm:stylelint:fix\""
},
"author": "KJ Shanks",
"author": "Audius",
"license": "ISC",
"devDependencies": {
"@babel/preset-env": "7.22.15",
Expand Down
18 changes: 12 additions & 6 deletions packages/harmony/src/assets/fonts/avenir.css

Large diffs are not rendered by default.

272 changes: 136 additions & 136 deletions packages/harmony/src/assets/styles/colors.css
Original file line number Diff line number Diff line change
Expand Up @@ -5,189 +5,189 @@
/* Theme Color Definitions */
:root {
/* Static Colors */
--harmony-static-white: #FFFFFF;
--harmony-static-white: #ffffff;
--harmony-static-black: #000000;
--harmony-static-primary: #CC0FE0;
--harmony-static-primary: #cc0fe0;

/* Default Theme (Day Theme) */
/* Primary Colors */
--harmony-primary: #CC0FE0;
--harmony-p-100: #D63FE6;
--harmony-p-200: #D127E3;
--harmony-p-300: #CC0FE0;
--harmony-p-400: #B80ECA;
--harmony-p-500: #A30CB3;
--harmony-primary: #cc0fe0;
--harmony-p-100: #d63fe6;
--harmony-p-200: #d127e3;
--harmony-p-300: #cc0fe0;
--harmony-p-400: #b80eca;
--harmony-p-500: #a30cb3;

/* Secondary Colors */
--harmony-secondary: #7E1BCC;
--harmony-s-100: #9849D6;
--harmony-s-200: #8B32D1;
--harmony-s-300: #7E1BCC;
--harmony-s-400: #7118B8;
--harmony-s-500: #6516A3;
--harmony-secondary: #7e1bcc;
--harmony-s-100: #9849d6;
--harmony-s-200: #8b32d1;
--harmony-s-300: #7e1bcc;
--harmony-s-400: #7118b8;
--harmony-s-500: #6516a3;

/* Neutral Colors */
--harmony-neutral: #858199;
--harmony-n-25: #FCFCFC;
--harmony-n-50: #F7F7F9;
--harmony-n-100: #F2F2F4;
--harmony-n-150: #E7E6EB;
--harmony-n-200: #DAD9E0;
--harmony-n-300: #CECDD6;
--harmony-n-400: #C2C0CC;
--harmony-n-500: #B6B3C2;
--harmony-n-600: #AAA7B8;
--harmony-n-700: #9D9AAD;
--harmony-n-25: #fcfcfc;
--harmony-n-50: #f7f7f9;
--harmony-n-100: #f2f2f4;
--harmony-n-150: #e7e6eb;
--harmony-n-200: #dad9e0;
--harmony-n-300: #cecdd6;
--harmony-n-400: #c2c0cc;
--harmony-n-500: #b6b3c2;
--harmony-n-600: #aaa7b8;
--harmony-n-700: #9d9aad;
--harmony-n-800: #858199;
--harmony-n-900: #78748A;
--harmony-n-950: #6A677A;
--harmony-n-900: #78748a;
--harmony-n-950: #6a677a;

/* Special Colors */
--harmony-white: #FFFFFF;
--harmony-background: #F3F0F7;
--harmony-blue: #1BA1F1;
--harmony-orange: #FF9400;
--harmony-red: #D0021B;
--harmony-dark-red: #BB0218;
--harmony-green: #0F9E48;
--harmony-light-green: #13C65A;
--harmony-gradient: linear-gradient(315deg, #5B23E1 0%, #A22FEB 100%);
--harmony-white: #ffffff;
--harmony-background: #f3f0f7;
--harmony-blue: #1ba1f1;
--harmony-orange: #ff9400;
--harmony-red: #d0021b;
--harmony-dark-red: #bb0218;
--harmony-green: #0f9e48;
--harmony-light-green: #13c65a;
--harmony-gradient: linear-gradient(315deg, #5b23e1 0%, #a22feb 100%);
}

/* Day Theme */
html[data-theme='day'] {
/* Primary Colors */
--harmony-primary: #CC0FE0;
--harmony-p-100: #D63FE6;
--harmony-p-200: #D127E3;
--harmony-p-300: #CC0FE0;
--harmony-p-400: #B80ECA;
--harmony-p-500: #A30CB3;
--harmony-primary: #cc0fe0;
--harmony-p-100: #d63fe6;
--harmony-p-200: #d127e3;
--harmony-p-300: #cc0fe0;
--harmony-p-400: #b80eca;
--harmony-p-500: #a30cb3;

/* Secondary Colors */
--harmony-secondary: #7E1BCC;
--harmony-s-100: #9849D6;
--harmony-s-200: #8B32D1;
--harmony-s-300: #7E1BCC;
--harmony-s-400: #7118B8;
--harmony-s-500: #6516A3;
--harmony-secondary: #7e1bcc;
--harmony-s-100: #9849d6;
--harmony-s-200: #8b32d1;
--harmony-s-300: #7e1bcc;
--harmony-s-400: #7118b8;
--harmony-s-500: #6516a3;

/* Neutral Colors */
--harmony-neutral: #858199;
--harmony-n-25: #FCFCFC;
--harmony-n-50: #F7F7F9;
--harmony-n-100: #F2F2F4;
--harmony-n-150: #E7E6EB;
--harmony-n-200: #DAD9E0;
--harmony-n-300: #CECDD6;
--harmony-n-400: #C2C0CC;
--harmony-n-500: #B6B3C2;
--harmony-n-600: #AAA7B8;
--harmony-n-700: #9D9AAD;
--harmony-n-25: #fcfcfc;
--harmony-n-50: #f7f7f9;
--harmony-n-100: #f2f2f4;
--harmony-n-150: #e7e6eb;
--harmony-n-200: #dad9e0;
--harmony-n-300: #cecdd6;
--harmony-n-400: #c2c0cc;
--harmony-n-500: #b6b3c2;
--harmony-n-600: #aaa7b8;
--harmony-n-700: #9d9aad;
--harmony-n-800: #858199;
--harmony-n-900: #78748A;
--harmony-n-950: #6A677A;
--harmony-n-900: #78748a;
--harmony-n-950: #6a677a;

/* Special Colors */
--harmony-white: #FFFFFF;
--harmony-background: #F3F0F7;
--harmony-blue: #1BA1F1;
--harmony-orange: #FF9400;
--harmony-red: #D0021B;
--harmony-dark-red: #BB0218;
--harmony-green: #0F9E48;
--harmony-light-green: #13C65A;
--harmony-gradient: linear-gradient(315deg, #5B23E1 0%, #A22FEB 100%);
--harmony-white: #ffffff;
--harmony-background: #f3f0f7;
--harmony-blue: #1ba1f1;
--harmony-orange: #ff9400;
--harmony-red: #d0021b;
--harmony-dark-red: #bb0218;
--harmony-green: #0f9e48;
--harmony-light-green: #13c65a;
--harmony-gradient: linear-gradient(315deg, #5b23e1 0%, #a22feb 100%);
}

/* Dark Theme */
html[data-theme='dark'] {
/* Primary Colors */
--harmony-primary: #C74BD3;
--harmony-p-100: #A945B9;
--harmony-p-200: #B748C6;
--harmony-p-300: #C74BD3;
--harmony-p-400: #C556D4;
--harmony-p-500: #C563D6;
--harmony-primary: #c74bd3;
--harmony-p-100: #a945b9;
--harmony-p-200: #b748c6;
--harmony-p-300: #c74bd3;
--harmony-p-400: #c556d4;
--harmony-p-500: #c563d6;

/* Secondary Colors */
--harmony-secondary: #9147CC;
--harmony-s-100: #7440A4;
--harmony-s-200: #8244B8;
--harmony-s-300: #9147CC;
--harmony-s-400: #975ACD;
--harmony-s-500: #9A60CF;
--harmony-secondary: #9147cc;
--harmony-s-100: #7440a4;
--harmony-s-200: #8244b8;
--harmony-s-300: #9147cc;
--harmony-s-400: #975acd;
--harmony-s-500: #9a60cf;

/* Neutral Colors */
--harmony-neutral: #BEC5E0;
--harmony-n-25: #35364F;
--harmony-n-50: #393A54;
--harmony-n-100: #3F415B;
--harmony-n-150: #4E4F6A;
--harmony-n-200: #5A5E78;
--harmony-n-300: #696D88;
--harmony-n-400: #777C96;
--harmony-n-500: #868AA4;
--harmony-n-600: #9399B3;
--harmony-n-700: #A2A8C2;
--harmony-n-800: #BEC5E0;
--harmony-n-900: #CFD5EC;
--harmony-n-950: #D9DEF1;
--harmony-neutral: #bec5e0;
--harmony-n-25: #35364f;
--harmony-n-50: #393a54;
--harmony-n-100: #3f415b;
--harmony-n-150: #4e4f6a;
--harmony-n-200: #5a5e78;
--harmony-n-300: #696d88;
--harmony-n-400: #777c96;
--harmony-n-500: #868aa4;
--harmony-n-600: #9399b3;
--harmony-n-700: #a2a8c2;
--harmony-n-800: #bec5e0;
--harmony-n-900: #cfd5ec;
--harmony-n-950: #d9def1;

/* Special Colors */
--harmony-white: #32334D;
--harmony-white: #32334d;
--harmony-background: #242438;
--harmony-blue: #58B9F4;
--harmony-orange: #EFA947;
--harmony-red: #F9344C;
--harmony-dark-red: #C43047;
--harmony-green: #6CDF44;
--harmony-light-green: #13C65A;
--harmony-gradient: linear-gradient(315deg, #7652CC 0%, #B05CE6 100%);
--harmony-blue: #58b9f4;
--harmony-orange: #efa947;
--harmony-red: #f9344c;
--harmony-dark-red: #c43047;
--harmony-green: #6cdf44;
--harmony-light-green: #13c65a;
--harmony-gradient: linear-gradient(315deg, #7652cc 0%, #b05ce6 100%);
}

/* Matrix Theme */
html[data-theme='matrix'] {
/* Primary Colors */
--harmony-primary: #0CF10C;
--harmony-p-100: #0CF10C;
--harmony-p-200: #0CF10C;
--harmony-p-300: #0CF10C;
--harmony-p-400: #0CF10C;
--harmony-p-500: #0CF10C;
--harmony-primary: #0cf10c;
--harmony-p-100: #0cf10c;
--harmony-p-200: #0cf10c;
--harmony-p-300: #0cf10c;
--harmony-p-400: #0cf10c;
--harmony-p-500: #0cf10c;

/* Secondary Colors */
--harmony-secondary: #184F17;
--harmony-s-100: #184F17;
--harmony-s-200: #184F17;
--harmony-s-300: #184F17;
--harmony-s-400: #184F17;
--harmony-s-500: #184F17;
--harmony-secondary: #184f17;
--harmony-s-100: #184f17;
--harmony-s-200: #184f17;
--harmony-s-300: #184f17;
--harmony-s-400: #184f17;
--harmony-s-500: #184f17;

/* Neutral Colors */
--harmony-neutral: #21B404;
--harmony-n-25: #1D211B;
--harmony-n-50: #202A1D;
--harmony-n-100: #1A2F15;
--harmony-n-150: #1B3714;
--harmony-n-200: #1C5610;
--harmony-n-300: #1D5E0F;
--harmony-n-400: #1D660E;
--harmony-n-500: #1F850A;
--harmony-n-600: #1F9508;
--harmony-n-700: #20A406;
--harmony-n-800: #21B404;
--harmony-n-900: #21B404;
--harmony-n-950: #21B404;
--harmony-neutral: #21b404;
--harmony-n-25: #1d211b;
--harmony-n-50: #202a1d;
--harmony-n-100: #1a2f15;
--harmony-n-150: #1b3714;
--harmony-n-200: #1c5610;
--harmony-n-300: #1d5e0f;
--harmony-n-400: #1d660e;
--harmony-n-500: #1f850a;
--harmony-n-600: #1f9508;
--harmony-n-700: #20a406;
--harmony-n-800: #21b404;
--harmony-n-900: #21b404;
--harmony-n-950: #21b404;

/* Special Colors */
--harmony-white: #1F211F;
--harmony-white: #1f211f;
--harmony-background: #191818;
--harmony-blue: #58B9F4;
--harmony-orange: #EFA947;
--harmony-red: #F9344C;
--harmony-dark-red: #BB0218;
--harmony-green: #6CDF44;
--harmony-light-green: #13C65A;
--harmony-gradient: linear-gradient(315deg, #7652CC 0%, #B05CE6 100%);
--harmony-blue: #58b9f4;
--harmony-orange: #efa947;
--harmony-red: #f9344c;
--harmony-dark-red: #bb0218;
--harmony-green: #6cdf44;
--harmony-light-green: #13c65a;
--harmony-gradient: linear-gradient(315deg, #7652cc 0%, #b05ce6 100%);
}
3 changes: 2 additions & 1 deletion packages/harmony/src/assets/styles/fonts.css
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,8 @@
*/
:root,
root {
--harmony-font-family: 'Avenir Next LT Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif;
--harmony-font-family: 'Avenir Next LT Pro', 'Helvetica Neue', Helvetica,
Arial, sans-serif;

/* Font Sizes */
--harmony-font-2xs: 10px;
Expand Down
Loading

0 comments on commit a9bae99

Please sign in to comment.