jefklakscodex/themes/jefklak-creative-portfolio/assets/sass/_codex.sass

330 lines
5.0 KiB
Sass
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

html
font-size: 1.0rem
@media (min-width: 960px)
font-size: 1.15rem
body, h1, h2, h3, h4, article p, article li, .box-masonry .box-masonry-text p, .copyright, .copyright p.credit a
color: var(--textcolor)
.latest-all
float: right
margin-top: -20px
margin-bottom: 20px
.logo
max-width: 100%
height: auto
.box-masonry .box-masonry-text p
font-size: 0.9rem
body
background-color: var(--bglight)
line-height: 1.7
height: 100%
@media (min-width: 960px)
font-size: inherit
html body, h1, h2, h3, h4, h5, h6
font-family: $font-stack
.meel, a.internal
cursor: pointer
.support
font-size: 1rem
margin-bottom: 4rem
noscript
border-left: 5px solid darkred
padding: 0.5rem
.avatar
float: right
margin-top: 0rem
margin-left: 1.5rem
img
border-radius: 50%
.rfloat
float: right
.metatitle
color: grey
font-weight: bold
h1, .h1
font-size: 2.5rem
font-weight: 700
margin-bottom: 2rem
h2, .h2
font-size: 2rem
font-weight: 700
margin-top: 2rem
margin-bottom: 2rem
h3, .h3
font-size: 1.7rem
font-weight: 700
margin-top: 2rem
margin-bottom: 2rem
h4, .h4
font-size: 1.2rem
font-weight: 700
ul, ol
margin-bottom: 2rem
blockquote
font-size: 1.1rem
font-style: italic
border-left: 7px solid var(--accent)
background-color: var(--bglightshade)
border-radius: 5px
button
background-color: var(--accent) !important
color: white !important
border-color: darkgrey !important
.sorted
box-shadow: 5px 5px 5px 1px rgba(0,0,0,0.35)
&-asc:before
content: ""
&-desc:before
content: ""
.small-navbar button
position: fixed
z-index: 99
margin-top: -1rem
margin-left: 1rem
hr
border-top: 1px solid var(--accent)
#rsslink
position: absolute
right: 0
z-index: 99
visibility: hidden
@media only screen and (min-width: 1200px)
visibility: visible
footer
position: fixed
bottom: 0
right: 0
margin: 0
height: 140px
.img-responsive
margin: 0
visibility: hidden
@media only screen and (min-width: 1200px)
visibility: visible
.content-column
padding-left: 30px
padding-right: 30px
padding-top: 30px
@media (min-width: 1200px)
padding-left: 5rem
&-content
@media (min-width: 1200px)
padding: 0
div.row
padding-bottom: 14px
.col-lg-8
@media (min-width: 1200px)
width: 72%
a.external
background-image: url(/img/external.png)
background-position: center right
background-repeat: no-repeat
padding-right: 13px
border-bottom: 1px dotted #526A43
&-no
background: none
padding-right: 0
&:hover
text-decoration: none
.footnotes
font-size: 0.9em
article
figure
margin-top: 1.5rem
margin-bottom: 1.5rem
figcaption
padding: 10px
text-align: center
font-style: italic
color: grey
img
border: 1px solid black
border-radius: 5px
.video-mask
padding-top: 1.2rem
padding-bottom: 1.2rem
width: 100%
border-radius: 5px
overflow: hidden
a:hover
text-decoration: none
a:not([href])
padding-right: 0
background-image: none
p, li
text-align: left !important
main li
list-style-type: circle
.no-border
border: none !important
.modal-header
display: none
a, .box-masonry h4 a, .link
color: var(--textlink)
text-decoration: none
border-bottom: 1px solid darkgrey
a:hover, .box-masonry h4 a:hover, .link:hover
color: var(--textlink)
background-color: #d1d3bd
.container-fluid
padding-left: 0
height: 100%
.box-masonry
background-color: var(--bglightshade)
border: 1px solid var(--accent)
border-radius: 5px
&:hover
box-shadow: 0 0 5px black
.box-masonry-hover-text-header, .box-masonry-hover-center
opacity: 1
.box-masonry-image.with-hover-overlay:before
opacity: 0.3
.box-masonry-image.with-hover-icon:after
opacity: 1
.box-masonry-image
background: none
padding-top: 10px
.img-inactive
display: block
width: 100%
.img-active
display: none
width: 100%
.pages
color: var(--accent)
.pagination > .disabled > span
background-color: var(--bgdarker)
.pagination > li > a, .pagination > li > span
background-color: var(--bgdark)
border: 1px solid var(--bgdarker)
color: #333
.pagination > .active > a
background-color: var(--bglight)
color: #333
.categories
padding-top: 1.5rem
color: var(--textlinktag)
kbd
padding: 0.2rem 0.5rem 0.2rem 0.5rem
background-color: var(--bgdark)
color: var(--textlinktag)
#skiptocontent
a
z-index: 99
padding: 6px
position: absolute
top: -50px
left: 0px
color: white
border 1px solid white
border-top-right-radius: 8px
border-bottom-right-radius: 8px
background: black
-webkit-transition: top 1s ease-out
transition: top 1s ease-out
&:focus
position: absolute
left: 0px
top: 0px
outline-color: transparent
-webkit-transition: top .1s ease-in
transition: top .1s ease-in
.sl-wrapper
.sl-counter
font-weight: bold
.sl-caption
text-align: center
background: rgba(0,0,0,0.65) !important
.score
border: none
width: 1em
&-on
opacity: 1
&-off
opacity: 0.2