diff --git a/website/dist/templates/default/index.html b/website/dist/templates/default/index.html index e69de29..0fb0b15 100644 --- a/website/dist/templates/default/index.html +++ b/website/dist/templates/default/index.html @@ -0,0 +1,28 @@ + + + + + + + + + + + {{ pageName }} :: Home + + + +
+ +

Welcome to YOUR PAGE NAME GOES HERE!

+

Here you can have a description of your page, however long you want it!

+
+ + \ No newline at end of file diff --git a/website/dist/templates/default/style.css b/website/dist/templates/default/style.css new file mode 100644 index 0000000..e2549c4 --- /dev/null +++ b/website/dist/templates/default/style.css @@ -0,0 +1,12 @@ +/* +* libreevent - style.css +* +* Created by Janis Hutz 08/29/2023, Licensed under the GPL V3 License +* https://janishutz.com, development@janishutz.com +* +* +*/ + +.logo { + height: 50vh; +} \ No newline at end of file diff --git a/website/dist/templates/helper.js b/website/dist/templates/helper.js new file mode 100644 index 0000000..80d1416 --- /dev/null +++ b/website/dist/templates/helper.js @@ -0,0 +1,27 @@ +let theme = localStorage.getItem( 'theme' ) ?? ''; +if ( window.matchMedia( '(prefers-color-scheme: dark)' ).matches || theme === '☼' ) { + document.documentElement.classList.add( 'dark' ); + document.getElementById( 'themeSelector' ).innerHTML = '☼'; + theme = '☼'; +} else { + document.documentElement.classList.add( 'light' ); + document.getElementById( 'themeSelector' ).innerHTML = '☽'; + theme = '☽'; +} + +// eslint-disable-next-line no-unused-vars +function changeTheme () { + if ( theme === '☼' ) { + document.documentElement.classList.remove( 'dark' ); + document.documentElement.classList.add( 'light' ); + localStorage.setItem( 'theme', '☽' ); + document.getElementById( 'themeSelector' ).innerHTML = '☽'; + theme = '☽'; + } else if ( theme === '☽' ) { + document.documentElement.classList.remove( 'light' ); + document.documentElement.classList.add( 'dark' ); + localStorage.setItem( 'theme', '☼' ); + document.getElementById( 'themeSelector' ).innerHTML = '☼'; + theme = '☼'; + } +} \ No newline at end of file diff --git a/website/dist/templates/main.css b/website/dist/templates/main.css new file mode 100644 index 0000000..5d115f8 --- /dev/null +++ b/website/dist/templates/main.css @@ -0,0 +1,98 @@ +:root, :root.light { + --primary-color: #2c3e50; + --accent-background: rgb(30, 30, 82); + --secondary-color: white; + --background-color: white; + --popup-color: rgb(224, 224, 224); + --accent-color: #42b983; + --hover-color: rgb(165, 165, 165); + --accent-background-hover: rgb(124, 140, 236); + --overlay-color: rgba(0, 0, 0, 0.7); + --inactive-color: rgb(100, 100, 100); + --hint-color: rgb(174, 210, 221); + --PI: 3.14159265358979; +} + +:root.dark { + --primary-color: white; + --accent-background: rgb(20, 20, 116); + --secondary-color: white; + --background-color: rgb(32, 32, 32); + --popup-color: rgb(58, 58, 58); + --accent-color: #42b983; + --hover-color: rgb(83, 83, 83); + --accent-background-hover: rgb(124, 140, 236); + --overlay-color: rgba(104, 104, 104, 0.575); + --inactive-color: rgb(190, 190, 190); + --hint-color: rgb(88, 91, 110); +} + +@media ( prefers-color-scheme: dark ) { + :root { + --primary-color: white; + --accent-background: rgb(20, 20, 116); + --secondary-color: white; + --background-color: rgb(32, 32, 32); + --popup-color: rgb(58, 58, 58); + --accent-color: #42b983; + --hover-color: rgb(83, 83, 83); + --accent-background-hover: rgb(124, 140, 236); + --overlay-color: rgba(104, 104, 104, 0.575); + --inactive-color: rgb(190, 190, 190); + --hint-color: rgb(88, 91, 110); + } +} + +::selection { + background-color: var( --highlight-backdrop ); + color: var( --secondary-color ); +} + +#themeSelector { + background-color: rgba( 0, 0, 0, 0 ); + color: var( --primary-color ); + font-size: 130%; + padding: 0; + margin: 0; + border: none; + cursor: pointer; +} + +nav { + padding: 30px; +} + +nav a { + font-weight: bold; + color: var( --primary-color ); +} + +nav .home { + color: #42b983; + text-decoration: underline; + cursor: default; +} + +html, body { + width: 100%; + height: 100%; + margin: 0; + padding: 0; + color: var( --primary-color ); + background-color: var( --background-color ); + transition: all 0.5s; + font-family: Avenir, Helvetica, Arial, sans-serif; +} + +body { + display: flex; + flex-direction: column; + align-items: center; +} + +.content { + width: 98%; + display: flex; + flex-direction: column; + align-items: center; +} \ No newline at end of file diff --git a/website/dist/templates/modern/index.html b/website/dist/templates/modern/index.html index e69de29..8d1e676 100644 --- a/website/dist/templates/modern/index.html +++ b/website/dist/templates/modern/index.html @@ -0,0 +1,34 @@ + + + + + + + + + + + {{ pageName }} :: Home + + + +
+
+ +
+

YOUR PAGE TITLE GOES HERE

+
You may add a subtitle as well and you may customize the background as well
+
+
+

Here you can add a description, however long you might want it to be.

+ Buy tickets +
+ + \ No newline at end of file diff --git a/website/dist/templates/modern/style.css b/website/dist/templates/modern/style.css new file mode 100644 index 0000000..76a25d1 --- /dev/null +++ b/website/dist/templates/modern/style.css @@ -0,0 +1,55 @@ +/* +* libreevent - style.css +* +* Created by Janis Hutz 08/29/2023, Licensed under the GPL V3 License +* https://janishutz.com, development@janishutz.com +* +* +*/ + +.title { + height: 80vh; + background-position: center; + background-repeat: no-repeat; + background-color: rgba( 0, 0, 0, 0.1 ); + background-size: cover; + background-image: url( /assets/htmlCSSJS.png ); + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + width: 100vw; + padding: 0; + margin: 0; +} + +.title-text { + background-color: var( --overlay-color ); + color: var( --secondary-color ); + display: flex; + justify-content: center; + align-items: center; + flex-direction: column; + padding: 2%; + margin-top: 1%; +} + +.button { + transition: all 1s; + padding: 1%; + border-radius: 50px; + background-color: var( --accent-background ); + cursor: pointer; + color: var( --secondary-color ); + margin-bottom: 5%; + text-decoration: none; +} + +.button:hover { + background-color: var( --accent-background-hover ); + border-radius: 10px; +} + +.logo { + height: 40%; +} \ No newline at end of file