diff --git a/app/main.py b/app/main.py index fd8bb8e..63f740b 100644 --- a/app/main.py +++ b/app/main.py @@ -71,6 +71,7 @@ from app.templates import is_current_user_admin from app.uploads import UPLOAD_DIR from app.utils import pagination from app.utils.emoji import EMOJIS_BY_NAME +from app.utils.highlight import HIGHLIGHT_CSS_HASH from app.utils.url import check_url from app.webfinger import get_remote_follow_template @@ -133,9 +134,10 @@ class CustomMiddleware: headers["x-xss-protection"] = "1; mode=block" headers["x-frame-options"] = "SAMEORIGIN" # TODO(ts): disallow inline CSS? - headers[ - "content-security-policy" - ] = "default-src 'self'; style-src 'self' 'unsafe-inline';" + headers["content-security-policy"] = ( + f"default-src 'self'; " + f"style-src 'self' 'sha256-{HIGHLIGHT_CSS_HASH}';" + ) if not DEBUG: headers["strict-transport-security"] = "max-age=63072000;" diff --git a/app/scss/main.scss b/app/scss/main.scss index 7894af4..760ed7c 100644 --- a/app/scss/main.scss +++ b/app/scss/main.scss @@ -17,6 +17,36 @@ $code-highlight-background: #f0f0f0; color: $primary-color; } +#admin { + .admin-menu { + margin-bottom: 30px; + padding: 0 20px; + } +} + +.empty-state { + padding: 20px; +} + +.public-top-menu { + margin: 30px 0 0 0; +} + +.width-95 { + width: 95%; +} + +.bold { + font-weight: bold; +} + +.admin-new { + textarea { + font-size: 1.2em; + width: 95%; + } +} + .show-more-wrapper { .p-summary { display: inline-block; @@ -65,13 +95,6 @@ blockquote { color: $muted-color; } -.poll-bar { - width:100%;height:20px; - line { - stroke: $secondary-color; - } -} - .light-background { background: $light-background; } @@ -240,6 +263,9 @@ footer { padding: 0 20px; li { display: block; + span { + padding-right:10px; + } } } @@ -274,6 +300,57 @@ footer { margin: 20px 0; } +.show-hide-sensitive-btn { + display:inline-block; +} + +.no-margin-top { + margin-top: 0; +} + +.float-right { + float: right; +} + +ul.poll-items { + list-style-type: none; + padding: 0; + li { + display: block; + p { + margin: 20px 0 10px 0; + .poll-vote { + padding-left: 20px; + } + } + + .poll-bar { + width:100%;height:20px; + line { + stroke: $secondary-color; + stroke-width: 20px; + } + } + + } +} + +.attachment-wrapper { + .attachment-item { + margin-top: 20px; + } + img.attachment { + margin: 0; + } + a.attachment { + display: inline-block; + margin-bottom: 15px; + } + audio.attachment { + width: 480px; + } +} + nav { form { margin: 15px 0; @@ -334,7 +411,7 @@ nav.flexbox { } } .activity-attachment { - margin: 30px 0; + margin: 30px 0 20px 0; img, audio, video { width: 100%; max-width: 740px; @@ -345,6 +422,20 @@ nav.flexbox { max-width: 740px; } } + +.activity-og-meta { + display: flex; + column-gap: 20px; + margin: 20px 0; + img { + max-width: 200px; + max-height: 100px; + } + small { + display: block; + } +} + .ap-object-expanded { border: 2px dashed $secondary-color; } @@ -367,3 +458,54 @@ nav.flexbox { .emoji, .custom-emoji { max-width: 25px; } + +.indieauth-box { + display: flex; + column-gap: 20px; + + .indieauth-logo { + flex: initial; + width: 100px; + img { + max-width: 100px; + } + } + .indieauth-details { + flex: 1; + div { + padding-left: 20px; + a { + font-size: 1.2em; + font-weight: 600; + } + } + } +} + +.public-interactions { + display: flex; + column-gap: 20px; + flex-wrap: wrap; + margin-top: 20px; + .interactions-block { + flex: 0 1 30%; + max-width: 50%; + .facepile-wrapper { + display: flex; + column-gap: 20px; + row-gap: 20px; + flex-wrap: wrap; + margin-top: 20px; + a { + height: 50px; + img { + max-width: 50px; + } + } + .and-x-more { + display: inline-block; + align-self: center; + } + } + } +} diff --git a/app/templates/admin_new.html b/app/templates/admin_new.html index f86425a..2169a77 100644 --- a/app/templates/admin_new.html +++ b/app/templates/admin_new.html @@ -25,7 +25,7 @@ -