webseite/assets/sass/main.scss
2019-05-05 17:06:17 +02:00

119 lines
2.4 KiB
SCSS

@import 'libs/vars';
@import 'libs/functions';
@import 'libs/mixins';
@import url("/css/font-awesome.min.css");
@import url("/fonts/roboto.css");
@import url("https://c3woc.de/css/spacestatus.css");
@import "libs/skel";
@import 'parts/startpage';
/*
Landed by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
Modified by Toolbox Bodensee e.V.
*/
@include skel-breakpoints((
xlarge: '(max-width: 1680px)',
large: '(max-width: 1280px)',
medium: '(max-width: 1100px)',
small: '(max-width: 933px)',
xsmall: '(max-width: 480px)'
));
@mixin breakpoint($point) {
@if $point == desktop {
@media (max-width: 1680px) { @content ; }
}
@else if $point == laptop {
@media (max-width: 1280px) { @content ; }
}
@else if $point == tablet {
@media (max-width: 1100px) { @content ; }
}
@else if $point == phablet {
@media (max-width: 933px) { @content ; }
}
@else if $point == mobileonly {
@media (max-width: 480px) { @content ; }
}
}
@include skel-layout((
reset: 'full',
boxModel: 'border',
grid: ( gutters: 2.5em ),
conditionals: true,
containers: 70em,
breakpoints: (
large: (
containers: 90%,
),
medium: (
containers: (100%, true),
)
)
));
@mixin line-icon($bg: _palette(bg), $fg: _palette(fg-bold)) {
@include icon;
$size: 1px;
&::before {
color: $bg !important;
text-shadow:
$size 0 0 $fg,
($size * -1) 0 0 $fg,
0 $size 0 $fg,
0 ($size * -1) 0 $fg;
}
}
$size-wrapper-pad-tb: 6em;
$size-wrapper-pad-lr: 3em;
@include breakpoint(laptop) {
$size-wrapper-pad-tb: 4.5em;
$size-wrapper-pad-lr: 2.5em;
}
@include breakpoint(tablet) {
$size-wrapper-pad-tb: 4.5em;
$size-wrapper-pad-lr: 2.5em;
}
@include breakpoint(phablet) {
$size-wrapper-pad-tb: 3.25em;
$size-wrapper-pad-lr: 1.5em;
}
@include breakpoint(mobileonly) {
$size-wrapper-pad-tb: 3em;
$size-wrapper-pad-lr: 1.25em;
}
@import 'parts/basic';
@import 'parts/loader';
@import 'parts/section-article';
@import 'parts/form';
@import 'parts/box';
@import 'parts/icon';
@import 'parts/image';
@import 'parts/list';
@import 'parts/table';
@import 'parts/button';
@import 'parts/goto-next';
@import 'parts/spotlight';
@import 'parts/wrapper';
@import 'parts/dropotron';
@import 'parts/header';
@import 'parts/banner';
@import 'parts/footer';
@import 'parts/project';
@import 'parts/col';
@import 'parts/youtube';