mirror of
https://github.com/explosion/spaCy.git
synced 2025-01-12 02:06:31 +03:00
Increase contrast of text and theme color (#12165)
This commit is contained in:
parent
a7d6a62f7c
commit
c9beb47ab7
|
@ -14,8 +14,8 @@ const spacyTheme = createTheme({
|
||||||
background: 'var(--color-front)',
|
background: 'var(--color-front)',
|
||||||
foreground: 'var(--color-subtle)',
|
foreground: 'var(--color-subtle)',
|
||||||
caret: 'var(--color-theme-dark)',
|
caret: 'var(--color-theme-dark)',
|
||||||
selection: 'var(--color-theme)',
|
selection: 'var(--color-theme-dark)',
|
||||||
selectionMatch: 'var(--color-theme)',
|
selectionMatch: 'var(--color-theme-dark)',
|
||||||
gutterBackground: 'var(--color-front)',
|
gutterBackground: 'var(--color-front)',
|
||||||
gutterForeground: 'var(--color-subtle)',
|
gutterForeground: 'var(--color-subtle)',
|
||||||
fontFamily: 'var(--font-code)',
|
fontFamily: 'var(--font-code)',
|
||||||
|
|
|
@ -31,7 +31,7 @@
|
||||||
width: $width
|
width: $width
|
||||||
height: $width
|
height: $width
|
||||||
flex: 0 0 $width
|
flex: 0 0 $width
|
||||||
background: var(--color-theme)
|
background: var(--color-theme-dark)
|
||||||
color: var(--color-back)
|
color: var(--color-back)
|
||||||
border-radius: 50%
|
border-radius: 50%
|
||||||
padding: 0.35rem
|
padding: 0.35rem
|
||||||
|
|
|
@ -10,7 +10,7 @@
|
||||||
padding: 1rem
|
padding: 1rem
|
||||||
box-shadow: var(--box-shadow)
|
box-shadow: var(--box-shadow)
|
||||||
border-top: 2px solid
|
border-top: 2px solid
|
||||||
color: var(--color-theme)
|
color: var(--color-theme-dark)
|
||||||
|
|
||||||
.warning
|
.warning
|
||||||
--alert-bg: var(--color-yellow-light)
|
--alert-bg: var(--color-yellow-light)
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
display: inline-block
|
display: inline-block
|
||||||
padding: 0.65rem 1.1rem 0.825rem
|
padding: 0.65rem 1.1rem 0.825rem
|
||||||
margin-bottom: 1px
|
margin-bottom: 1px
|
||||||
border: 2px solid var(--color-theme)
|
border: 2px solid var(--color-theme-dark)
|
||||||
border-radius: 2em
|
border-radius: 2em
|
||||||
text-align: center
|
text-align: center
|
||||||
transition: background-color, color 0.25s ease
|
transition: background-color, color 0.25s ease
|
||||||
|
@ -18,7 +18,7 @@
|
||||||
padding: 0.8em 1.1em 1em
|
padding: 0.8em 1.1em 1em
|
||||||
|
|
||||||
.primary
|
.primary
|
||||||
background: var(--color-theme)
|
background: var(--color-theme-dark)
|
||||||
color: var(--color-back)
|
color: var(--color-back)
|
||||||
|
|
||||||
&:hover
|
&:hover
|
||||||
|
@ -27,7 +27,7 @@
|
||||||
|
|
||||||
.secondary
|
.secondary
|
||||||
background: var(--color-back)
|
background: var(--color-back)
|
||||||
color: var(--color-theme)
|
color: var(--color-theme-dark)
|
||||||
|
|
||||||
&:hover
|
&:hover
|
||||||
color: var(--color-theme-dark)
|
color: var(--color-theme-dark)
|
||||||
|
|
|
@ -152,7 +152,7 @@
|
||||||
|
|
||||||
.juniper-button
|
.juniper-button
|
||||||
transition: background-color 0.15s ease
|
transition: background-color 0.15s ease
|
||||||
background: var(--color-theme)
|
background: var(--color-theme-dark)
|
||||||
margin: 0.5rem 0 1rem 2rem
|
margin: 0.5rem 0 1rem 2rem
|
||||||
|
|
||||||
&:hover
|
&:hover
|
||||||
|
@ -182,8 +182,8 @@
|
||||||
color: inherit !important
|
color: inherit !important
|
||||||
|
|
||||||
.cli-arg-highlight
|
.cli-arg-highlight
|
||||||
background: var(--color-theme)
|
background: var(--color-theme-dark)
|
||||||
border-color: var(--color-theme)
|
border-color: var(--color-theme-dark)
|
||||||
color: var(--color-back) !important
|
color: var(--color-back) !important
|
||||||
|
|
||||||
.cli-arg-subtle
|
.cli-arg-subtle
|
||||||
|
|
|
@ -32,7 +32,7 @@
|
||||||
.copy
|
.copy
|
||||||
border-top: 1px dotted var(--color-subtle)
|
border-top: 1px dotted var(--color-subtle)
|
||||||
font-size: var(--font-size-xs)
|
font-size: var(--font-size-xs)
|
||||||
color: var(--color-subtle-dark)
|
color: var(--color-front-dark)
|
||||||
text-align: center
|
text-align: center
|
||||||
width: 100%
|
width: 100%
|
||||||
|
|
||||||
|
@ -42,4 +42,4 @@
|
||||||
vertical-align: middle
|
vertical-align: middle
|
||||||
|
|
||||||
&:hover
|
&:hover
|
||||||
color: var(--color-theme)
|
color: var(--color-theme-dark)
|
||||||
|
|
|
@ -31,7 +31,7 @@
|
||||||
|
|
||||||
.title
|
.title
|
||||||
font-weight: bold
|
font-weight: bold
|
||||||
color: var(--color-theme)
|
color: var(--color-theme-dark)
|
||||||
display: block
|
display: block
|
||||||
margin-bottom: var(--spacing-xs)
|
margin-bottom: var(--spacing-xs)
|
||||||
font-size: var(--font-size-md)
|
font-size: var(--font-size-md)
|
||||||
|
@ -41,7 +41,7 @@
|
||||||
color: inherit
|
color: inherit
|
||||||
|
|
||||||
.icon
|
.icon
|
||||||
color: var(--color-theme)
|
color: var(--color-theme-dark)
|
||||||
vertical-align: baseline
|
vertical-align: baseline
|
||||||
position: relative
|
position: relative
|
||||||
bottom: -2px
|
bottom: -2px
|
||||||
|
|
|
@ -41,7 +41,7 @@
|
||||||
border-radius: 1em
|
border-radius: 1em
|
||||||
padding: 0 1rem 0.15rem
|
padding: 0 1rem 0.15rem
|
||||||
background: var(--color-back)
|
background: var(--color-back)
|
||||||
color: var(--color-theme)
|
color: var(--color-theme-dark)
|
||||||
|
|
||||||
.subtitle
|
.subtitle
|
||||||
margin-top: 1rem
|
margin-top: 1rem
|
||||||
|
|
|
@ -301,13 +301,13 @@ p
|
||||||
margin-bottom: 0
|
margin-bottom: 0
|
||||||
|
|
||||||
a:focus
|
a:focus
|
||||||
outline: 1px dotted var(--color-theme)
|
outline: 1px dotted var(--color-theme-dark)
|
||||||
|
|
||||||
body [id]:target
|
body [id]:target
|
||||||
padding-top: calc(var(--height-nav) * 1.25) !important
|
padding-top: calc(var(--height-nav) * 1.25) !important
|
||||||
|
|
||||||
::selection
|
::selection
|
||||||
background: var(--color-theme)
|
background: var(--color-theme-dark)
|
||||||
color: var(--color-back)
|
color: var(--color-back)
|
||||||
text-shadow: none
|
text-shadow: none
|
||||||
|
|
||||||
|
@ -524,7 +524,7 @@ body [id]:target
|
||||||
display: block
|
display: block
|
||||||
font: bold var(--font-size-lg)/var(--line-height-md) var(--font-secondary)
|
font: bold var(--font-size-lg)/var(--line-height-md) var(--font-secondary)
|
||||||
text-transform: uppercase
|
text-transform: uppercase
|
||||||
color: var(--color-theme)
|
color: var(--color-theme-dark)
|
||||||
|
|
||||||
.algolia-autocomplete .algolia-docsearch-suggestion--subcategory-column
|
.algolia-autocomplete .algolia-docsearch-suggestion--subcategory-column
|
||||||
color: var(--color-dark)
|
color: var(--color-dark)
|
||||||
|
|
|
@ -1,11 +1,11 @@
|
||||||
.root
|
.root
|
||||||
color: var(--color-theme)
|
color: var(--color-theme-dark)
|
||||||
border-bottom: 1px solid
|
border-bottom: 1px solid
|
||||||
transition: color 0.2s ease
|
transition: color 0.2s ease
|
||||||
cursor: pointer
|
cursor: pointer
|
||||||
|
|
||||||
&:hover
|
&:hover
|
||||||
color: var(--color-theme-dark)
|
color: var(--color-front)
|
||||||
|
|
||||||
.hidden
|
.hidden
|
||||||
border: none
|
border: none
|
||||||
|
|
|
@ -16,12 +16,15 @@
|
||||||
z-index: 30
|
z-index: 30
|
||||||
width: 100%
|
width: 100%
|
||||||
box-shadow: var(--box-shadow)
|
box-shadow: var(--box-shadow)
|
||||||
|
--docsearch-muted-color: var(--color-subtle-dark)
|
||||||
|
--docsearch-text-color: var(--docsearch-muted-color)
|
||||||
|
--docsearch-searchbox-background: var(--color-subtle-light)
|
||||||
|
|
||||||
.logo
|
.logo
|
||||||
min-width: 95px
|
min-width: 95px
|
||||||
width: 95px
|
width: 95px
|
||||||
height: 30px
|
height: 30px
|
||||||
color: var(--color-theme) !important
|
color: var(--color-theme-dark) !important
|
||||||
vertical-align: middle
|
vertical-align: middle
|
||||||
|
|
||||||
.title
|
.title
|
||||||
|
@ -42,7 +45,7 @@
|
||||||
font-family: var(--font-secondary)
|
font-family: var(--font-secondary)
|
||||||
font-size: 1.6rem
|
font-size: 1.6rem
|
||||||
font-weight: bold
|
font-weight: bold
|
||||||
color: var(--color-theme)
|
color: var(--color-theme-dark)
|
||||||
|
|
||||||
&:not(:first-child)
|
&:not(:first-child)
|
||||||
margin-left: 2em
|
margin-left: 2em
|
||||||
|
@ -77,11 +80,11 @@
|
||||||
min-width: 100px
|
min-width: 100px
|
||||||
|
|
||||||
.dropdown
|
.dropdown
|
||||||
--dropdown-text-color: var(--color-theme)
|
--dropdown-text-color: var(--color-theme-dark)
|
||||||
font-family: var(--font-secondary)
|
font-family: var(--font-secondary)
|
||||||
font-size: 1.6rem
|
font-size: 1.6rem
|
||||||
font-weight: bold
|
font-weight: bold
|
||||||
color: var(--color-theme)
|
color: var(--color-theme-dark)
|
||||||
text-transform: uppercase
|
text-transform: uppercase
|
||||||
margin-right: 0.5rem
|
margin-right: 0.5rem
|
||||||
border: 2px solid var(--color-back)
|
border: 2px solid var(--color-back)
|
||||||
|
|
|
@ -18,5 +18,5 @@
|
||||||
.button
|
.button
|
||||||
font: bold var(--font-size-lg)/var(--line-height-md) var(--font-secondary)
|
font: bold var(--font-size-lg)/var(--line-height-md) var(--font-secondary)
|
||||||
text-transform: uppercase
|
text-transform: uppercase
|
||||||
color: var(--color-theme)
|
color: var(--color-theme-dark)
|
||||||
white-space: nowrap
|
white-space: nowrap
|
||||||
|
|
|
@ -47,7 +47,7 @@
|
||||||
background: var(--color-subtle-light)
|
background: var(--color-subtle-light)
|
||||||
|
|
||||||
.input:focus
|
.input:focus
|
||||||
border: 1px solid var(--color-theme)
|
border: 1px solid var(--color-theme-dark)
|
||||||
outline: none
|
outline: none
|
||||||
|
|
||||||
.radio + &
|
.radio + &
|
||||||
|
@ -70,8 +70,8 @@
|
||||||
|
|
||||||
.radio:checked + &
|
.radio:checked + &
|
||||||
color: var(--color-back)
|
color: var(--color-back)
|
||||||
border-color: var(--color-theme)
|
border-color: var(--color-theme-dark)
|
||||||
background: var(--color-theme)
|
background: var(--color-theme-dark)
|
||||||
|
|
||||||
.checkbox + &:before
|
.checkbox + &:before
|
||||||
$size: 18px
|
$size: 18px
|
||||||
|
@ -90,9 +90,9 @@
|
||||||
|
|
||||||
.checkbox:checked + &:before
|
.checkbox:checked + &:before
|
||||||
// Embed "check" icon here for simplicity
|
// Embed "check" icon here for simplicity
|
||||||
background: var(--color-theme) url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4gICAgPHBhdGggZmlsbD0iI2ZmZiIgZD0iTTkgMTYuMTcybDEwLjU5NC0xMC41OTQgMS40MDYgMS40MDYtMTIgMTItNS41NzgtNS41NzggMS40MDYtMS40MDZ6Ii8+PC9zdmc+)
|
background: var(--color-theme-dark) url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4gICAgPHBhdGggZmlsbD0iI2ZmZiIgZD0iTTkgMTYuMTcybDEwLjU5NC0xMC41OTQgMS40MDYgMS40MDYtMTIgMTItNS41NzgtNS41NzggMS40MDYtMS40MDZ6Ii8+PC9zdmc+)
|
||||||
background-size: contain
|
background-size: contain
|
||||||
border-color: var(--color-theme)
|
border-color: var(--color-theme-dark)
|
||||||
|
|
||||||
.field-extra:not(:empty):not(:first-child)
|
.field-extra:not(:empty):not(:first-child)
|
||||||
margin-left: 1rem
|
margin-left: 1rem
|
||||||
|
@ -167,7 +167,7 @@
|
||||||
content: initial !important
|
content: initial !important
|
||||||
|
|
||||||
.prompt:before
|
.prompt:before
|
||||||
color: var(--color-theme)
|
color: var(--color-theme-dark)
|
||||||
margin-right: 1em
|
margin-right: 1em
|
||||||
|
|
||||||
.bash:before
|
.bash:before
|
||||||
|
|
|
@ -18,4 +18,4 @@
|
||||||
margin-left: 3rem
|
margin-left: 3rem
|
||||||
|
|
||||||
&:hover
|
&:hover
|
||||||
color: var(--color-theme)
|
color: var(--color-theme-dark)
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
@import base
|
@import base
|
||||||
|
|
||||||
.DocSearch-Modal
|
.DocSearch-Modal
|
||||||
--docsearch-primary-color: var(--color-theme)
|
--docsearch-primary-color: var(--color-theme-dark)
|
||||||
--docsearch-searchbox-background: var(--color-back)
|
--docsearch-searchbox-background: var(--color-back)
|
||||||
--docsearch-searchbox-shadow: inset 0 0 0 2px var(--docsearch-primary-color)
|
--docsearch-searchbox-shadow: inset 0 0 0 2px var(--docsearch-primary-color)
|
||||||
--docsearch-highlight-color: var(--docsearch-primary-color)
|
--docsearch-highlight-color: var(--docsearch-primary-color)
|
||||||
|
|
|
@ -32,10 +32,10 @@ $crumb-bar: 2px
|
||||||
text-transform: uppercase
|
text-transform: uppercase
|
||||||
|
|
||||||
.item
|
.item
|
||||||
color: var(--color-theme)
|
color: var(--color-theme-dark)
|
||||||
|
|
||||||
&:hover
|
&:hover
|
||||||
color: var(--color-theme-dark)
|
color: var(--color-front)
|
||||||
|
|
||||||
.link
|
.link
|
||||||
border: none
|
border: none
|
||||||
|
@ -62,11 +62,11 @@ $crumb-bar: 2px
|
||||||
margin-bottom: math.div($crumb-bullet, 2)
|
margin-bottom: math.div($crumb-bullet, 2)
|
||||||
position: relative
|
position: relative
|
||||||
padding-left: 2rem
|
padding-left: 2rem
|
||||||
color: var(--color-theme)
|
color: var(--color-theme-dark)
|
||||||
font-size: 1.2rem
|
font-size: 1.2rem
|
||||||
|
|
||||||
&:hover
|
&:hover
|
||||||
color: var(--color-theme-dark)
|
color: var(--color-front)
|
||||||
|
|
||||||
&:after
|
&:after
|
||||||
width: $crumb-bullet
|
width: $crumb-bullet
|
||||||
|
|
|
@ -22,11 +22,11 @@ figure > .root
|
||||||
.footer
|
.footer
|
||||||
--color-inline-code-bg: var(--color-theme-opaque)
|
--color-inline-code-bg: var(--color-theme-opaque)
|
||||||
background: var(--color-theme-light) !important
|
background: var(--color-theme-light) !important
|
||||||
border-top: 2px solid var(--color-theme)
|
border-top: 2px solid var(--color-theme-dark)
|
||||||
|
|
||||||
& > td:first-child
|
& > td:first-child
|
||||||
font-family: var(--font-secondary)
|
font-family: var(--font-secondary)
|
||||||
color: var(--color-theme)
|
color: var(--color-theme-dark)
|
||||||
|
|
||||||
& > td:nth-child(2) a
|
& > td:nth-child(2) a
|
||||||
border: 0
|
border: 0
|
||||||
|
@ -52,9 +52,9 @@ figure > .root
|
||||||
.th
|
.th
|
||||||
font: bold var(--font-size-md)/var(--line-height-md) var(--font-secondary)
|
font: bold var(--font-size-md)/var(--line-height-md) var(--font-secondary)
|
||||||
text-transform: uppercase
|
text-transform: uppercase
|
||||||
color: var(--color-theme)
|
color: var(--color-theme-dark)
|
||||||
padding: 1rem 0.5rem
|
padding: 1rem 0.5rem
|
||||||
border-bottom: 2px solid var(--color-theme)
|
border-bottom: 2px solid var(--color-theme-dark)
|
||||||
vertical-align: bottom
|
vertical-align: bottom
|
||||||
|
|
||||||
.th-rotated
|
.th-rotated
|
||||||
|
@ -90,7 +90,7 @@ figure > .root
|
||||||
top: -5px
|
top: -5px
|
||||||
left: 10px
|
left: 10px
|
||||||
display: inline-block
|
display: inline-block
|
||||||
background: var(--color-theme)
|
background: var(--color-theme-dark)
|
||||||
color: var(--color-back)
|
color: var(--color-back)
|
||||||
padding: 0 5px 1px
|
padding: 0 5px 1px
|
||||||
font-size: 0.85rem
|
font-size: 0.85rem
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
.root
|
.root
|
||||||
display: inline-block
|
display: inline-block
|
||||||
font: bold var(--font-size-xs)/#{1} var(--font-secondary)
|
font: bold var(--font-size-xs)/#{1} var(--font-secondary)
|
||||||
background: var(--color-theme)
|
background: var(--color-theme-dark)
|
||||||
color: var(--color-back)
|
color: var(--color-back)
|
||||||
padding: 2px 6px 4px
|
padding: 2px 6px 4px
|
||||||
border-radius: 1em
|
border-radius: 1em
|
||||||
|
|
|
@ -21,7 +21,7 @@
|
||||||
content: "\00b6"
|
content: "\00b6"
|
||||||
font-size: 0.9em
|
font-size: 0.9em
|
||||||
font-weight: normal
|
font-weight: normal
|
||||||
color: var(--color-subtle)
|
color: var(--color-subtle-dark)
|
||||||
position: absolute
|
position: absolute
|
||||||
top: 0.15em
|
top: 0.15em
|
||||||
left: -2.85rem
|
left: -2.85rem
|
||||||
|
@ -32,7 +32,7 @@
|
||||||
opacity: 1
|
opacity: 1
|
||||||
|
|
||||||
&:active:before
|
&:active:before
|
||||||
color: var(--color-theme)
|
color: var(--color-theme-dark)
|
||||||
|
|
||||||
&:target
|
&:target
|
||||||
display: inline-block
|
display: inline-block
|
||||||
|
|
Loading…
Reference in New Issue
Block a user