User Profile
This commit is contained in:
@@ -2,4 +2,5 @@
|
||||
@import 'placeTeaser/placeTeaser';
|
||||
@import 'tagList/tagList';
|
||||
@import 'navigation/navigation';
|
||||
@import 'messageList/messageList';
|
||||
@import 'messageList/messageList';
|
||||
@import 'userInfo/userInfo';
|
36
components/02_Molecules/userInfo/_userInfo.scss
Normal file
36
components/02_Molecules/userInfo/_userInfo.scss
Normal file
@@ -0,0 +1,36 @@
|
||||
.LP-UserInfo {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-color: $-beige;
|
||||
|
||||
max-width: 400px;
|
||||
width: 100%;
|
||||
min-width: 300px;
|
||||
|
||||
&__UserName {
|
||||
background-color: $-light-brown;
|
||||
|
||||
.LP-Headline {
|
||||
color: black;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
padding: $-spacing-small / 2;
|
||||
font-size: 25px;
|
||||
}
|
||||
}
|
||||
|
||||
&__Meta {
|
||||
* {
|
||||
font-family: $-primary-sans-serif-font;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
padding: $-spacing-small / 2;
|
||||
|
||||
.LP-UserInfo__Key {
|
||||
padding-right: $-spacing-medium;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
1
components/02_Molecules/userInfo/userInfo.config.json
Normal file
1
components/02_Molecules/userInfo/userInfo.config.json
Normal file
@@ -0,0 +1 @@
|
||||
{}
|
44
components/02_Molecules/userInfo/userInfo.hbs
Normal file
44
components/02_Molecules/userInfo/userInfo.hbs
Normal file
@@ -0,0 +1,44 @@
|
||||
<div class="LP-UserInfo">
|
||||
<div class="LP-UserInfo__UserName">
|
||||
{{> @headline headline='reverend'}}
|
||||
</div>
|
||||
<div class="LP-UserInfo__Picture">
|
||||
{{> @image source='/images/profile_picture.jpeg'}}
|
||||
</div>
|
||||
<div class="LP-UserInfo__Meta">
|
||||
<table>
|
||||
<tr>
|
||||
<td class="LP-UserInfo__Key">
|
||||
<span class="LP-Paragraph"> Joined</span>
|
||||
</td>
|
||||
<td class="LP-UserInfo__Value">
|
||||
<span class="LP-Paragraph">27th of September 2020</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="LP-UserInfo__Key">
|
||||
<span class="LP-Paragraph">Places</span>
|
||||
</td>
|
||||
<td class="LP-UserInfo__Value">
|
||||
<span class="LP-Paragraph">42</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="LP-UserInfo__Key">
|
||||
<span class="LP-Paragraph">Place Assets</span>
|
||||
</td>
|
||||
<td class="LP-UserInfo__Value">
|
||||
<span class="LP-Paragraph">136</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="LP-UserInfo__Key">
|
||||
<span class="LP-Paragraph">Location</span>
|
||||
</td>
|
||||
<td class="LP-UserInfo__Value">
|
||||
<span class="LP-Paragraph">Münster</span>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
Reference in New Issue
Block a user