💄 compact footer
This commit is contained in:
7
app.py
7
app.py
@@ -1,7 +1,7 @@
|
||||
import os
|
||||
from datetime import datetime
|
||||
from flask import Flask, render_template, abort, jsonify, request
|
||||
from comics_data import COMICS, FULL_WIDTH_DEFAULT, PLAIN_DEFAULT, HEADER_IMAGE
|
||||
from comics_data import COMICS, FULL_WIDTH_DEFAULT, PLAIN_DEFAULT, HEADER_IMAGE, COMPACT_FOOTER
|
||||
|
||||
app = Flask(__name__)
|
||||
|
||||
@@ -12,7 +12,10 @@ app.config['SECRET_KEY'] = os.environ.get('SECRET_KEY', 'your-secret-key')
|
||||
@app.context_processor
|
||||
def inject_global_settings():
|
||||
"""Make global settings available to all templates"""
|
||||
return {'header_image': HEADER_IMAGE}
|
||||
return {
|
||||
'header_image': HEADER_IMAGE,
|
||||
'compact_footer': COMPACT_FOOTER
|
||||
}
|
||||
|
||||
|
||||
def is_full_width(comic):
|
||||
|
||||
@@ -14,6 +14,10 @@ PLAIN_DEFAULT = False
|
||||
# Example: HEADER_IMAGE = 'title.jpg' will use static/images/title.jpg
|
||||
HEADER_IMAGE = 'title.jpg'
|
||||
|
||||
# Global setting: Set to True to display footer in compact mode
|
||||
# Compact mode: single line, no border, horizontal layout
|
||||
COMPACT_FOOTER = True
|
||||
|
||||
COMICS = [
|
||||
{
|
||||
'number': 1,
|
||||
|
||||
@@ -494,4 +494,79 @@ footer {
|
||||
font-size: 0.85rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
/* Compact Footer Mode */
|
||||
footer.compact-footer {
|
||||
border-top: none;
|
||||
padding: 0;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
footer.compact-footer .container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
footer.compact-footer .footer-content {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 1rem;
|
||||
margin-bottom: 0;
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
|
||||
footer.compact-footer .footer-section {
|
||||
flex: none;
|
||||
min-width: auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
footer.compact-footer .footer-section h3 {
|
||||
font-size: 0.75rem;
|
||||
margin-bottom: 0;
|
||||
display: inline;
|
||||
}
|
||||
|
||||
footer.compact-footer .social-links {
|
||||
flex-direction: row;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
footer.compact-footer .social-links a {
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
footer.compact-footer .newsletter-placeholder {
|
||||
font-size: 0.75rem;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
footer.compact-footer .footer-bottom {
|
||||
border-top: none;
|
||||
padding-top: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
footer.compact-footer .footer-bottom::before {
|
||||
content: '|';
|
||||
margin-right: 1rem;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
footer.compact-footer .footer-bottom p {
|
||||
font-size: 0.75rem;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* Add separator between sections in compact mode */
|
||||
footer.compact-footer .footer-section:not(:last-child)::after {
|
||||
content: '|';
|
||||
margin-left: 1rem;
|
||||
color: #666;
|
||||
}
|
||||
@@ -62,7 +62,7 @@
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<footer{% if compact_footer %} class="compact-footer"{% endif %}>
|
||||
<div class="container">
|
||||
<div class="footer-content">
|
||||
<div class="footer-section">
|
||||
|
||||
Reference in New Issue
Block a user