mirror of
https://github.com/graphql-python/graphene.git
synced 2024-11-11 12:16:58 +03:00
433 lines
7.2 KiB
Stylus
433 lines
7.2 KiB
Stylus
@import 'nib'
|
|
@import 'jeet'
|
|
|
|
@import 'https://fonts.googleapis.com/css?family=Raleway:400,500,600,200,100&.css'
|
|
|
|
normalize-css()
|
|
|
|
@import 'hljs.css'
|
|
@import 'bm.css'
|
|
|
|
$wrapper
|
|
center(960px, pad:20px)
|
|
|
|
.wrapper
|
|
@extend $wrapper
|
|
position relative
|
|
|
|
a, a:hover
|
|
text-decoration none
|
|
|
|
a
|
|
color rgb(42,93,173)
|
|
|
|
p
|
|
margin-bottom 1em
|
|
|
|
html, body
|
|
font-family "Helvetica Neue", Helvetica, Arial, sans-serif
|
|
font-weight 300
|
|
font-size 16px
|
|
color #606060
|
|
line-height 1.5
|
|
height 100%
|
|
margin 0
|
|
width 100%
|
|
|
|
.header
|
|
clearfix()
|
|
position relative
|
|
text-align center
|
|
background: #DB594C;
|
|
background-image: radial-gradient(95% 101%, #E46643 5%, rgba(226,91,72,0.00) 100%)
|
|
.logo
|
|
width 42px
|
|
height @width
|
|
vertical-align middle
|
|
|
|
h1
|
|
max-width 380px
|
|
font-family 'Raleway', sans-serif
|
|
font-weight 200
|
|
font-size 42px
|
|
color #FFFFFF
|
|
line-height 49px
|
|
margin 80px auto 40px
|
|
z-index 110
|
|
|
|
.get-started
|
|
font-family 'Raleway'
|
|
display inline-block
|
|
margin 0 auto
|
|
font-size 13px
|
|
color #FFFFFF
|
|
padding 0 18px
|
|
text-transform uppercase
|
|
font-weight 600
|
|
line-height 15px
|
|
border 1px solid #FFFFFF
|
|
border-radius 2px
|
|
padding 12px 18px
|
|
z-index 111
|
|
position relative
|
|
&:hover
|
|
background white
|
|
color #E05B49
|
|
text-decoration none
|
|
|
|
.header-wrapper
|
|
@extend $wrapper
|
|
text-align left
|
|
padding-top 32px
|
|
padding-bottom 32px
|
|
position relative
|
|
z-index 100
|
|
|
|
.header-extended
|
|
padding-bottom 100px
|
|
|
|
.header-nav
|
|
margin-top 8px
|
|
a
|
|
font-family 'Raleway'
|
|
font-size 13px
|
|
color #FFFFFF
|
|
margin 0 16px
|
|
padding 0 2px
|
|
text-transform uppercase
|
|
font-weight 600
|
|
line-height 15px
|
|
position relative
|
|
&.active:before
|
|
content: ''
|
|
width 5px
|
|
height 5px
|
|
border-radius 3px
|
|
display block
|
|
position absolute
|
|
background white
|
|
left 50%
|
|
margin-left -3px
|
|
bottom -24px
|
|
|
|
+below(600px)
|
|
display none
|
|
|
|
.bm-burger-button, .bm-menu-wrap, .bm-overlay
|
|
display none
|
|
+below(600px)
|
|
display block
|
|
|
|
.bm-burger-button
|
|
z-index 300!important
|
|
|
|
.bm-overlay
|
|
z-index 1000!important
|
|
|
|
.bm-item-list
|
|
a
|
|
font-family 'Raleway'
|
|
display block
|
|
font-size 15px
|
|
color #CCC
|
|
margin 6px 0
|
|
padding 10px 6px
|
|
text-transform uppercase
|
|
font-weight 500
|
|
line-height 20px
|
|
position relative
|
|
&:hover
|
|
color white
|
|
|
|
.header-logo
|
|
font-family 'Raleway'
|
|
font-size 22px
|
|
color #FFFFFF
|
|
float left
|
|
font-weight 500
|
|
text-transform uppercase
|
|
text-decoration none
|
|
|
|
.header-nav
|
|
float right
|
|
|
|
.logo
|
|
path
|
|
stroke-dasharray 250
|
|
stroke-dashoffset 250
|
|
animation logo-dash .9s ease-in-out forwards
|
|
animation-delay .12s
|
|
g
|
|
ellipse
|
|
animation logo-dot .3s ease forwards
|
|
animation-fill-mode both
|
|
transform-origin 50% 50%
|
|
&:nth-child(2)
|
|
ellipse
|
|
animation-delay .1s
|
|
&:nth-child(3)
|
|
ellipse
|
|
animation-delay .2s
|
|
&:nth-child(4)
|
|
ellipse
|
|
animation-delay .3s
|
|
&:nth-child(5)
|
|
ellipse
|
|
animation-delay .4s
|
|
&:nth-child(6)
|
|
ellipse
|
|
animation-delay .5s
|
|
&:nth-child(7)
|
|
ellipse
|
|
animation-delay .6s
|
|
&:nth-child(8)
|
|
ellipse
|
|
animation-delay .7s
|
|
|
|
@keyframes logo-dash
|
|
to
|
|
stroke-dashoffset 0
|
|
|
|
@keyframes logo-dot
|
|
from
|
|
opacity 0.5
|
|
transform scale(0)
|
|
to
|
|
opacity 1
|
|
transform scale(1)
|
|
|
|
#header-background
|
|
z-index 0
|
|
display block
|
|
position absolute
|
|
width 100%
|
|
top 0
|
|
bottom 0
|
|
right 0
|
|
left 0
|
|
|
|
.particles-js-canvas-el
|
|
display block
|
|
opacity 0
|
|
position absolute
|
|
|
|
.starwars-example-wrapper
|
|
+below(600px)
|
|
margin-bottom 30px
|
|
|
|
.starwars-example
|
|
background: #3C3C3C
|
|
display inline-block
|
|
position absolute
|
|
right 20px
|
|
top -100px
|
|
box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.25);
|
|
border-radius: 100px
|
|
font-size 13px
|
|
padding 17px 17px 17px 71px
|
|
width 236px
|
|
box-sizing border-box
|
|
color white
|
|
font-family 'Raleway'
|
|
font-weight 500
|
|
transition all .2s ease-in-out
|
|
&:before
|
|
content: ''
|
|
display block
|
|
position absolute
|
|
left 20px
|
|
top 20px
|
|
height 32px
|
|
width 32px
|
|
image './images/starwars-icon.png' 32px 32px
|
|
|
|
&:hover
|
|
transform translateY(-3px)
|
|
box-shadow 0px 4px 8px 0px rgba(0,0,0,0.32)
|
|
|
|
+below(600px)
|
|
top -70px
|
|
|
|
.improve-document-link
|
|
position fixed
|
|
right 0
|
|
bottom 70px
|
|
transform-origin 100% 100%
|
|
background: #999;
|
|
border: 1px solid #919191;
|
|
border-radius: 3px 3px 0 0;
|
|
border-bottom 0
|
|
padding 9px 12px 12px 34px
|
|
transform: rotate(270deg) translateX(100%) translateY(3px);
|
|
font-size: 11px;
|
|
font-weight: 500;
|
|
text-transform uppercase
|
|
color: #FFFFFF;
|
|
letter-spacing: 0.3px;
|
|
line-height: 11px;
|
|
transition all .2s ease-in-out
|
|
&:before
|
|
content: ''
|
|
display block
|
|
position absolute
|
|
left 10px
|
|
top 8px
|
|
height 16px
|
|
width 16px
|
|
image './images/edit.png' 16px 16px
|
|
&:hover
|
|
transform: rotate(270deg) translateX(100%)
|
|
background #666
|
|
border-color #555
|
|
+below(600px)
|
|
display none
|
|
|
|
$title
|
|
display block
|
|
font-family: 'Raleway';
|
|
font-weight 500
|
|
line-height 1.2em
|
|
padding-top .3em
|
|
margin-bottom .5em
|
|
padding-bottom .5em
|
|
color #4A4A4A
|
|
|
|
.markdown
|
|
.wrapper
|
|
margin-top 60px
|
|
+below(600px)
|
|
margin-top 30px
|
|
|
|
h1, h2, h3, h4, h5, h6
|
|
@extend $title
|
|
|
|
h1
|
|
font-size 32px
|
|
h2
|
|
font-size 26px
|
|
h3
|
|
font-size 24px
|
|
h4
|
|
font-size 21px
|
|
h5
|
|
font-size 18px
|
|
h6
|
|
font-size 16px
|
|
strong
|
|
font-weight 500
|
|
pre
|
|
line-height 20px
|
|
background #FAFAFA
|
|
padding 20px
|
|
white-space: pre
|
|
display: block;
|
|
color: #333333;
|
|
overflow-x: auto;
|
|
p code, ul code
|
|
background #FAFAFA
|
|
padding 2px 4px
|
|
border-radius 2px
|
|
border 1px solid #CCC
|
|
color #000
|
|
p + p, p + ul
|
|
margin-top -.4em
|
|
p + ul
|
|
margin-top -.6em
|
|
code
|
|
font-size 14px
|
|
line-height 20px
|
|
overflow-x: auto;
|
|
margin-bottom 40px
|
|
|
|
.markdown h1:first-child
|
|
margin-top 0
|
|
padding-top 0
|
|
|
|
.page-title
|
|
background: #F9F9F9;
|
|
padding 48px 0
|
|
|
|
h1
|
|
margin 0 auto
|
|
@extend $wrapper
|
|
font-family: 'Raleway';
|
|
font-size: 40px;
|
|
font-weight 200
|
|
color: #585858;
|
|
line-height: 50px;
|
|
|
|
+below(600px)
|
|
padding 30px 0
|
|
|
|
.docs
|
|
@extend $wrapper
|
|
|
|
.homepage-intro
|
|
col(1/2)
|
|
|
|
.homepage-schema
|
|
col(1/2)
|
|
|
|
.docs-aside
|
|
col(1/4)
|
|
margin-top 60px
|
|
+below(600px)
|
|
padding 20px
|
|
width 100%
|
|
box-sizing content-box
|
|
margin 0 -20px
|
|
margin-bottom 30px
|
|
background #F9F9F9
|
|
|
|
.docs-aside-group
|
|
display block
|
|
margin-bottom 40px
|
|
h3
|
|
font-family: 'Raleway';
|
|
font-weight 500
|
|
font-size 12px
|
|
text-transform uppercase
|
|
line-height 1.2em
|
|
margin-bottom 1em
|
|
color #AAA
|
|
a
|
|
display block
|
|
font-size 15px
|
|
font-weight 400
|
|
line-height 22px
|
|
height 28px
|
|
padding 3px 0
|
|
color #4A4A4A
|
|
&.active
|
|
font-weight 500
|
|
line-height 21px
|
|
color #E05B49
|
|
|
|
+below(600px)
|
|
display none
|
|
|
|
.docs-aside-navselect
|
|
margin-top -18px
|
|
display none
|
|
width 100%
|
|
+below(600px)
|
|
display block
|
|
|
|
.docs-content
|
|
col(3/4)
|
|
margin-top 60px
|
|
margin-bottom 20px
|
|
+below(600px)
|
|
margin-top 10px
|
|
col(1)
|
|
|
|
>h1
|
|
margin 0
|
|
@extend $title
|
|
font-size 32px
|
|
|
|
.docs-next
|
|
float right
|
|
color #e05b49
|
|
font-weight 400
|