flashii/misuzu
flashii/misuzu
3
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Styling fixes.

Browse source
This commit is contained in:
flash 2018-10-22 23:05:22 +02:00
parent a5e9cf8b65
commit aeb71d91d8
8 changed files with 32 additions and 28 deletions

15
assets/less/classes/auth.less
View file

@ -1,13 +1,20 @@
.auth {
background: var(--background-colour);
max-width: 400px;
margin: 0 auto;
margin-bottom: 2px;
&__header {
display: flex;
justify-content: center;
padding: 20px;
background-image: linear-gradient(0deg, #111, var(--accent-colour));
background: var(--user-header) center / cover no-repeat, var(--background-pattern);
background-color: var(--accent-colour);
background-blend-mode: normal, multiply;
&__wrapper {
display: flex;
justify-content: center;
padding: 20px;
background-image: linear-gradient(0deg, var(--background-colour-translucent), transparent);
}
}
&__warning {

8
assets/less/classes/changelog.less
View file

@ -30,11 +30,11 @@
// date header in public changelog
&__date {
display: block;
background-image: linear-gradient(0deg, var(--accent-colour), transparent);
font-weight: 700;
margin-bottom: 1px;
text-decoration: none;
padding: 1px 3px;
color: var(--accent-colour);
font-size: 1.2em;
line-height: 1.5em;
&:hover {
text-decoration: underline;
@ -94,7 +94,7 @@
margin-right: 0;
}
&--light {
&--dark {
color: var(--text-colour-inverted);
}
}

8
assets/less/classes/profile/header.less
View file

@ -6,13 +6,9 @@
text-shadow: 0 1px 4px #111;
box-shadow: 0 1px 4px #111;
--profile-header: initial; //url('/profile.php?u=1&m=background');
background: var(--user-header) center / cover no-repeat, var(--background-pattern);
background-color: var(--accent-colour);
background-image: var(--profile-header);
background-size: cover;
background-repeat: no-repeat;
background-position: 50%;
background-blend-mode: normal, multiply;
@media (max-width: @site-mobile-width) {
height: auto;

13
assets/less/classes/usercard.less
View file

@ -5,10 +5,10 @@
z-index: 1;
color: #fff;
text-shadow: 0 1px 4px #111;
box-shadow: 0 1px 2px #111;
box-shadow: 0 1px 2px #000;
&:hover {
box-shadow: 0 1px 4px #111;
box-shadow: 0 1px 4px #000;
z-index: 2;
}
@ -18,10 +18,9 @@
top: 0;
height: 100%;
width: 100%;
background: var(--user-header) center / cover no-repeat, var(--background-pattern);
background-color: var(--accent-colour);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
background-blend-mode: normal, multiply;
}
&__container {
@ -50,13 +49,13 @@
&__main {
display: flex;
height: 70px;
background-image: linear-gradient(0deg, rgba(0, 0, 0, .9), transparent);
background-image: linear-gradient(0deg, var(--background-colour-translucent), transparent);
}
&__actions {
height: 30px;
padding: 0 10px;
background-color: rgba(0, 0, 0, .9);
background-color: var(--background-colour-translucent);
display: flex;
align-items: center;
}

3
assets/less/main.less
View file

@ -14,7 +14,8 @@
--text-colour-inverted: #000;
--user-colour: inherit;
--accent-colour: #9475b2;
--user-header: url('/images/pixel.png');
--accent-colour: #8559a5;
}
* {

BIN
public/images/pixel.png Normal file
View file

Binary file not shown.
Side by side

After

(image error) Size: 68 B

6
templates/auth/macros.twig
View file

@ -6,8 +6,10 @@
{{ 'login'|csrf|raw }}
<div class="auth__header">
<div class="avatar auth__avatar" id="login-avatar"
style="background-image:url('/profile.php?u=0&amp;m=avatar');"></div>
<div class="auth__header__wrapper">
<div class="avatar auth__avatar" id="login-avatar"
style="background-image:url('/profile.php?u=0&amp;m=avatar');"></div>
</div>
</div>
{% if message|length > 0 %}

7
templates/user/macros.twig
View file

@ -1,6 +1,6 @@
{% macro user_card(user, profile_url, rank_url, actions) %}
<div class="usercard">
<a href="{{ profile_url|default('/profile.php?u=%d')|format(user.user_id) }}"
<div class="usercard" {% if user.user_colour is defined %}style="{{ user.user_colour|html_colour('--accent-colour') }}"{% endif %}>
<a href="{{ profile_url|default('/profile.php?u=%d')|format(user.user_id) }}"
class="usercard__background" title="{{ user.username }}"></a>
<div class="usercard__container">
@ -10,8 +10,7 @@
</div>
<div class="usercard__details">
<div class="usercard__name"
{% if user.user_colour is defined %}style="{{ user.user_colour|html_colour }}"{% endif %}>
<div class="usercard__name">
{{ user.username }}
</div>