Show background images in profile headers. master
authorPete <pete@debu.gs>
Mon, 16 Aug 2021 14:40:19 +0000 (07:40 -0700)
committerPete <pete@debu.gs>
Mon, 16 Aug 2021 14:40:19 +0000 (07:40 -0700)
static/style.css
templates/user.tmpl

index 3992e14446cbb95d39809a80e6205ebf15a32dcf..8c5039e6de4289350d67eb8652e4bb2880fcae3a 100644 (file)
@@ -259,9 +259,20 @@ body {
        margin: 2px 0;
 }
 
+.user-info-container {
+       background-size: cover;
+       background-repeat: no-repeat;
+       background-position: center;
+}
+.user-info-container > * {
+       padding: 0.25em;
+       background-color: rgba(210, 210, 210, 0.8);
+}
+
 .user-profile-img-container {
        display: inline-block;
        margin: 0 4px 4px 0;
+       padding: 1em;
 }
 
 .user-profile-details-container {
@@ -619,6 +630,10 @@ kbd {
        color: #eaeaea;
 }
 
+.dark .user-info-container > * {
+       background-color: rgba(34, 34, 34, 0.8);
+}
+
 .status-color-00 { background-color: rgba(  0,   0,   0, 0.1); }
 .status-color-01 { background-color: rgba( 17, 127,   0, 0.1); }
 .status-color-02 { background-color: rgba( 34, 254,   0, 0.1); }
index dd564200420b83ecd9d6915a805f1f00b8301b35..96fbb29ae7a760134fdea47195b24d7bff37ef6a 100644 (file)
@@ -2,7 +2,7 @@
 {{template "header.tmpl" (WithContext .CommonData $.Ctx)}}
 <div class="page-title"> User </div>
 
-<div class="user-info-container">
+<div class="user-info-container"{{if .User.HeaderStatic}} style="background-image: url({{.User.HeaderStatic}});"{{end}}>
 <div>
        <div class="user-profile-img-container">
                <a class="img-link" href="{{.User.AvatarStatic}}" target="_blank">