docspell/website/site/sass/styles.sass
2020-08-13 23:36:33 +02:00

109 lines
2.2 KiB
Sass

@charset "utf-8"
// Set your brand colors
$dblue: #1c2d61
$infoblue: #193e74
$dred: #9c0011
$dwhite: #f0f8ff
$code: $dblue
$pre: $dblue
@import url('https://fonts.googleapis.com/css?family=Libre+Baskerville:400,700')
@import url('https://fonts.googleapis.com/css?family=Montserrat:400,600')
@import url('https://fonts.googleapis.com/css?family=Source+Code+Pro:400')
// Update Bulma's global variables
$family-serif: "Libre Baskerville",serif
$family-sans-serif: "Montserrat", sans-serif
$family-monospace: "Source Code Pro",monospace
//$family-primary: $family-serif
/* $grey-dark: $brown;
/* $grey-light: $beige-light;
$primary: $dred
$info: $infoblue
//josh-rose-trYl7JYATH0-unsplash
//tersius-van-rhyn-xcQWMPm9fG8-unsplash
//cassie-boca-x-tbVqkfQCU-unsplash
//jf-martin-Ofs3LjEUcrk-unsplash
// background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 1)), url(img/jf-martin-Ofs3LjEUcrk-unsplash.jpg)
//jesse-gardner-EqdpXeemf58-unsplash
#hero-main
background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 1)), url('img/jf-martin-Ofs3LjEUcrk-unsplash.jpg')
background-size: 100% 100%
background-repeat: no-repeat
.hero-body h1, h2, p
text-shadow: -2px -2px black
color: #fff
.main-title
font-size: 4rem
.card.full-height
height: 100%
&:hover
box-shadow: 1px 1px 3px $info;
h1
font-family: $family-serif
.doc
h1
border-bottom: 1px solid #ccc
padding-bottom: 0.15em
a.zola-anchor
padding-left: 0.75rem
display: none
font-family: $family-monospace
h1:hover a.zola-anchor
display: inline
h2:hover a.zola-anchor
display: inline
h3:hover a.zola-anchor
display: inline
h4:hover a.zola-anchor
display: inline
nav.breadcrumb
background: $dwhite
padding-top: 0.25rem
padding-bottom: 0.25rem
a
font-weight: bold
color: $dblue
&:hover
color: black
span.unsplash-credit
color: #555
margin-right: 0.5em
float: right
font-size: smaller
a
color: #555
&:hover
color: #777
//import all of bulma
@import "../../node_modules/bulma/bulma.sass"
p.has-text
color: $text
.card.full-height
.card-content
height: 100%
.content.doc
font-size: 1.1em
max-width: $desktop
text-align: left