Skip to content

Commit

Permalink
layout-update
Browse files Browse the repository at this point in the history 
* add background shape element
* add new background images
* adjust styling
  • Loading branch information
Markus Schulera committed Oct 17, 2023
1 parent 0831879 commit 754499e
Show file tree
Hide file tree
Showing 22 changed files with 5,172 additions and 4,010 deletions.
6 changes: 4 additions & 2 deletions css/colors.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,10 @@ $primCoralRed: #FF4B4B;
$primPeach: #FF744F;
$primTangerine: #F99E49;
$primPaleYellow: #FFF685;
$primPurple: #4B26B7;
$primPurpleLight: #582cd4;

/*
/*
* allowed gradients
* ---
* Coral Red – Peach
Expand All @@ -23,7 +25,7 @@ $primPaleYellow: #FFF685;
$white: #ffffff;

// dont use it - use dark color palett instead
$black: #000;
$black: #000;

// dark color palett
$dark0: #1A2025;
Expand Down
10 changes: 5 additions & 5 deletions css/templates/centered.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -51,19 +51,19 @@ $darkMode: false !default;
}

&.is--panorama {
color: $invertedTextColor;
color: $textColor;


.centered__title {
color: $invertedTextColor;
color: $textColor;

&::after {
background: $invertedTextColor;
background: $textColor;
}
}

.centered__text {
color: $invertedTextColor;
color: $textColor;

&--wrapper {
z-index: 50;
Expand All @@ -75,4 +75,4 @@ $darkMode: false !default;
}
}
}
}
}
36 changes: 35 additions & 1 deletion css/templates/index.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,6 +44,7 @@ $darkMode: false !default;
$darkMode: $darkMode,
$primary: $primary,
$headingColor: $headingColor);

// ----- end template section -----

// overall darkmode toggle switch
Expand Down Expand Up @@ -91,6 +92,39 @@ $darkMode: false !default;
}

.reveal {
.background-shape {
position: absolute;
top: -50%;
right: 0;
z-index: -1;

&.right {
right: -50%;
}

&.left {
left: 50%;
right: auto;
}

&::after {
content: ' ';
width: 1000px;
height: 1000px;
position: absolute;
right: 0;
top: 0;
background-image: linear-gradient(45deg,colors.$primCoralRed 0%,colors.$primPaleYellow 100%);
border-radius: 53% 47% 66% 34% / 46% 52% 48% 54%;
}

&.dark {
&::after {
background-image: linear-gradient(45deg,colors.$primPurple 0%,colors.$primPurpleLight 100%);
}
}
}

.slides {
color: $textColor;
padding-bottom: 40px;
Expand Down Expand Up @@ -148,4 +182,4 @@ $darkMode: false !default;
// please refere to colors.scss for allowed gradients
// @mixin bodyBackground() {
// @include linear-gradient($primCoralRed, $primPaleYellow );
// }
// }
4 changes: 2 additions & 2 deletions css/templates/panorama.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

$primary: colors.$primTangerine !default;
$textColor: colors.$dark0 !default;
$textColorLight: colors.$dark2 !default;
$textColorLight: colors.$dark2 !default;
$invertedTextColor: colors.$white !default;
$headingColor: $textColor !default;
$darkMode: false !default;
Expand Down Expand Up @@ -48,4 +48,4 @@ $darkMode: false !default;
}
}
}
}
}
2 changes: 1 addition & 1 deletion dist/reveal.esm.js
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion dist/reveal.esm.js.map
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion dist/reveal.js
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion dist/reveal.js.map
View file

Large diffs are not rendered by default.

42 changes: 37 additions & 5 deletions dist/theme/valantic-color.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
* Author: Max Mönch
* Last Updated: 06.03.2023
*/
/*
/*
* allowed gradients
* ---
* Coral Red – Peach
Expand Down Expand Up @@ -95,16 +95,16 @@
height: 300px;
}
.reveal .centered.is--panorama {
color: #1A2025;
color: #ffffff;
}
.reveal .centered.is--panorama .centered__title {
color: #1A2025;
color: #ffffff;
}
.reveal .centered.is--panorama .centered__title::after {
background: #1A2025;
background: #ffffff;
}
.reveal .centered.is--panorama .centered__text {
color: #1A2025;
color: #ffffff;
}
.reveal .centered.is--panorama .centered__text--wrapper {
z-index: 50;
Expand Down Expand Up @@ -227,6 +227,12 @@
text-align: left;
position: absolute;
}
.reveal .panorama .nxs__title.light {
color: #1A2025;
}
.reveal .panorama .nxs__title.dark {
color: #ffffff;
}

.hide-in-darkmode {
display: none;
Expand All @@ -248,6 +254,32 @@
width: 100%;
}

.reveal .background-shape {
position: absolute;
top: -50%;
right: 0;
z-index: -1;
}
.reveal .background-shape.right {
right: -50%;
}
.reveal .background-shape.left {
left: 50%;
right: auto;
}
.reveal .background-shape::after {
content: " ";
width: 1000px;
height: 1000px;
position: absolute;
right: 0;
top: 0;
background-image: linear-gradient(45deg, #FF4B4B 0%, #FFF685 100%);
border-radius: 53% 47% 66% 34%/46% 52% 48% 54%;
}
.reveal .background-shape.dark::after {
background-image: linear-gradient(45deg, #4B26B7 0%, #582cd4 100%);
}
.reveal .slides {
color: #ffffff;
padding-bottom: 40px;
Expand Down
34 changes: 33 additions & 1 deletion dist/theme/valantic-dark.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
* Author: Max Mönch
* Last Updated: 06.03.2023
*/
/*
/*
* allowed gradients
* ---
* Coral Red – Peach
Expand Down Expand Up @@ -227,6 +227,12 @@
text-align: left;
position: absolute;
}
.reveal .panorama .nxs__title.light {
color: #1A2025;
}
.reveal .panorama .nxs__title.dark {
color: #ffffff;
}

.hide-in-darkmode {
display: none;
Expand All @@ -248,6 +254,32 @@
width: 100%;
}

.reveal .background-shape {
position: absolute;
top: -50%;
right: 0;
z-index: -1;
}
.reveal .background-shape.right {
right: -50%;
}
.reveal .background-shape.left {
left: 50%;
right: auto;
}
.reveal .background-shape::after {
content: " ";
width: 1000px;
height: 1000px;
position: absolute;
right: 0;
top: 0;
background-image: linear-gradient(45deg, #FF4B4B 0%, #FFF685 100%);
border-radius: 53% 47% 66% 34%/46% 52% 48% 54%;
}
.reveal .background-shape.dark::after {
background-image: linear-gradient(45deg, #4B26B7 0%, #582cd4 100%);
}
.reveal .slides {
color: #ffffff;
padding-bottom: 40px;
Expand Down
42 changes: 37 additions & 5 deletions dist/theme/valantic-simple.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
* Author: Max Mönch
* Last Updated: 06.03.2023
*/
/*
/*
* allowed gradients
* ---
* Coral Red – Peach
Expand Down Expand Up @@ -95,16 +95,16 @@
height: 300px;
}
.reveal .centered.is--panorama {
color: #ffffff;
color: #1A2025;
}
.reveal .centered.is--panorama .centered__title {
color: #ffffff;
color: #1A2025;
}
.reveal .centered.is--panorama .centered__title::after {
background: #ffffff;
background: #1A2025;
}
.reveal .centered.is--panorama .centered__text {
color: #ffffff;
color: #1A2025;
}
.reveal .centered.is--panorama .centered__text--wrapper {
z-index: 50;
Expand Down Expand Up @@ -227,6 +227,12 @@
text-align: left;
position: absolute;
}
.reveal .panorama .nxs__title.light {
color: #1A2025;
}
.reveal .panorama .nxs__title.dark {
color: #ffffff;
}

.hide-in-darkmode {
display: block;
Expand All @@ -248,6 +254,32 @@
width: 100%;
}

.reveal .background-shape {
position: absolute;
top: -50%;
right: 0;
z-index: -1;
}
.reveal .background-shape.right {
right: -50%;
}
.reveal .background-shape.left {
left: 50%;
right: auto;
}
.reveal .background-shape::after {
content: " ";
width: 1000px;
height: 1000px;
position: absolute;
right: 0;
top: 0;
background-image: linear-gradient(45deg, #FF4B4B 0%, #FFF685 100%);
border-radius: 53% 47% 66% 34%/46% 52% 48% 54%;
}
.reveal .background-shape.dark::after {
background-image: linear-gradient(45deg, #4B26B7 0%, #582cd4 100%);
}
.reveal .slides {
color: #1A2025;
padding-bottom: 40px;
Expand Down
12 changes: 7 additions & 5 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,24 +22,26 @@
</head>

<body>
<div class="reveal" style="background-image: url('assets/backgrounds/valantic-bg.png')">
<div class="reveal" style="background-image: url('assets/backgrounds/bg_dark.jpg')">

<!-- Any section element inside of this container is displayed as a slide -->
<div class="slides">
<section class="panorama" data-background="assets/backgrounds/valantic-bg.png">
<section class="panorama" data-background="assets/backgrounds/bg_dark.jpg">
<div class="background-shape left"></div>
<div>
<div class="nxs__logo">
<img src="assets/img/valantic-logo-white.png" alt="valantic logo" />
</div>
<div class="nxs__title-wrapper">
<h1 class="nxs__title inverted">Lorem ipsum dolor</h1>
<h1 class="nxs__title">Lorem ipsum dolor</h1>
</div>
</div>
</section>
<section class="agenda">
<section class="agenda" data-background="assets/backgrounds/valantic-bg.png">
<div class="background-shape dark right"></div>
<h1 class="agenda__title">Agenda</h1>
<div class="agenda__image--wrapper">
<img class="agenda__image" src="assets/backgrounds/mountains01.jpg" alt="Bergige Berg-Berge">
<img class="agenda__image" src="assets/backgrounds/mountains01.jpg" alt="Bergige Berge">
</div>
<div class="agenda__text--wrapper">
<div class="agenda__text">Hier stehen die großartigen Dinge, die in dieser Schulung behandelt
Expand Down
4 changes: 2 additions & 2 deletions plugin/highlight/highlight.esm.js
View file

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions plugin/highlight/highlight.js
View file

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions plugin/markdown/markdown.esm.js
View file

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions plugin/markdown/markdown.js
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion plugin/math/math.esm.js
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion plugin/notes/notes.esm.js
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion plugin/notes/notes.js
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion plugin/search/search.esm.js
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Loading

0 comments on commit 754499e

Please sign in to comment.