Merge branch 'master' of github.com:c3woc/c3woc-website
This commit is contained in:
L3D
commit
f7d27b4f13
GPG key ID:
CD08445BFF4313D1
14 changed files with 152 additions and 46 deletions
|
|
@ -24,8 +24,8 @@ $size: (
|
|||
$font: (
|
||||
family: ('Roboto', Helvetica, sans-serif),
|
||||
family-fixed: ('Courier New', monospace),
|
||||
weight: 400,
|
||||
weight-bold: 500
|
||||
weight: 300,
|
||||
weight-bold: 400
|
||||
);
|
||||
|
||||
// Palette.
|
||||
|
|
@ -51,5 +51,5 @@ $palette: (
|
|||
|
||||
//pictures startpage
|
||||
$picture-startpage: (
|
||||
scroll-1: url(../images/home/abschnitt1.jpeg),
|
||||
scroll-1: url(/images/home/abschnitt1.jpeg),
|
||||
);
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
@import 'libs/vars';
|
||||
@import 'libs/functions';
|
||||
@import 'libs/mixins';
|
||||
@import url("../css/font-awesome.min.css");
|
||||
@import url("../fonts/roboto.css");
|
||||
@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';
|
||||
|
|
@ -17,7 +17,7 @@ Modified by Toolbox Bodensee e.V.
|
|||
@include skel-breakpoints((
|
||||
xlarge: '(max-width: 1680px)',
|
||||
large: '(max-width: 1280px)',
|
||||
medium: '(max-width: 980px)',
|
||||
medium: '(max-width: 1100px)',
|
||||
small: '(max-width: 933px)',
|
||||
xsmall: '(max-width: 480px)'
|
||||
));
|
||||
|
|
@ -32,7 +32,7 @@ Modified by Toolbox Bodensee e.V.
|
|||
}
|
||||
|
||||
@else if $point == tablet {
|
||||
@media (max-width: 980px) { @content ; }
|
||||
@media (max-width: 1100px) { @content ; }
|
||||
}
|
||||
|
||||
@else if $point == phablet {
|
||||
|
|
@ -116,4 +116,4 @@ $size-wrapper-pad-lr: 3em;
|
|||
@import 'parts/footer';
|
||||
@import 'parts/project';
|
||||
@import 'parts/col';
|
||||
|
||||
@import 'parts/youtube';
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
#banner {
|
||||
background-attachment: fixed;
|
||||
background-color: _palette(accent2);
|
||||
background-image: url('../../images/banner.jpg');
|
||||
background-image: url('/images/banner.jpg');
|
||||
background-position: center center;
|
||||
background-size: cover;
|
||||
box-shadow: 0 0.25em 0.5em 0 rgba(0, 0, 0, 0.25);
|
||||
|
|
@ -86,10 +86,6 @@
|
|||
h2 {
|
||||
font-size: 2.5em;
|
||||
margin: 0;
|
||||
|
||||
@include breakpoint(phablet) {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
}
|
||||
|
||||
p {
|
||||
|
|
@ -99,13 +95,12 @@
|
|||
}
|
||||
|
||||
.image {
|
||||
border-radius: 0;
|
||||
border-radius: 100%;
|
||||
display: inline-block;
|
||||
height: 19em;
|
||||
height: 18em;
|
||||
margin-left: 3em;
|
||||
margin-top: 2em;
|
||||
vertical-align: middle;
|
||||
width: 19em;
|
||||
width: 18em;
|
||||
|
||||
@include breakpoint(tablet) {
|
||||
margin: 0;
|
||||
|
|
@ -117,7 +112,7 @@
|
|||
}
|
||||
|
||||
img {
|
||||
border-radius: 0;
|
||||
border-radius: 100%;
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
|
|
@ -130,4 +125,3 @@ body.is-touch {
|
|||
background-attachment: scroll;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -21,10 +21,6 @@ input[type="button"],
|
|||
text-decoration: none;
|
||||
white-space: nowrap;
|
||||
|
||||
@include breakpoint(mobileonly) {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:active {
|
||||
box-shadow: inset 0 0 0 1px _palette(accent1);
|
||||
|
|
@ -45,6 +41,8 @@ input[type="button"],
|
|||
display: block;
|
||||
margin: 0 0 (_size(element-margin) * 0.5) 0;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
&.small {
|
||||
|
|
|
|||
|
|
@ -1,12 +1,43 @@
|
|||
/* Columns */
|
||||
@for $i from 2 through 5 {
|
||||
.col-#{$i} {
|
||||
column-count: $i;
|
||||
column-gap: 1vw;
|
||||
|
||||
> .button {
|
||||
padding: 0;
|
||||
.col-2 {
|
||||
column-count: 2;
|
||||
column-gap: 1vw;
|
||||
height:auto;
|
||||
> .button {
|
||||
padding: 0;
|
||||
}
|
||||
&.long {
|
||||
@include breakpoint(phablet) {
|
||||
column-count: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.col-3 {
|
||||
column-count: 3;
|
||||
column-gap: 1vw;
|
||||
height:auto;
|
||||
> .button {
|
||||
padding: 0;
|
||||
}
|
||||
@include breakpoint(phablet) {
|
||||
column-count: 2;
|
||||
}
|
||||
&.long {
|
||||
@include breakpoint(phablet) {
|
||||
column-count: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.col-4 {
|
||||
column-count: 4;
|
||||
column-gap: 1vw;
|
||||
height:auto;
|
||||
> .button {
|
||||
padding: 0;
|
||||
}
|
||||
@include breakpoint(phablet) {
|
||||
column-count: 2;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
z-index: 1;
|
||||
|
||||
&::before {
|
||||
background-image: url('images/arrow.svg');
|
||||
background-image: url('/css/images/arrow.svg');
|
||||
background-position: center center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
|
|
@ -35,4 +35,3 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -56,5 +56,13 @@
|
|||
&.mapid {
|
||||
height: 70vh;
|
||||
}
|
||||
&.lightgallery {
|
||||
width: 33%;
|
||||
@include breakpoint(tablet) {
|
||||
width: 49%;
|
||||
}
|
||||
@include breakpoint(phablet) {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -159,4 +159,3 @@ ul {
|
|||
dl {
|
||||
margin: 0 0 _size(element-margin) 0;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
.project {
|
||||
height: 420px;
|
||||
height: 600px;
|
||||
}
|
||||
|
||||
.teaser {
|
||||
|
|
|
|||
|
|
@ -142,13 +142,8 @@
|
|||
height: 101%;
|
||||
padding: $size-wrapper-pad-tb $size-wrapper-pad-lr;
|
||||
top: 0;
|
||||
width: 28em;
|
||||
width: 30em;
|
||||
min-width: 25%;
|
||||
|
||||
@include breakpoint(laptop) {
|
||||
padding: $size-wrapper-pad-tb $size-wrapper-pad-lr;
|
||||
width: 25em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,12 +1,9 @@
|
|||
/* Table */
|
||||
.table-wrapper {
|
||||
-webkit-overflow-scrolling: touch;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
table {
|
||||
margin: 0 0 _size(element-margin) 0;
|
||||
width: 100%;
|
||||
word-wrap:break-word;
|
||||
table-layout: fixed;
|
||||
|
||||
tbody {
|
||||
tr {
|
||||
|
|
@ -71,5 +68,34 @@ table {
|
|||
border-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
margin: 0 0 0 0;
|
||||
}
|
||||
|
||||
@include breakpoint(mobileonly) {
|
||||
td {
|
||||
width:100%;
|
||||
display: block;
|
||||
margin:10px 0px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.table-wrapper {
|
||||
-webkit-overflow-scrolling: touch;
|
||||
overflow-x: auto;
|
||||
&.code {
|
||||
border-radius: 5px;
|
||||
font-style: italic;
|
||||
table {
|
||||
margin: 0 0 0 0;
|
||||
tbody {
|
||||
tr {
|
||||
border: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
51
assets/sass/parts/_youtube.scss
Normal file
51
assets/sass/parts/_youtube.scss
Normal file
|
|
@ -0,0 +1,51 @@
|
|||
.youtube {
|
||||
background-color: #000;
|
||||
margin-bottom: 30px;
|
||||
position: relative;
|
||||
padding-top: 56.25%;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
}
|
||||
.youtube img {
|
||||
width: 100%;
|
||||
top: -16.82%;
|
||||
left: 0;
|
||||
opacity: 0.7;
|
||||
}
|
||||
.youtube .play-button {
|
||||
width: 90px;
|
||||
height: 60px;
|
||||
background-color: #333;
|
||||
box-shadow: 0 0 30px rgba( 0,0,0,0.6 );
|
||||
z-index: 1;
|
||||
opacity: 0.8;
|
||||
border-radius: 6px;
|
||||
}
|
||||
.youtube .play-button:before {
|
||||
content: "";
|
||||
border-style: solid;
|
||||
border-width: 15px 0 15px 26.0px;
|
||||
border-color: transparent transparent transparent #fff;
|
||||
}
|
||||
.youtube img,
|
||||
.youtube .play-button {
|
||||
cursor: pointer;
|
||||
}
|
||||
.youtube img,
|
||||
.youtube iframe,
|
||||
.youtube .play-button,
|
||||
.youtube .play-button:before {
|
||||
position: absolute;
|
||||
}
|
||||
.youtube .play-button,
|
||||
.youtube .play-button:before {
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate3d( -50%, -50%, 0 );
|
||||
}
|
||||
.youtube iframe {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
|
@ -7,6 +7,7 @@
|
|||
<link rel="import" href="{{ '/youtube-embed.html'|url }}"> {% endif %}
|
||||
{% endblock %}{% endif %}
|
||||
{% block title %}{{ this.title }}{% endblock %}
|
||||
{% block expand_ogg_image %}"{% if this.xml_img %}{{ this.xml_img|url }}{% else %}{{ '/images/waffel.jpeg'|asseturl }}{% endif %}"{% endblock %}
|
||||
{% block expand_description %}
|
||||
<meta name="description" content="{%
|
||||
if this.xml %}{{ this.xml }}{% else %}{%
|
||||
|
|
|
|||
|
|
@ -5,6 +5,10 @@
|
|||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>{% block title %}Startseite{% endblock %} - c3woc.de</title>
|
||||
<meta property="og:title" content="{{ this.title }}"/>
|
||||
<meta property="og:type" content="{{ this._path }}"/>
|
||||
<meta property="og:image" content={% block expand_ogg_image
|
||||
%}"{{ '/images/og-image.png'|asseturl }}"{% endblock %} />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />{%
|
||||
if '/css/main.min.css'|asseturl == empty and '/css/main.css'|asseturl == empty %}
|
||||
<link rel="stylesheet" href="{{ '/css/font-awesome.min.css'|asseturl }}" />
|
||||
|
|
|
|||
Loading…
Reference in a new issue