zeus.ugent.be/content/assets/stylesheets/includes/general.scss
2017-08-01 19:18:25 +02:00

209 lines
2.8 KiB
SCSS

// Small helper in bulma style
.has-text-justified {
text-align: justify;
}
// Override box styling without round corners
.box {
margin-bottom:10px;
border-radius: 0 !important;
}
// Add some hero attributes to make backgrounds prettier
.hero {
background-position: center;
background-size: cover;
}
// link borders are unnecessary
.content {
a {
&:not(.button) {
border-bottom: none;
}
&:visited:hover {
color: $link-hover;
}
}
}
footer .content a {
&:not(.button) {
color: $text-light;
&:visited {
color: $text-light;
}
&:hover {
color: $link-hover;
}
}
}
// Proper padding of these sections
header.section {
padding-bottom: 10px;
}
main.section {
padding-top: 20px;
}
footer.footer {
padding-bottom: 40px;
}
// Cursor highlight color
::selection {
color: white;
background: rgba(255, 127, 0, 0.99);
}
.has-content-centered {
display: flex;
justify-content: center;
align-items: center;
}
.imgcenter {
margin: auto;
display: block;
}
.hydra-tile {
background-color: #1E64C8;
}
.lana-tile {
background-color: $tile-orange;
}
.project-tile {
background-color: $turquoise;
}
// For better centering on mobile
@include mobile {
#tipue_search_input {
margin: 5px;
}
.nav-menu {
flex-direction: column;
max-height: 0;
overflow: hidden;
transition: all 0.30s ease-in-out;
position: absolute;
top: 100%;
background-color: white;
width: 100%;
&.is-active {
max-height: 275px;
}
}
//for better spacing on mobile
header.section {
padding: 0px 0px;
padding-bottom: 15px;
}
main.section {
padding-top: 0px;
}
.is-narrow {
flex: none;
}
}
.fa {
vertical-align: baseline;
}
.subnav {
margin-top: -20px;
}
.heart {
color: $red;
}
.is-medium-responsive {
// Larger text when on tablet
@include tablet {
font-size: $size-medium;
}
}
.title-responsive {
@include mobile {
font-size: $size-1 - 0.5rem;
}
}
// Responsive font sizes
@for $i from 1 through 6 {
.is-#{$i}-responsive {
font-size: nth($sizes, $i);
@include mobile {
font-size: nth($sizes, $i) * 0.75;
}
}
}
%align {
background-color: $body-background;
margin: 15px;
}
.alignright {
@extend %align;
float: right;
}
.alignleft {
@extend %align;
float: left;
}
.content {
// Bold definition types in <dl></dl>
dt {
font-weight: bold;
}
figure {
position: relative;
img {
display: block;
}
figcaption {
position: absolute;
background-color: rgba(0,0,0,.7);
color: white;
bottom: 0;
width: 100%;
padding: 10px 20px;
transition: all .1s;
opacity: 0;
}
&:hover {
figcaption {
opacity: 1;
}
}
}
sup {
font-size: $size-small;
}
}