diff --git a/assets/sass/libs/_vars.scss b/assets/sass/libs/_vars.scss
index a8c405e..a62a75f 100644
--- a/assets/sass/libs/_vars.scss
+++ b/assets/sass/libs/_vars.scss
@@ -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),
);
diff --git a/assets/sass/main.scss b/assets/sass/main.scss
index ccf0de0..a702708 100644
--- a/assets/sass/main.scss
+++ b/assets/sass/main.scss
@@ -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';
diff --git a/assets/sass/parts/_banner.scss b/assets/sass/parts/_banner.scss
index 908af6e..469ad3b 100644
--- a/assets/sass/parts/_banner.scss
+++ b/assets/sass/parts/_banner.scss
@@ -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;
}
}
-
diff --git a/assets/sass/parts/_button.scss b/assets/sass/parts/_button.scss
index 79644d4..760fd85 100644
--- a/assets/sass/parts/_button.scss
+++ b/assets/sass/parts/_button.scss
@@ -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 {
diff --git a/assets/sass/parts/_col.scss b/assets/sass/parts/_col.scss
index e73e7df..6c613b9 100644
--- a/assets/sass/parts/_col.scss
+++ b/assets/sass/parts/_col.scss
@@ -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;
+ }
+}
diff --git a/assets/sass/parts/_goto-next.scss b/assets/sass/parts/_goto-next.scss
index f2a632c..d078328 100644
--- a/assets/sass/parts/_goto-next.scss
+++ b/assets/sass/parts/_goto-next.scss
@@ -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 @@
}
}
}
-
diff --git a/assets/sass/parts/_image.scss b/assets/sass/parts/_image.scss
index 65cbf64..52a2a12 100644
--- a/assets/sass/parts/_image.scss
+++ b/assets/sass/parts/_image.scss
@@ -56,5 +56,13 @@
&.mapid {
height: 70vh;
}
+ &.lightgallery {
+ width: 33%;
+ @include breakpoint(tablet) {
+ width: 49%;
+ }
+ @include breakpoint(phablet) {
+ width: 100%;
+ }
+ }
}
-
diff --git a/assets/sass/parts/_list.scss b/assets/sass/parts/_list.scss
index f95b494..1b44290 100644
--- a/assets/sass/parts/_list.scss
+++ b/assets/sass/parts/_list.scss
@@ -159,4 +159,3 @@ ul {
dl {
margin: 0 0 _size(element-margin) 0;
}
-
diff --git a/assets/sass/parts/_project.scss b/assets/sass/parts/_project.scss
index 0fb2266..410f1d3 100644
--- a/assets/sass/parts/_project.scss
+++ b/assets/sass/parts/_project.scss
@@ -1,5 +1,5 @@
.project {
- height: 420px;
+ height: 600px;
}
.teaser {
diff --git a/assets/sass/parts/_spotlight.scss b/assets/sass/parts/_spotlight.scss
index 640036f..4ac706b 100644
--- a/assets/sass/parts/_spotlight.scss
+++ b/assets/sass/parts/_spotlight.scss
@@ -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;
- }
}
}
diff --git a/assets/sass/parts/_table.scss b/assets/sass/parts/_table.scss
index 1a9b611..05709c9 100644
--- a/assets/sass/parts/_table.scss
+++ b/assets/sass/parts/_table.scss
@@ -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;
+ }
+ }
+ }
+ }
+}
diff --git a/assets/sass/parts/_youtube.scss b/assets/sass/parts/_youtube.scss
new file mode 100644
index 0000000..bc01dbf
--- /dev/null
+++ b/assets/sass/parts/_youtube.scss
@@ -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;
+}
diff --git a/templates/blog-post.html b/templates/blog-post.html
index 29d930e..d1dbae8 100644
--- a/templates/blog-post.html
+++ b/templates/blog-post.html
@@ -7,6 +7,7 @@
{% 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 %}
{% block title %}Startseite{% endblock %} - c3woc.de
+
+
+
{%
if '/css/main.min.css'|asseturl == empty and '/css/main.css'|asseturl == empty %}