Merge pull request #51456 from lloydk/fix-contrast
Reduce contrast of text and inline code elements [ci skip]
This commit is contained in:
Carlos Antonio da Silva
GitHub
commit
4a7c86af8f
@ -1 +1 @@
|
||||
<svg fill="none" height="18" viewBox="0 0 687 18" width="687" xmlns="http://www.w3.org/2000/svg"><path d="m358 8.50006 329-.00003" stroke="#fff"/><path d="m0 8.50006h329" stroke="#fff"/><path clip-rule="evenodd" d="m351.712 1.08696c.473.2102.934.44889 1.381.71432l-.071.65833c-.449-.25428-.911-.48052-1.385-.67682zm-16.859 8.6916c-.19.44074-.364.89314-.52 1.35594l-1.092-.4899c.161-.461.337-.91197.529-1.35182zm2.522-4.11275-.855-.77421c.318-.36896.651-.72067.996-1.05383l.844.76437c-.343.33569-.672.69072-.985 1.06367zm4.329-3.48218-.527-.91995c.439-.21257.89-.400236 1.349-.561524l.516.898714c-.457.16735-.903.36215-1.338.58276zm5-1.30064-.185-.88244759c.038-.00036138.077-.00054241.116-.00054241.466 0 .927.0261359 1.381.0772411l.178.8492139c-.359-.033344-.722-.050329-1.088-.050329-.134 0-.269.002298-.402.006864zm8.969 4.16376c-2.32-2.30421-5.307-3.69085-8.567-3.69085-7.094 0-12.898 6.56929-13.344 14.8709l10.057 1.7732c-.204-.8597-.313-1.7668-.313-2.7042 0-5.48458 3.732-9.93073 8.336-9.93073 1.114 0 2.177.26034 3.148.73274zm-3.013.7624c-.262-.03097-.528-.04682-.797-.04682-.222 0-.442.01083-.66.03208l-.082.76181c.361-.0662.73-.10054 1.107-.10054.121 0 .241.00357.361.01061zm-7.617 10.13175c-.024-.2864-.037-.5769-.037-.8709 0-.2436.009-.485.026-.7235l-1.056-.4738c-.055.4511-.084.9124-.084 1.3817 0 .057.001.1138.001.1706zm-.671-3.9372.886.8029c.121-.529.282-1.0378.481-1.5211l-.804-.7282c-.22.4595-.409.943-.563 1.4464zm1.354-2.80683.56.97633c.272-.46939.583-.90491.926-1.30024l-.497-.86582c-.358.36123-.689.75946-.989 1.18973zm2.252-2.23226.203.96996c.407-.32961.845-.61083 1.306-.83673l-.176-.83857c-.465.18713-.911.42402-1.333.70534z" fill="#fff" fill-rule="evenodd"/></svg>
|
||||
<svg fill="none" height="18" viewBox="0 0 687 18" width="687" xmlns="http://www.w3.org/2000/svg"><path d="m358 8.50006 329-.00003" stroke="#e5e5e5"/><path d="m0 8.50006h329" stroke="#e5e5e5"/><path clip-rule="evenodd" d="m351.712 1.08696c.473.2102.934.44889 1.381.71432l-.071.65833c-.449-.25428-.911-.48052-1.385-.67682zm-16.859 8.6916c-.19.44074-.364.89314-.52 1.35594l-1.092-.4899c.161-.461.337-.91197.529-1.35182zm2.522-4.11275-.855-.77421c.318-.36896.651-.72067.996-1.05383l.844.76437c-.343.33569-.672.69072-.985 1.06367zm4.329-3.48218-.527-.91995c.439-.21257.89-.400236 1.349-.561524l.516.898714c-.457.16735-.903.36215-1.338.58276zm5-1.30064-.185-.88244759c.038-.00036138.077-.00054241.116-.00054241.466 0 .927.0261359 1.381.0772411l.178.8492139c-.359-.033344-.722-.050329-1.088-.050329-.134 0-.269.002298-.402.006864zm8.969 4.16376c-2.32-2.30421-5.307-3.69085-8.567-3.69085-7.094 0-12.898 6.56929-13.344 14.8709l10.057 1.7732c-.204-.8597-.313-1.7668-.313-2.7042 0-5.48458 3.732-9.93073 8.336-9.93073 1.114 0 2.177.26034 3.148.73274zm-3.013.7624c-.262-.03097-.528-.04682-.797-.04682-.222 0-.442.01083-.66.03208l-.082.76181c.361-.0662.73-.10054 1.107-.10054.121 0 .241.00357.361.01061zm-7.617 10.13175c-.024-.2864-.037-.5769-.037-.8709 0-.2436.009-.485.026-.7235l-1.056-.4738c-.055.4511-.084.9124-.084 1.3817 0 .057.001.1138.001.1706zm-.671-3.9372.886.8029c.121-.529.282-1.0378.481-1.5211l-.804-.7282c-.22.4595-.409.943-.563 1.4464zm1.354-2.80683.56.97633c.272-.46939.583-.90491.926-1.30024l-.497-.86582c-.358.36123-.689.75946-.989 1.18973zm2.252-2.23226.203.96996c.407-.32961.845-.61083 1.306-.83673l-.176-.83857c-.465.18713-.911.42402-1.333.70534z" fill="#e5e5e5" fill-rule="evenodd"/></svg>
|
||||
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.7 KiB |
@ -1 +1 @@
|
||||
<svg fill="none" height="18" viewBox="0 0 349 18" width="349" xmlns="http://www.w3.org/2000/svg"><path d="m189 8.5h160" stroke="#fff"/><path d="m-0 8.5 160-.00001" stroke="#fff"/><path clip-rule="evenodd" d="m182.712 1.08696c.473.2102.934.44889 1.381.71432l-.071.65833c-.449-.25428-.911-.48052-1.385-.67682zm-16.859 8.6916c-.19.44074-.364.89314-.52 1.35594l-1.092-.4899c.161-.461.337-.91197.529-1.35182zm2.522-4.11275-.855-.77421c.318-.36896.651-.72067.996-1.05383l.844.76437c-.343.33569-.672.69072-.985 1.06367zm4.329-3.48218-.527-.91995c.439-.21257.89-.400236 1.349-.561524l.516.898714c-.457.16735-.903.36215-1.338.58276zm5-1.30064-.185-.88244759c.038-.00036138.077-.00054241.116-.00054241.466 0 .927.0261359 1.381.0772411l.178.8492139c-.359-.033344-.722-.050329-1.088-.050329-.134 0-.269.002298-.402.006864zm8.969 4.16376c-2.32-2.30421-5.307-3.69085-8.567-3.69085-7.094 0-12.898 6.56929-13.344 14.8709l10.057 1.7732c-.204-.8597-.313-1.7668-.313-2.7042 0-5.48458 3.732-9.93073 8.336-9.93073 1.114 0 2.177.26034 3.148.73274zm-3.013.7624c-.262-.03097-.528-.04682-.797-.04682-.222 0-.442.01083-.66.03208l-.082.76181c.361-.0662.73-.10054 1.107-.10054.121 0 .241.00357.361.01061zm-7.617 10.13175c-.024-.2864-.037-.5769-.037-.8709 0-.2436.009-.485.026-.7235l-1.056-.4738c-.055.4511-.084.9124-.084 1.3817 0 .057.001.1138.001.1706zm-.671-3.9372.886.8029c.121-.529.282-1.0378.481-1.5211l-.804-.7282c-.22.4595-.409.943-.563 1.4464zm1.354-2.80683.56.97633c.272-.46939.583-.90491.926-1.30024l-.497-.86582c-.358.36123-.689.75946-.989 1.18973zm2.252-2.23226.203.96996c.407-.32961.845-.61083 1.306-.83673l-.176-.83857c-.465.18713-.911.42402-1.333.70534z" fill="#fff" fill-rule="evenodd"/></svg>
|
||||
<svg fill="none" height="18" viewBox="0 0 349 18" width="349" xmlns="http://www.w3.org/2000/svg"><path d="m189 8.5h160" stroke="#e5e5e5"/><path d="m-0 8.5 160-.00001" stroke="#e5e5e5"/><path clip-rule="evenodd" d="m182.712 1.08696c.473.2102.934.44889 1.381.71432l-.071.65833c-.449-.25428-.911-.48052-1.385-.67682zm-16.859 8.6916c-.19.44074-.364.89314-.52 1.35594l-1.092-.4899c.161-.461.337-.91197.529-1.35182zm2.522-4.11275-.855-.77421c.318-.36896.651-.72067.996-1.05383l.844.76437c-.343.33569-.672.69072-.985 1.06367zm4.329-3.48218-.527-.91995c.439-.21257.89-.400236 1.349-.561524l.516.898714c-.457.16735-.903.36215-1.338.58276zm5-1.30064-.185-.88244759c.038-.00036138.077-.00054241.116-.00054241.466 0 .927.0261359 1.381.0772411l.178.8492139c-.359-.033344-.722-.050329-1.088-.050329-.134 0-.269.002298-.402.006864zm8.969 4.16376c-2.32-2.30421-5.307-3.69085-8.567-3.69085-7.094 0-12.898 6.56929-13.344 14.8709l10.057 1.7732c-.204-.8597-.313-1.7668-.313-2.7042 0-5.48458 3.732-9.93073 8.336-9.93073 1.114 0 2.177.26034 3.148.73274zm-3.013.7624c-.262-.03097-.528-.04682-.797-.04682-.222 0-.442.01083-.66.03208l-.082.76181c.361-.0662.73-.10054 1.107-.10054.121 0 .241.00357.361.01061zm-7.617 10.13175c-.024-.2864-.037-.5769-.037-.8709 0-.2436.009-.485.026-.7235l-1.056-.4738c-.055.4511-.084.9124-.084 1.3817 0 .057.001.1138.001.1706zm-.671-3.9372.886.8029c.121-.529.282-1.0378.481-1.5211l-.804-.7282c-.22.4595-.409.943-.563 1.4464zm1.354-2.80683.56.97633c.272-.46939.583-.90491.926-1.30024l-.497-.86582c-.358.36123-.689.75946-.989 1.18973zm2.252-2.23226.203.96996c.407-.32961.845-.61083 1.306-.83673l-.176-.83857c-.465.18713-.911.42402-1.333.70534z" fill="#e5e5e5" fill-rule="evenodd"/></svg>
|
||||
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.7 KiB |
@ -1 +1 @@
|
||||
<svg height="34" viewBox="0 0 28 34" width="28" xmlns="http://www.w3.org/2000/svg"><g style="fill:none;fill-rule:evenodd;stroke:#fff;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.71" transform="translate(1.141 .927)"><path d="m25.71745 32.14683h-22.50276c-.85259 0-1.67026-.3387-2.27313-.9415-.60287-.6029-.94156-1.4206-.94156-2.2732"/><path d="m12.85875 2.14313h-8.5725c-1.13678 0-2.22701.45159-3.03084 1.25542-.80382.80382-1.25541 1.89405-1.25541 3.03083v22.50285c0-.8526.33869-1.6703.94156-2.2732.60287-.6028 1.42054-.9415 2.27313-.9415h21.43126c.2842 0 .5567-.1129.7577-.3139.201-.2009.3138-.4735.3138-.7577v-21.43124c0-.28419-.1128-.55675-.3138-.7577-.201-.20096-.4735-.31386-.7577-.31386h-3.2147"/><path d="m23.574 32.147v-6.429"/><path d="m21.43125 17.14503-4.2863-4.2863-4.2862 4.2863v-15.0019c0-.56839.2258-1.1135.6277-1.51542.4019-.40191.947-.62771 1.5154-.62771h4.2863c.2814 0 .5601.05544.8201.16314s.4963.26556.6953.46457.3569.43527.4646.69528c.1077.26002.1631.5387.1631.82014z"/></g></svg>
|
||||
<svg height="34" viewBox="0 0 28 34" width="28" xmlns="http://www.w3.org/2000/svg"><g style="fill:none;fill-rule:evenodd;stroke:#e5e5e5;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.71" transform="translate(1.141 .927)"><path d="m25.71745 32.14683h-22.50276c-.85259 0-1.67026-.3387-2.27313-.9415-.60287-.6029-.94156-1.4206-.94156-2.2732"/><path d="m12.85875 2.14313h-8.5725c-1.13678 0-2.22701.45159-3.03084 1.25542-.80382.80382-1.25541 1.89405-1.25541 3.03083v22.50285c0-.8526.33869-1.6703.94156-2.2732.60287-.6028 1.42054-.9415 2.27313-.9415h21.43126c.2842 0 .5567-.1129.7577-.3139.201-.2009.3138-.4735.3138-.7577v-21.43124c0-.28419-.1128-.55675-.3138-.7577-.201-.20096-.4735-.31386-.7577-.31386h-3.2147"/><path d="m23.574 32.147v-6.429"/><path d="m21.43125 17.14503-4.2863-4.2863-4.2862 4.2863v-15.0019c0-.56839.2258-1.1135.6277-1.51542.4019-.40191.947-.62771 1.5154-.62771h4.2863c.2814 0 .5601.05544.8201.16314s.4963.26556.6953.46457.3569.43527.4646.69528c.1077.26002.1631.5387.1631.82014z"/></g></svg>
|
||||
|
Before Width: | Height: | Size: 1014 B After Width: | Height: | Size: 1017 B |
@ -9,7 +9,7 @@
|
||||
body.guide {
|
||||
|
||||
background-color: $gray-1000;
|
||||
color: #fff;
|
||||
color: $text-on-darker-bg;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
width: 12px;
|
||||
@ -27,8 +27,9 @@
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
|
||||
}
|
||||
h1 {
|
||||
color: #fff;
|
||||
|
||||
h1, h2, h3 {
|
||||
color: $large-text-on-darker-bg;
|
||||
}
|
||||
|
||||
a {
|
||||
@ -44,10 +45,10 @@
|
||||
} // &:visited
|
||||
} // a
|
||||
|
||||
h2 a {
|
||||
h2 a, h3 a {
|
||||
&:link,
|
||||
&:visited {
|
||||
color: #fff;
|
||||
color: inherit;
|
||||
}
|
||||
} // h2 a
|
||||
|
||||
@ -55,6 +56,7 @@
|
||||
th {
|
||||
background-color: $gray-900;
|
||||
border-bottom: 2px solid $gray-700;
|
||||
color: $text-on-darker-bg;
|
||||
} // th
|
||||
|
||||
tr {
|
||||
@ -64,11 +66,11 @@
|
||||
}
|
||||
} // table
|
||||
|
||||
h3, h4, h5, h6 {
|
||||
h4, h5, h6 {
|
||||
a,
|
||||
a:link,
|
||||
a:visited {
|
||||
color: #fff;
|
||||
color: inherit;
|
||||
} // a, a:link, a:visited
|
||||
} // h3
|
||||
|
||||
@ -86,8 +88,8 @@
|
||||
} // pre, code
|
||||
|
||||
p code, ul code, li code {
|
||||
background-color: $gray-650;
|
||||
color: #fff;
|
||||
background-color: $gray-850;
|
||||
color: $text-on-darker-bg;
|
||||
}
|
||||
|
||||
td code {
|
||||
@ -137,7 +139,7 @@
|
||||
a,
|
||||
a:link,
|
||||
a:visited {
|
||||
color: $gray-100;
|
||||
color: $text-on-darker-bg;
|
||||
} // a
|
||||
|
||||
a#home_nav {
|
||||
@ -151,14 +153,14 @@
|
||||
|
||||
#guides {
|
||||
background: $gray-800;
|
||||
color: $gray-100;
|
||||
color: $text-on-dark-bg;
|
||||
|
||||
.guides-section {
|
||||
dd {
|
||||
a,
|
||||
a:link,
|
||||
a:visited {
|
||||
color: $gray-100;
|
||||
color: $text-on-dark-bg;
|
||||
} // a
|
||||
|
||||
a:hover,
|
||||
@ -204,7 +206,7 @@
|
||||
a,
|
||||
a:link,
|
||||
a:visited {
|
||||
color: $gray-100;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
a:hover,
|
||||
|
||||
@ -51,6 +51,7 @@ $gray-600: #666666;
|
||||
$gray-650: #505050;
|
||||
$gray-700: #3A3939;
|
||||
$gray-800: #343434;
|
||||
$gray-850: #2E2E2E;
|
||||
$gray-900: #292929;
|
||||
$gray-1000: #181818;
|
||||
|
||||
@ -70,6 +71,14 @@ $stop-dark: rgba($stop, 0.5);
|
||||
$stop-bkgnd: rgba($stop, 15%);
|
||||
$stop-bkgnd-dark: rgba($stop, 5%);
|
||||
|
||||
// APCA has different rules if the background is darker than #333333.
|
||||
// The variables with darker in them are intended for those cases.
|
||||
// Large text is text that is > 24px
|
||||
// See https://github.com/Myndex/SAPC-APCA/discussions/106
|
||||
$text-on-dark-bg: #EDEDED; // APCA Lc 90 on gray-800
|
||||
$text-on-darker-bg: #E5E5E5; // APCA Lc -89.9 on gray-1000, Lc -87.4 on gray-900
|
||||
$large-text-on-darker-bg: #CCCCCC; // APCA Lc -74.6 on gray-1000, Lc -72.0 on gray-900
|
||||
|
||||
// ----------------------------------------------------------------------------
|
||||
// Fonts
|
||||
// These are the same fonts that are used on the marcom site, and they are
|
||||
|
||||
Loading…
Reference in New Issue
Block a user