150 lines
2.6 KiB
Stylus
150 lines
2.6 KiB
Stylus
html, body
|
|
background-color $primary - 60%
|
|
font 400 1em $baseType
|
|
height 100%
|
|
|
|
a
|
|
font 300 1em $baseType
|
|
color $secondary
|
|
text-decoration underline
|
|
object-transitions(0.1s)
|
|
|
|
&:hover
|
|
color $secondary + 10%
|
|
|
|
svg.icons
|
|
width 25px
|
|
fill $secondary
|
|
|
|
#notifications
|
|
position fixed
|
|
z-index 2000
|
|
height 10%
|
|
width 100%
|
|
display block
|
|
align-items center
|
|
justify-content center
|
|
padding 0
|
|
margin 0
|
|
#notifyMessage
|
|
margin-top: 0px;
|
|
padding-top -125px
|
|
height 50px;
|
|
width 500px
|
|
display: flex;
|
|
align-items center
|
|
justify-content center
|
|
opacity: 0
|
|
.notify-icon
|
|
background $black
|
|
padding 8px 5px 5px 5px
|
|
border-radius 5px 0 0 5px
|
|
height 30px
|
|
width 30px
|
|
text-align center
|
|
border 2px solid $white
|
|
p
|
|
color $white
|
|
background $highlight
|
|
width 400px
|
|
height 28px
|
|
padding 15px 0 0 5px
|
|
border-radius 0 5px 5px 0
|
|
border 2px solid $white
|
|
text-align center
|
|
|
|
.icons
|
|
fill $white
|
|
|
|
.blog-container
|
|
width 100%
|
|
|
|
.main-container
|
|
margin 0 auto
|
|
z-index 10
|
|
position relative
|
|
|
|
section
|
|
header
|
|
width 100%
|
|
max-width 900px
|
|
margin 0 auto
|
|
|
|
#wrapper
|
|
padding 0.75rem
|
|
|
|
#left, #right
|
|
width 50%
|
|
display inline-block
|
|
vertical-align top
|
|
|
|
#the-logo
|
|
width 40px
|
|
|
|
#right
|
|
text-align right
|
|
color $white
|
|
|
|
a
|
|
text-decoration-color $highlight
|
|
font-weight: 400
|
|
|
|
label#the-title
|
|
font-size 1.2em
|
|
font-weight 400
|
|
color $tertiary
|
|
text-decoration none
|
|
display block
|
|
line-height 0.8
|
|
// word-break: break-all;
|
|
|
|
#dash-menu
|
|
text-align right
|
|
|
|
/* Mozilla based browsers */
|
|
::-moz-selection
|
|
background-color $highlight
|
|
color $white
|
|
|
|
/* Works in Safari */
|
|
::selection
|
|
background-color $highlight
|
|
color $white
|
|
|
|
/* Works in Opera */
|
|
::-o-selection
|
|
background-color $highlight
|
|
color $white
|
|
|
|
::-ms-selection
|
|
background-color $highlight
|
|
color $white
|
|
|
|
/* Works in Internet Explorer */
|
|
::-webkit-selection
|
|
background-color $highlight
|
|
color $white
|
|
|
|
/**
|
|
-------------------------------
|
|
-- Responsive
|
|
-------------------------------
|
|
* */
|
|
@media only screen and (max-width: 800px)
|
|
.main-container
|
|
section
|
|
header
|
|
#wrapper
|
|
#left, #right
|
|
display inline-block
|
|
|
|
@media only screen and (max-width: 480px)
|
|
.main-container
|
|
section
|
|
header
|
|
#wrapper
|
|
#left
|
|
width 30%
|
|
|
|
#right
|
|
width 70%
|