mirror of https://github.com/explosion/spaCy.git
89 lines
2.4 KiB
Sass
89 lines
2.4 KiB
Sass
|
// Misc - Variables
|
||
|
|
// ============================================================================
|
||
|
|
|
||
|
|
$x-terminal-background : color(grey)
|
||
|
|
$x-terminal-border-radius : $border-radius * 2
|
||
|
|
$x-terminal-color : color(black)
|
||
|
|
$x-terminal-cursor-animation : blink 0.9s infinite
|
||
|
|
$x-terminal-cursor : '\258B'
|
||
|
|
$x-terminal-icon-colors : color(red), color(green), color(yellow)
|
||
|
|
$x-terminal-icon-size : 1em
|
||
|
|
$x-terminal-padding : 0.75em
|
||
|
|
|
||
|
|
$x-bubble-size : 35px
|
||
|
|
$x-bubble-margin : 1rem
|
||
|
|
|
||
|
|
|
||
|
|
// Misc - Style
|
||
|
|
// ============================================================================
|
||
|
|
|
||
|
|
// Terminal window illustration to display code
|
||
|
|
// .x-terminal - terminal window
|
||
|
|
// .x-terminal-title - title of terminal window
|
||
|
|
// .x-terminal-icons - container for toolbar icons
|
||
|
|
// .x-terminal-code - code box
|
||
|
|
// .x-terminal-code:after - cursor in last line
|
||
|
|
// %x-terminal-icon - general style of toolbar icons
|
||
|
|
|
||
|
|
.x-terminal
|
||
|
|
background: $x-terminal-background
|
||
|
|
border-radius: $x-terminal-border-radius
|
||
|
|
color: $x-terminal-color
|
||
|
|
width: 100%
|
||
|
|
|
||
|
|
&--cursor
|
||
|
|
.code:after
|
||
|
|
animation: $x-terminal-cursor-animation
|
||
|
|
opacity: 1
|
||
|
|
content: $x-terminal-cursor
|
||
|
|
|
||
|
|
.x-terminal-title
|
||
|
|
text-align: center
|
||
|
|
padding: $x-terminal-padding
|
||
|
|
|
||
|
|
.x-terminal-icons
|
||
|
|
padding: $x-terminal-padding
|
||
|
|
position: absolute
|
||
|
|
|
||
|
|
&:before
|
||
|
|
@extend %x-terminal-icon
|
||
|
|
content: ''
|
||
|
|
background: nth($x-terminal-icon-colors, 1)
|
||
|
|
|
||
|
|
span
|
||
|
|
@extend %x-terminal-icon
|
||
|
|
background: nth($x-terminal-icon-colors, 2)
|
||
|
|
|
||
|
|
&:after
|
||
|
|
@extend %x-terminal-icon
|
||
|
|
content: ''
|
||
|
|
background: nth($x-terminal-icon-colors, 3)
|
||
|
|
|
||
|
|
.x-terminal-code
|
||
|
|
@extend .code-block-dark
|
||
|
|
border-bottom-left-radius: $x-terminal-border-radius
|
||
|
|
border-bottom-right-radius: $x-terminal-border-radius
|
||
|
|
padding: $x-terminal-padding * 2
|
||
|
|
max-width: 100%
|
||
|
|
width: 100%
|
||
|
|
white-space: pre-wrap
|
||
|
|
|
||
|
|
&.code-block
|
||
|
|
margin-bottom: 0
|
||
|
|
|
||
|
|
%x-terminal-icon
|
||
|
|
@include size($x-terminal-icon-size)
|
||
|
|
display: inline-block
|
||
|
|
float: left
|
||
|
|
border-radius: 50%
|
||
|
|
margin-right: $x-terminal-padding
|
||
|
|
|
||
|
|
|
||
|
|
// Bubble to display colors
|
||
|
|
|
||
|
|
.x-bubble
|
||
|
|
@include size($x-bubble-size)
|
||
|
|
border-radius: 50%
|
||
|
|
cursor: pointer
|
||
|
|
margin-right: $x-bubble-margin
|