janishutz/libreevent
1
0
Fork 0
mirror of https://github.com/janishutz/libreevent.git synced 2025-11-25 05:14:23 +00:00
Code Issues Packages Projects Releases Wiki Activity

update website to be almost complete

Browse Source
This commit is contained in:
Janis Hutz
2023-10-07 15:04:39 +02:00
parent 97c68d9b17
commit e767c1fb3d
6 changed files with 254 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
website/dist/templates/default/index.html vendored
View File

@@ -0,0 +1,28 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200"> -->
<script defer src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<link rel="stylesheet" href="/templates/default/style.css">
<link rel="stylesheet" href="/templates/main.css">
<script defer src="/templates/helper.js"></script>
<title>{{ pageName }} :: Home</title>
</head>
<body>
<nav>
<a href="/templates">Back to templates</a> |
<a class="home">Home</a> |
<a>Tickets</a> |
<a>Cart</a> |
<a>Account</a> |
<button onclick="changeTheme();" id="themeSelector">&#9789;</button>
</nav>
<div class="content">
<img src="/assets/logo.png" alt="libreevent logo" class="logo">
<h1>Welcome to YOUR PAGE NAME GOES HERE!</h1>
<p>Here you can have a description of your page, however long you want it!</p>
</div>
</body>
</html>

12
website/dist/templates/default/style.css vendored Normal file
View File

@@ -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;
}

27
website/dist/templates/helper.js vendored Normal file
View File

@@ -0,0 +1,27 @@
let theme = localStorage.getItem( 'theme' ) ?? '';
if ( window.matchMedia( '(prefers-color-scheme: dark)' ).matches || theme === '&#9788;' ) {
document.documentElement.classList.add( 'dark' );
document.getElementById( 'themeSelector' ).innerHTML = '&#9788;';
theme = '&#9788;';
} else {
document.documentElement.classList.add( 'light' );
document.getElementById( 'themeSelector' ).innerHTML = '&#9789;';
theme = '&#9789;';
}
// eslint-disable-next-line no-unused-vars
function changeTheme () {
if ( theme === '&#9788;' ) {
document.documentElement.classList.remove( 'dark' );
document.documentElement.classList.add( 'light' );
localStorage.setItem( 'theme', '&#9789;' );
document.getElementById( 'themeSelector' ).innerHTML = '&#9789;';
theme = '&#9789;';
} else if ( theme === '&#9789;' ) {
document.documentElement.classList.remove( 'light' );
document.documentElement.classList.add( 'dark' );
localStorage.setItem( 'theme', '&#9788;' );
document.getElementById( 'themeSelector' ).innerHTML = '&#9788;';
theme = '&#9788;';
}
}

98
website/dist/templates/main.css vendored Normal file
View File

@@ -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;
}

34
website/dist/templates/modern/index.html vendored
View File

@@ -0,0 +1,34 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200"> -->
<script defer src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<link rel="stylesheet" href="/templates/modern/style.css">
<link rel="stylesheet" href="/templates/main.css">
<script defer src="/templates/helper.js"></script>
<title>{{ pageName }} :: Home</title>
</head>
<body>
<nav>
<a href="/templates">Back to templates</a> |
<a class="home">Home</a> |
<a>Tickets</a> |
<a>Cart</a> |
<a>Account</a> |
<button onclick="changeTheme();" id="themeSelector">&#9789;</button>
</nav>
<div class="content">
<div class="title">
<img src="/assets/logo.png" alt="libreevent logo" class="logo">
<div class="title-text">
<h1>YOUR PAGE TITLE GOES HERE</h1>
<footer>You may add a subtitle as well and you may customize the background as well</footer>
</div>
</div>
<p>Here you can add a description, however long you might want it to be.</p>
<a class="button">Buy tickets</a>
</div>
</body>
</html>

55
website/dist/templates/modern/style.css vendored Normal file
View File

@@ -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%;
}