add template

This commit is contained in:
Dita Aji Pratama 2024-06-05 23:18:20 +07:00
parent a5cb8878aa
commit 910f395e6a
7 changed files with 154 additions and 0 deletions

3
html/footer.html Normal file
View File

@ -0,0 +1,3 @@
<footer>
${copyright}
</footer>

20
html/index.html Normal file
View File

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>${title}</title>
<link rel="stylesheet" href="/templates/plain/css/style.css">
</head>
<body>
<header>
<h1>${header}</h1>
</header>
${navbar}
<main>
${container}
</main>
${footer}
</body>
</html>

9
html/navbar.html Normal file
View File

@ -0,0 +1,9 @@
<nav class="navbar">
% for item in menu:
% if any(role in item['roles'] for role in user_roles):
<a class="${'active' if item['name'] == active_page else ''}" href="${item['href']}" target="${item['target']}">
${item['name']}
</a>
% endif
% endfor
</nav>

18
main.py Normal file
View File

@ -0,0 +1,18 @@
from core import html
static = [
{
"route" : "/templates/plain/css/<filepath:re:.*\.(css|sass|css.map)>",
"root" : "./templates/plain/static/css"
}
]
def main(dir, page):
html_template = html.main.get_html("templates/plain/html")
html_page = html.main.get_html(dir)
return {
"index" : html_template [ "index.html" ],
"navbar" : html_template [ "navbar.html" ],
"footer" : html_template [ "footer.html" ],
"container" : html_page [f"{page}.html" ]
}

54
static/css/style.css Normal file
View File

@ -0,0 +1,54 @@
body {
font-family: "Arial", sans-serif;
margin: 0;
padding: 0;
color: #333;
background-color: #f4f4f4;
}
header {
background-color: #4CAF50;
padding: 20px;
text-align: center;
color: #fff;
}
.navbar {
display: flex;
background-color: #333;
justify-content: center;
padding: 10px;
}
.navbar a {
color: #fff;
padding: 14px 20px;
text-decoration: none;
text-align: center;
}
.navbar a:hover {
background-color: #ddd;
color: #000;
}
.navbar a.active {
background-color: #4CAF50;
color: #fff;
}
main {
padding: 20px;
}
footer {
background-color: #333;
color: #fff;
text-align: center;
padding: 10px;
position: fixed;
width: 100%;
bottom: 0;
}
/*# sourceMappingURL=style.css.map */

1
static/css/style.css.map Normal file
View File

@ -0,0 +1 @@
{"version":3,"sourceRoot":"","sources":["style.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA","file":"style.css"}

49
static/css/style.scss Normal file
View File

@ -0,0 +1,49 @@
body {
font-family: 'Arial', sans-serif;
margin: 0;
padding: 0;
color: #333;
background-color: #f4f4f4;
}
header {
background-color: #4CAF50;
padding: 20px;
text-align: center;
color: #fff;
}
.navbar {
display: flex;
background-color: #333;
justify-content: center;
padding: 10px;
}
.navbar a {
color: #fff;
padding: 14px 20px;
text-decoration: none;
text-align: center;
}
.navbar a:hover {
background-color: #ddd;
color: #000;
}
.navbar a.active {
background-color: #4CAF50;
color: #fff;
}
main {
padding: 20px;
}
footer {
background-color: #333;
color: #fff;
text-align: center;
padding: 10px;
position: fixed;
width: 100%;
bottom: 0;
}