diff --git a/app/static/css/widgets.css b/app/static/css/widgets.css index a788e11..984b6e3 100644 --- a/app/static/css/widgets.css +++ b/app/static/css/widgets.css @@ -1,108 +1,139 @@ /* Profile summaries */ .profile { - display: flex; - align-items: center; - width: 265px; + display: flex; + align-items: center; + width: 265px; } + .profile-avatar { - width: 128px; - height: 128px; - margin-right: 16px; + width: 128px; + height: 128px; + margin-right: 16px; } + .profile-name { - font-weight: bold; + font-weight: bold; } + .profile-title { - margin-bottom: 8px; + margin-bottom: 8px; } + .profile-points { - font-size: 11px; + font-size: 11px; } + .profile-points span { - color: gray; + color: gray; } + .profile-points-small { - display: none; + display: none; } + .profile-xp { - height: 10px; - min-width: 96px; - background: var(--background); - border: var(--border); + height: 10px; + min-width: 96px; + background: var(--background); + border: var(--border); } + .profile-xp-100 { - background: var(--background-xp); - border: var(--border-xp); + background: var(--background-xp); + border: var(--border-xp); } + .profile-xp div { - height: 10px; - background: var(--background-xp); - border: var(--border-xp); - margin: -1px; + height: 10px; + background: var(--background-xp); + border: var(--border-xp); + margin: -1px; } + .profile-xp-100 div { - background: var(--background-xp-100); + background: var(--background-xp-100); } .profile.guest { - flex-direction: column; - width: 100%; padding-top: 12px; - text-align: center; + flex-direction: column; + width: 100%; + padding-top: 12px; + text-align: center; } + .profile.guest em { - display: block; - font-weight: bold; font-style: normal; - margin-bottom: 8px; + display: block; + font-weight: bold; + font-style: normal; + margin-bottom: 8px; } @media screen and (max-width: 1199px) { - table.thread .profile { - flex-direction: column; - width: 128px; - } - table.thread .profile-avatar { - order: 1; - margin-right: 0; - } - table.thread .profile-title, - table.thread .profile-points, - table.thread .profile-xp { - display: none; - } - table.thread .profile-points-small { - display: inline; - } + table.thread .profile { + flex-direction: column; + width: 128px; + } + + table.thread .profile-avatar { + order: 1; + margin-right: 0; + } + + table.thread .profile-title, + table.thread .profile-points, + table.thread .profile-xp { + display: none; + } + + table.thread .profile-points-small { + display: inline; + } } /* Trophies */ .trophies { - display: flex; flex-wrap: wrap; justify-content: space-between; + display: flex; + flex-wrap: wrap; + justify-content: space-between; } + .trophy { - display: flex; align-items: center; - width: 260px; - margin: 5px; padding: 5px; - border: 1px solid #c5c5c5; - border-left: 5px solid var(--links); - border-radius: 2px; + display: flex; + align-items: center; + width: 260px; + margin: 5px; + padding: 5px; + border: 1px solid #c5c5c5; + border-left: 5px solid var(--links); + border-radius: 2px; } + .trophy img { - height: 48px; margin-right: 8px; + height: 48px; + margin-right: 8px; } + .trophy div > * { - display: block; + display: block; } + .trophy em { - font-style: normal; font-weight: bold; - margin-bottom: 3px; + font-style: normal; + font-weight: bold; + margin-bottom: 3px; } + .trophy span { - font-size: 80%; + font-size: 80%; } .trophy.disabled { - filter: grayscale(100%); - opacity: .5; - border-left: 1px solid #c5c5c5; + filter: grayscale(100%); + opacity: .5; + border-left: 1px solid #c5c5c5; +} + +hr.signature { + opacity: 0.2; } diff --git a/app/templates/widgets/thread.html b/app/templates/widgets/thread.html index 4ba4c81..d929333 100644 --- a/app/templates/widgets/thread.html +++ b/app/templates/widgets/thread.html @@ -22,8 +22,8 @@ {{ widget_attachments.attachments(c) }} - {% if c.author.signature != "" %} -
+ {% if c.author.signature %} +
{{ c.author.signature|md }} {% endif %}