feat: add theme support and refactor assets
All checks were successful
Build and Deploy Static Site / build (push) Successful in 57s
All checks were successful
Build and Deploy Static Site / build (push) Successful in 57s
Introduce support for themes by adding a `theme` parameter to the site generation process and as an argument to the main script. Created separate CSS files for different themes and adjusted the structure to accommodate the style changes. Also, updated the use of assets with new SVG images and logos. Refactored HTML templates to dynamically select the theme and updated path references to images accordingly. Improved the development experience by adding a default "plain" theme and enhancing command-line argument parsing for theme selection. Closes #7
This commit is contained in:
parent
c64a957bea
commit
92238bcfa2
GPG key ID:
ECBCC9082395383F
10 changed files with 278 additions and 179 deletions
|
|
@ -148,10 +148,6 @@ h5 {
|
|||
fill: var(--bs-primary-bg-subtle);
|
||||
}
|
||||
|
||||
.bg-pride-gradient {
|
||||
background: linear-gradient(45deg, #FF7878, #FFC898, #FFF89A, #CDF2CA, #A2CDCD, #D1E8E4, #CAB8FF);
|
||||
}
|
||||
|
||||
/* Responsive Styles */
|
||||
@media (max-width: 991px) {
|
||||
p.text-center.special-header {
|
||||
|
|
|
|||
15
assets/css/theme/plain.css
Normal file
15
assets/css/theme/plain.css
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
#logoContainer {
|
||||
background-image: url(../../img/logo-inv_grad.svg);
|
||||
background-size: contain;
|
||||
max-width: 400px;
|
||||
max-height: 400px;
|
||||
width: 80vh;
|
||||
height: 80vh;
|
||||
}
|
||||
|
||||
#smallLogoContainer {
|
||||
background-image: url(../../img/logo-inv_grad.svg);
|
||||
background-size: contain;
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
}
|
||||
19
assets/css/theme/pride.css
Normal file
19
assets/css/theme/pride.css
Normal file
|
|
@ -0,0 +1,19 @@
|
|||
.bg-primary-gradient {
|
||||
background: linear-gradient(45deg, #FF7878, #FFC898, #FFF89A, #CDF2CA, #A2CDCD, #D1E8E4, #CAB8FF);
|
||||
}
|
||||
|
||||
#logoContainer {
|
||||
background-image: url(../../img/logo-white.svg);
|
||||
background-size: contain;
|
||||
max-width: 400px;
|
||||
max-height: 400px;
|
||||
width: 80vh;
|
||||
height: 80vh;
|
||||
}
|
||||
|
||||
#smallLogoContainer {
|
||||
background-image: url(../../img/logo-inv_grad.svg);
|
||||
background-size: contain;
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
}
|
||||
68
assets/img/logo-white.svg
Normal file
68
assets/img/logo-white.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 14 KiB |
9
main.py
9
main.py
|
|
@ -56,16 +56,18 @@ def render_template_to_file(template_name, output_name, **kwargs):
|
|||
try:
|
||||
template = env.get_template(template_name)
|
||||
output_path = output_dir / output_name
|
||||
kwargs.setdefault("theme", "plain")
|
||||
with open(output_path, "w", encoding="utf-8") as f:
|
||||
f.write(template.render(**kwargs))
|
||||
except TemplateNotFound:
|
||||
print(f"Template {template_name} not found.")
|
||||
|
||||
|
||||
def generate_static_site(development_mode=False):
|
||||
def generate_static_site(development_mode=False, theme="plain"):
|
||||
# Common context
|
||||
kwargs = {
|
||||
"timestamp": int(datetime.datetime.now().timestamp()),
|
||||
"theme": theme,
|
||||
}
|
||||
|
||||
if development_mode:
|
||||
|
|
@ -171,10 +173,13 @@ if __name__ == "__main__":
|
|||
parser.add_argument(
|
||||
"--port", type=int, default=8000, help="Port to serve the site on"
|
||||
)
|
||||
parser.add_argument(
|
||||
"--theme", type=str, default="plain", help="Theme to use for the site"
|
||||
)
|
||||
|
||||
args = parser.parse_args()
|
||||
|
||||
generate_static_site(development_mode=args.dev)
|
||||
generate_static_site(development_mode=args.dev, theme=args.theme)
|
||||
|
||||
if args.serve:
|
||||
server = TCPServer(("", args.port), StaticPageHandler)
|
||||
|
|
|
|||
|
|
@ -44,10 +44,11 @@
|
|||
name="twitter:image"
|
||||
content="https://private.coffee/assets/img/logo-inv_grad.png"
|
||||
/>
|
||||
<link rel="icon" type="image/png" href="assets/img/logo_inv_grad.png" />
|
||||
<link rel="icon" type="image/png" href="assets/img/logo-inv_grad.png" />
|
||||
<title>{% block title %}{% endblock %} - Private.coffee</title>
|
||||
<link rel="stylesheet" href="assets/dist/css/bootstrap.min.css" />
|
||||
<link rel="stylesheet" href="assets/css/base.css?v={{ timestamp }}" />
|
||||
<link rel="stylesheet" href="assets/css/theme/{{ theme }}.css?v={{ timestamp }}" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
|
@ -56,8 +57,7 @@
|
|||
<div class="row d-lg-flex align-items-lg-center">
|
||||
<div class="col p-0">
|
||||
<a href="/"
|
||||
><img src="assets/img/logo-inv_grad.svg" style="height: 60px"
|
||||
/></a>
|
||||
><div id="smallLogoContainer"></div></a>
|
||||
</div>
|
||||
<div class="col d-flex">
|
||||
<a class="navbar-brand d-flex align-items-center" href="/">
|
||||
|
|
|
|||
|
|
@ -15,11 +15,7 @@
|
|||
</p>
|
||||
</div>
|
||||
<div class="col-12 col-lg-10 mx-auto justify-content-center d-flex">
|
||||
<img
|
||||
class="mx-auto"
|
||||
src="assets/img/logo-inv_grad.svg"
|
||||
style="max-width: 400px; width: 80vw"
|
||||
/>
|
||||
<div id="logoContainer"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in a new issue