liquet/src/styles/singular.styl
2020-09-03 11:31:22 +02:00

123 lines
2.0 KiB
Stylus

#singular
#top
img
margin .25em .25em
vertical-align middle
transition var(--animation)
height var(--icon-width)
&:hover
transform scale(1.5)
&.reduce
height calc(var(--icon-width) * .8)
#main
padding-top 8vw
overflow-y auto
overflow-wrap break-word
&:after
content ''
height 16vh
display block
#content
& > *
a
border-bottom 2px solid var(--clr-black)
#header
text-align center
padding 0 2em
margin-bottom 5vmin
max-width 60em
width calc(100% - 2em)
h1
font-size 4vmax
#content
width 100%
padding 0 1em
h2
margin-top 3em
h3
margin-top 2em
& > *
max-width var(--text-width)
width 100%
line-height 1.5
.alignfull
max-width initial
width calc(100% + 4em)
.alignwide
max-width 60em !important
width 100%
blockquote
border-left 2px solid var(--clr-black)
padding-left .5em
& > p
margin 0
& > cite
font-size .75em
pre
overflow auto
background-color var(--clr-ligher)
padding 1em
border-radius .25em
overflow-wrap initial
tab-size 4
p
code
background: var(--clr-ligher)
padding: .15em .5em
border-radius: .25em
display: inline-block
font-size: 105%
figure
img
height: 100%
.links
& > div
transform rotate(180deg) scale(1)
writing-mode vertical-rl
padding .25em
height 100%
text-align center
cursor pointer
background var(--clr-white)
transition var(--animation)
width 2em
line-height 1em
&:hover
transform rotate(180deg) scale(1.5)
#singular #content h4, h5, h6
margin-top 1em
@media only screen and (min-width: 40em)
#singular
.links
& > div
padding 1em
width 3em
#top
padding 0 .5em
img
margin .25em .5em