mirror of
				https://github.com/explosion/spaCy.git
				synced 2025-11-04 09:57:26 +03:00 
			
		
		
		
	
		
			
				
	
	
		
			106 lines
		
	
	
		
			2.3 KiB
		
	
	
	
		
			Sass
		
	
	
	
	
	
			
		
		
	
	
			106 lines
		
	
	
		
			2.3 KiB
		
	
	
	
		
			Sass
		
	
	
	
	
	
//- 💫 CSS > COMPONENTS > CODE
 | 
						|
 | 
						|
//- Code block
 | 
						|
 | 
						|
.c-code-block
 | 
						|
    background: $color-front
 | 
						|
    color: darken($color-back, 20)
 | 
						|
    padding: 0.75em 0
 | 
						|
    border-radius: $border-radius
 | 
						|
    overflow: auto
 | 
						|
    width: 100%
 | 
						|
    max-width: 100%
 | 
						|
    white-space: pre
 | 
						|
    direction: ltr
 | 
						|
 | 
						|
    &.c-code-block--has-icon
 | 
						|
        padding: 0
 | 
						|
        display: flex
 | 
						|
        border-top-left-radius: 0
 | 
						|
        border-bottom-left-radius: 0
 | 
						|
 | 
						|
.c-code-block__icon
 | 
						|
    padding: 0 0 0 1rem
 | 
						|
    display: flex
 | 
						|
    justify-content: center
 | 
						|
    align-items: center
 | 
						|
 | 
						|
    &.c-code-block__icon--border
 | 
						|
        border-left: 6px solid
 | 
						|
 | 
						|
 | 
						|
 | 
						|
//- Code block content
 | 
						|
 | 
						|
.c-code-block__content
 | 
						|
    display: block
 | 
						|
    font: normal normal 1.1rem/#{1.9} $font-code
 | 
						|
    padding: 1em 2em
 | 
						|
 | 
						|
    &[data-prompt]:before,
 | 
						|
        content: attr(data-prompt)
 | 
						|
        margin-right: 0.65em
 | 
						|
        display: inline-block
 | 
						|
        vertical-align: middle
 | 
						|
        opacity: 0.5
 | 
						|
 | 
						|
 | 
						|
//- Code
 | 
						|
 | 
						|
code
 | 
						|
    -webkit-font-smoothing: subpixel-antialiased
 | 
						|
    -moz-osx-font-smoothing: auto
 | 
						|
 | 
						|
 | 
						|
//- Inline code
 | 
						|
 | 
						|
*:not(a):not(.c-code-block) > code
 | 
						|
    color: $color-dark
 | 
						|
 | 
						|
*:not(.c-code-block) > code
 | 
						|
    font-size: 90%
 | 
						|
    background-color: $color-subtle-light
 | 
						|
    padding: 0.2rem 0.4rem
 | 
						|
    border-radius: 0.25rem
 | 
						|
    font-family: $font-code
 | 
						|
    margin: 0
 | 
						|
    box-decoration-break: clone
 | 
						|
    white-space: nowrap
 | 
						|
 | 
						|
    .c-aside__content &
 | 
						|
        background: lighten($color-front, 10)
 | 
						|
        color: $color-back
 | 
						|
        text-shadow: none
 | 
						|
 | 
						|
 | 
						|
//- Syntax Highlighting
 | 
						|
 | 
						|
[class*="language-"] .token
 | 
						|
    &.comment, &.prolog, &.doctype, &.cdata, &.punctuation
 | 
						|
        color: map-get($syntax-highlighting, comment)
 | 
						|
 | 
						|
    &.property, &.tag, &.constant, &.symbol, &.deleted
 | 
						|
        color: map-get($syntax-highlighting, tag)
 | 
						|
 | 
						|
    &.boolean, &.number
 | 
						|
        color: map-get($syntax-highlighting, number)
 | 
						|
 | 
						|
    &.selector, &.attr-name, &.string, &.char, &.builtin, &.inserted
 | 
						|
        color: map-get($syntax-highlighting, selector)
 | 
						|
 | 
						|
    @at-root .language-css .token.string,
 | 
						|
    &.operator, &.entity, &.url, &.variable
 | 
						|
        color: map-get($syntax-highlighting, operator)
 | 
						|
 | 
						|
    &.atrule, &.attr-value, &.function
 | 
						|
        color: map-get($syntax-highlighting, function)
 | 
						|
 | 
						|
    &.regex, &.important
 | 
						|
        color: map-get($syntax-highlighting, regex)
 | 
						|
 | 
						|
    &.keyword
 | 
						|
        color: map-get($syntax-highlighting, keyword)
 | 
						|
 | 
						|
    &.italic
 | 
						|
        font-style: italic
 |