Commander1024/lostplaces-frontend
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Some Tweaks

Browse Source
This commit is contained in:
reverend 2020-08-12 21:31:13 +02:00
parent f0b3839e73
commit 09a6377901
4 changed files with 45 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
components/01_Atoms/message/_message.scss
View File

@ -1,11 +1,14 @@
.LP-Message{ .LP-Message{
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; justify-content: center;
align-items: stretch;
background-color: $-almost-white; background-color: $-almost-white;
font-family: $-primary-sans-serif-font; font-family: $-primary-sans-serif-font;
border-radius: 3px; border-radius: 3px;
font-weight: bold; font-weight: bold;
box-shadow: 0 0 2px $-grey;
overflow: hidden;
&--error{ &--error{
.LP-Message__Icon{ .LP-Message__Icon{
@ -47,12 +50,19 @@
background-size: 40px 40px; background-size: 40px 40px;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center; background-position: center;
height: 50px; height: 100%;
min-height: 50px;
width: 50px; width: 50px;
filter: invert(1); filter: invert(1);
flex-shrink: 0;
flex-grow: 0;
} }
.LP-Message__Text{ .LP-Message__Text{
padding: 0 15px; padding: 0 15px;
flex-grow: 1;
display: flex;
flex-direction: column;
justify-content: center;
} }
} }

5
components/01_Atoms/message/message.hbs
View File

@ -1,5 +1,8 @@
<div class="LP-Message {{#if modifier}}LP-Message{{modifier}}{{/if}}"> <div class="LP-Message {{#if modifier}}LP-Message{{modifier}}{{/if}}">
<div class="LP-Message__Icon"> <div>
<div class="LP-Message__Icon">
</div>
</div> </div>
<div class="LP-Message__Text"> <div class="LP-Message__Text">
{{messageText}} {{messageText}}

3
components/02_Molecules/_molecules.scss
View File

@ -1,4 +1,5 @@
@import 'textSection/textSection'; @import 'textSection/textSection';
@import 'placeTeaser/placeTeaser'; @import 'placeTeaser/placeTeaser';
@import 'tagList/tagList'; @import 'tagList/tagList';
@import 'navigation/navigation'; @import 'navigation/navigation';
@import 'messageList/messageList';

32
public/main.css
View File

@ -208,11 +208,14 @@ body {
.LP-Message { .LP-Message {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; justify-content: center;
align-items: stretch;
background-color: #f9f9f9; background-color: #f9f9f9;
font-family: Montserrat, Helvetica, sans-serif; font-family: Montserrat, Helvetica, sans-serif;
border-radius: 3px; border-radius: 3px;
font-weight: bold; } font-weight: bold;
box-shadow: 0 0 2px #565656;
overflow: hidden; }
.LP-Message--error .LP-Message__Icon { .LP-Message--error .LP-Message__Icon {
background-color: #02979e; background-color: #02979e;
background-image: url("/icons/error.png"); } background-image: url("/icons/error.png"); }
@ -232,11 +235,18 @@ body {
background-size: 40px 40px; background-size: 40px 40px;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center; background-position: center;
height: 50px; height: 100%;
min-height: 50px;
width: 50px; width: 50px;
filter: invert(1); } filter: invert(1);
flex-shrink: 0;
flex-grow: 0; }
.LP-Message .LP-Message__Text { .LP-Message .LP-Message__Text {
padding: 0 15px; } padding: 0 15px;
flex-grow: 1;
display: flex;
flex-direction: column;
justify-content: center; }
.LP-Content { .LP-Content {
padding: 35px; } padding: 35px; }
@ -382,6 +392,18 @@ body {
.LP-Menu .LP-Menu__List { .LP-Menu .LP-Menu__List {
justify-content: space-between; } } justify-content: space-between; } }
.LP-MessageList {
padding: 25px; }
.LP-MessageList .LP-MessageList__List {
padding: 0;
margin: 0;
list-style-type: none;
display: flex;
flex-direction: column;
justify-content: space-between; }
.LP-MessageList .LP-MessageList__Item {
margin: 5px 0; }
.LP-Header { .LP-Header {
display: flex; display: flex;
align-items: center; align-items: center;