primer/css
1
1
Fork 0
mirror of https://github.com/primer/css.git synced 2025-01-07 14:58:54 +03:00
Code Issues Projects Releases Wiki Activity

Comment out some presentational variables and utilities

Browse Source 
To be tested on dotcom
This commit is contained in:
simurai 2021-03-04 16:44:46 +09:00
parent 434a935090
commit b3bc735db0
4 changed files with 79 additions and 79 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/links/link.scss
View File

@ -9,7 +9,7 @@
} }
} }
.link-gray-dark, // TODO: Deprecate // .link-gray-dark, // TODO: Deprecate
.Link--primary { .Link--primary {
color: var(--color-text-primary) !important; color: var(--color-text-primary) !important;
@ -18,7 +18,7 @@
} }
} }
.link-gray, // TODO: Deprecate // .link-gray, // TODO: Deprecate
.Link--secondary { .Link--secondary {
color: var(--color-text-secondary) !important; color: var(--color-text-secondary) !important;
@ -27,7 +27,7 @@
} }
} }
.muted-link, // TODO: Deprecate // .muted-link, // TODO: Deprecate
.Link--muted { .Link--muted {
color: var(--color-text-secondary) !important; color: var(--color-text-secondary) !important;
@ -39,7 +39,7 @@
// Set the link color only on hover // Set the link color only on hover
// Useful when you want only part of a link to turn blue on hover // Useful when you want only part of a link to turn blue on hover
.link-hover-blue, // TODO: Deprecate // .link-hover-blue, // TODO: Deprecate
.Link--onHover { .Link--onHover {
&:hover { &:hover {
color: var(--color-text-link) !important; color: var(--color-text-link) !important;

68
src/support/variables/colors.scss
View File

@ -8,68 +8,68 @@
// Color variables // Color variables
// Border colors // Border colors
$border-white: var(--color-border-inverse) !default; // $white // $border-white: var(--color-border-inverse) !default; // $white
$border-black-fade: $black-fade-15 !default; $border-black-fade: $black-fade-15 !default;
$border-white-fade: $white-fade-15 !default; $border-white-fade: $white-fade-15 !default;
$border-gray-dark: var(--color-border-tertiary) !default; // $gray-300 // $border-gray-dark: var(--color-border-tertiary) !default; // $gray-300
$border-gray-darker: $gray-700 !default; $border-gray-darker: $gray-700 !default;
$border-gray-light: var(--color-border-secondary) !default; // lighten($gray-200, 3%) // $border-gray-light: var(--color-border-secondary) !default; // lighten($gray-200, 3%)
$border-gray: var(--color-border-primary) !default; // $gray-200 // $border-gray: var(--color-border-primary) !default; // $gray-200
$border-blue: var(--color-border-info) !default; // $blue-500 // $border-blue: var(--color-border-info) !default; // $blue-500
$border-blue-light: $blue-200 !default; $border-blue-light: $blue-200 !default;
$border-green: var(--color-border-success) !default; // $green-400 // $border-green: var(--color-border-success) !default; // $green-400
$border-green-light: var(--color-discussion-border) !default; // desaturate($green-300, 40%) // $border-green-light: var(--color-discussion-border) !default; // desaturate($green-300, 40%)
$border-purple: $purple !default; $border-purple: $purple !default;
$border-red: var(--color-border-danger) !default; // $red/$red-500 // $border-red: var(--color-border-danger) !default; // $red/$red-500
$border-red-light: $red-300 !default; $border-red-light: $red-300 !default;
$border-yellow: var(--color-border-warning) !default; // $yellow-600 // $border-yellow: var(--color-border-warning) !default; // $yellow-600
// Background colors // Background colors
$bg-white: var(--color-bg-primary) !default; // $white // $bg-white: var(--color-bg-primary) !default; // $white
$bg-black: $black !default; $bg-black: $black !default;
$bg-black-fade: $black-fade-50 !default; $bg-black-fade: $black-fade-50 !default;
$bg-blue-light: var(--color-bg-info) !default; // $blue-000 // $bg-blue-light: var(--color-bg-info) !default; // $blue-000
$bg-blue: var(--color-bg-info-inverse) !default; // $blue-500 // $bg-blue: var(--color-bg-info-inverse) !default; // $blue-500
$bg-gray-dark: var(--color-bg-canvas-inverse) !default; // $gray-900 // $bg-gray-dark: var(--color-bg-canvas-inverse) !default; // $gray-900
$bg-gray-light: var(--color-bg-secondary) !default; // $gray-000 // $bg-gray-light: var(--color-bg-secondary) !default; // $gray-000
$bg-gray: var(--color-bg-tertiary) !default; // $gray-100 // $bg-gray: var(--color-bg-tertiary) !default; // $gray-100
$bg-green: var(--color-bg-success-inverse) !default; // $green-500 // $bg-green: var(--color-bg-success-inverse) !default; // $green-500
$bg-green-light: var(--color-bg-success) !default; // $green-100 // $bg-green-light: var(--color-bg-success) !default; // $green-100
$bg-orange: $orange-700 !default; $bg-orange: $orange-700 !default;
$bg-purple: $purple-500 !default; $bg-purple: $purple-500 !default;
$bg-purple-light: $purple-000 !default; $bg-purple-light: $purple-000 !default;
$bg-pink: $pink-500 !default; $bg-pink: $pink-500 !default;
$bg-red: var(--color-bg-danger-inverse) !default; // $red-500 // $bg-red: var(--color-bg-danger-inverse) !default; // $red-500
$bg-red-light: var(--color-bg-danger) !default; // $red-000 // $bg-red-light: var(--color-bg-danger) !default; // $red-000
$bg-yellow: var(--color-bg-warning-inverse) !default; // $yellow-500 // $bg-yellow: var(--color-bg-warning-inverse) !default; // $yellow-500
$bg-yellow-light: var(--color-bg-warning) !default; // $yellow-200 // $bg-yellow-light: var(--color-bg-warning) !default; // $yellow-200
$bg-yellow-dark: $yellow-700 !default; $bg-yellow-dark: $yellow-700 !default;
// Text colors // Text colors
$text-black: $black !default; $text-black: $black !default;
$text-white: var(--color-text-white) !default; // $white // $text-white: var(--color-text-white) !default; // $white
$text-blue: var(--color-text-link) !default; // $blue-500 // $text-blue: var(--color-text-link) !default; // $blue-500
$text-gray-dark: var(--color-text-primary) !default; // $gray-900 // $text-gray-dark: var(--color-text-primary) !default; // $gray-900
$text-gray-light: var(--color-text-tertiary) !default; // $gray-500 // $text-gray-light: var(--color-text-tertiary) !default; // $gray-500
$text-gray: var(--color-text-secondary) !default; // $gray-600 // $text-gray: var(--color-text-secondary) !default; // $gray-600
$text-green: var(--color-text-success) !default; // $green-600 // $text-green: var(--color-text-success) !default; // $green-600
$text-orange: $orange-900 !default; $text-orange: $orange-900 !default;
$text-orange-light: $orange-600 !default; $text-orange-light: $orange-600 !default;
$text-purple: $purple !default; $text-purple: $purple !default;
$text-pink: $pink-500 !default; $text-pink: $pink-500 !default;
$text-red: var(--color-text-danger) !default; // $red-600 // $text-red: var(--color-text-danger) !default; // $red-600
$text-yellow: var(--color-text-warning) !default; // $yellow-800 // $text-yellow: var(--color-text-warning) !default; // $yellow-800
// Misc ------------------------------------ // Misc ------------------------------------
// Border // Border
$border-color: $border-gray !default; $border-color: var(--color-border-primary) !default;
// Box shadow // Box shadow
$box-shadow: var(--color-shadow-small) !default; // $box-shadow: var(--color-shadow-small) !default;
$box-shadow-medium: var(--color-shadow-medium) !default; // $box-shadow-medium: var(--color-shadow-medium) !default;
$box-shadow-large: var(--color-shadow-large) !default; // $box-shadow-large: var(--color-shadow-large) !default;
$box-shadow-extra-large: var(--color-shadow-extra-large) !default; // $box-shadow-extra-large: var(--color-shadow-extra-large) !default;
$box-shadow-highlight: var(--color-shadow-highlight) !default; // top highlight $box-shadow-highlight: var(--color-shadow-highlight) !default; // top highlight
$box-shadow-inset: var(--color-shadow-inset) !default; // top inner shadow $box-shadow-inset: var(--color-shadow-inset) !default; // top inner shadow

24
src/utilities/box-shadow.scss
View File

@ -21,21 +21,21 @@
// Deprecated --------------------------------------- // Deprecated ---------------------------------------
// TODO: Remove once not used anymore. // TODO: Remove once not used anymore.
.box-shadow { // .box-shadow {
box-shadow: $box-shadow !important; // box-shadow: $box-shadow !important;
} // }
.box-shadow-medium { // .box-shadow-medium {
box-shadow: $box-shadow-medium !important; // box-shadow: $box-shadow-medium !important;
} // }
.box-shadow-large { // .box-shadow-large {
box-shadow: $box-shadow-large !important; // box-shadow: $box-shadow-large !important;
} // }
.box-shadow-extra-large { // .box-shadow-extra-large {
box-shadow: $box-shadow-extra-large !important; // box-shadow: $box-shadow-extra-large !important;
} // }
// Keep .box-shadow-none // Keep .box-shadow-none
// End of deprecation --------------------------------------- // End of deprecation ---------------------------------------

58
src/utilities/colors.scss
View File

@ -56,18 +56,18 @@
// Color utilities // Color utilities
// background colors // background colors
.bg-white { background-color: $bg-white !important; } // .bg-white { background-color: $bg-white !important; }
.bg-blue { background-color: $bg-blue !important; } // .bg-blue { background-color: $bg-blue !important; }
.bg-blue-light { background-color: $bg-blue-light !important; } // .bg-blue-light { background-color: $bg-blue-light !important; }
.bg-gray-dark { background-color: $bg-gray-dark !important; } // .bg-gray-dark { background-color: $bg-gray-dark !important; }
.bg-gray { background-color: $bg-gray !important; } // .bg-gray { background-color: $bg-gray !important; }
.bg-gray-light { background-color: $bg-gray-light !important; } // .bg-gray-light { background-color: $bg-gray-light !important; }
.bg-green { background-color: $bg-green !important; } // .bg-green { background-color: $bg-green !important; }
.bg-green-light { background-color: $bg-green-light !important; } // .bg-green-light { background-color: $bg-green-light !important; }
.bg-red { background-color: $bg-red !important; } // .bg-red { background-color: $bg-red !important; }
.bg-red-light { background-color: $bg-red-light !important; } // .bg-red-light { background-color: $bg-red-light !important; }
.bg-yellow { background-color: $bg-yellow !important; } // .bg-yellow { background-color: $bg-yellow !important; }
.bg-yellow-light { background-color: $bg-yellow-light !important; } // .bg-yellow-light { background-color: $bg-yellow-light !important; }
.bg-yellow-dark { background-color: $bg-yellow-dark !important; } .bg-yellow-dark { background-color: $bg-yellow-dark !important; }
.bg-purple { background-color: $bg-purple !important; } .bg-purple { background-color: $bg-purple !important; }
.bg-pink { background-color: $bg-pink !important; } .bg-pink { background-color: $bg-pink !important; }
@ -83,32 +83,32 @@
} }
// text colors // text colors
.text-blue { color: $text-blue !important; } // .text-blue { color: $text-blue !important; }
.text-red { color: $text-red !important; } // .text-red { color: $text-red !important; }
.text-gray-light { color: $text-gray-light !important; } // .text-gray-light { color: $text-gray-light !important; }
.text-gray { color: $text-gray !important; } // .text-gray { color: $text-gray !important; }
.text-gray-dark { color: $text-gray-dark !important; } // .text-gray-dark { color: $text-gray-dark !important; }
.text-green { color: $text-green !important; } // .text-green { color: $text-green !important; }
.text-yellow { color: $text-yellow !important; } // .text-yellow { color: $text-yellow !important; }
.text-orange { color: $text-orange !important; } .text-orange { color: $text-orange !important; }
.text-orange-light { color: $text-orange-light !important; } .text-orange-light { color: $text-orange-light !important; }
.text-purple { color: $text-purple !important; } .text-purple { color: $text-purple !important; }
.text-pink { color: $text-pink !important; } .text-pink { color: $text-pink !important; }
.text-white { color: $text-white !important; } // .text-white { color: $text-white !important; }
.text-inherit { color: inherit !important; } // TODO: Should this be moved to primer/primitives .text-inherit { color: inherit !important; } // TODO: Should this be moved to primer/primitives
// Border colors // Border colors
.border-blue { border-color: $border-blue !important; } // .border-blue { border-color: $border-blue !important; }
.border-blue-light { border-color: $border-blue-light !important; } .border-blue-light { border-color: $border-blue-light !important; }
.border-green { border-color: $border-green !important; } // .border-green { border-color: $border-green !important; }
.border-green-light { border-color: $border-green-light !important; } // .border-green-light { border-color: $border-green-light !important; }
.border-red { border-color: $border-red !important; } // .border-red { border-color: $border-red !important; }
.border-red-light { border-color: $border-red-light !important; } .border-red-light { border-color: $border-red-light !important; }
.border-purple { border-color: $border-purple !important; } .border-purple { border-color: $border-purple !important; }
.border-yellow { border-color: $border-yellow !important; } // .border-yellow { border-color: $border-yellow !important; }
.border-gray-light { border-color: $border-gray-light !important; } // .border-gray-light { border-color: $border-gray-light !important; }
.border-gray-dark { border-color: $border-gray-dark !important; } // .border-gray-dark { border-color: $border-gray-dark !important; }
.border-black-fade { border-color: $border-black-fade !important; } .border-black-fade { border-color: $border-black-fade !important; }
.border-white-fade { border-color: $border-white-fade !important; } .border-white-fade { border-color: $border-white-fade !important; }
@ -122,11 +122,11 @@
/* Typography colors */ /* Typography colors */
.lead { .lead {
color: $text-gray; color: var(--color-text-secondary);
} }
.text-emphasized { .text-emphasized {
color: $text-gray-dark; color: var(--color-text-primary);
} }
.text-shadow-dark { .text-shadow-dark {