Finished design for event card in dashboard feed

This commit is contained in:
Eraldo Hasanaj
2019-01-24 10:58:22 +01:00
parent f8fe4aa79f
commit 179820de63
8 changed files with 92 additions and 12 deletions

View File

@@ -19,8 +19,9 @@
.card-items {
display: grid;
grid-template-columns: 43% 43%;
grid-gap: 10vh;
grid-template-columns: 45.9% 45.9%;
grid-gap: 9vh;
margin-top: 5px;
}
@media screen and (max-width: 563px) {

View File

@@ -1,3 +1,11 @@
<p>
{{card.cardTitle}}
</p>
<div class="card-container">
<div class="card-title align-left">
<span>{{card.cardTitle}}</span>
</div>
<div class="event-title align-left wrap-text-more">
<span>{{card.event.title}}</span>
</div>
<div class="event-content align-left">
<span>{{card.event.content}}</span>
</div>
</div>

View File

@@ -0,0 +1,31 @@
@import "../../../assets/scss/variables";
.card-container {
display: grid;
grid-template-columns: auto;
background-color: white;
padding: 24px;
margin-right: 15px;
margin-left: 3px;
margin-top: 10px;
border-radius: 4px;
}
.card-title span {
font-size: 15px;
font-weight: bold;
color: $color-active;
}
.event-title {
height: 33px;
font-size: 24px;
font-weight: 700;
margin-top: 5px;
}
.event-content {
font-size: 17px;
line-height: 22px;
font-weight: 400;
}

View File

@@ -1,3 +1,5 @@
<p>
{{card.cardTitle}}
</p>
<div class="card-container">
<div class="card-title align-left">
<span>{{card.cardTitle}}</span>
</div>
</div>

View File

@@ -0,0 +1,18 @@
@import "../../../assets/scss/variables";
.card-container {
display: grid;
grid-template-columns: auto;
background-color: white;
padding: 24px;
margin-right: 15px;
margin-left: 3px;
margin-top: 10px;
border-radius: 4px;
}
.card-title span {
font-size: 15px;
font-weight: bold;
color: $color-active;
}

View File

@@ -1,3 +1,5 @@
<p>
{{card.cardTitle}}
</p>
<div class="card-container">
<div class="card-title align-left">
<span>{{card.cardTitle}}</span>
</div>
</div>

View File

@@ -0,0 +1,18 @@
@import "../../../assets/scss/variables";
.card-container {
display: grid;
grid-template-columns: auto;
background-color: white;
padding: 24px;
margin-right: 15px;
margin-left: 3px;
margin-top: 10px;
border-radius: 4px;
}
.card-title span {
font-size: 15px;
font-weight: bold;
color: $color-active;
}

View File

@@ -1,6 +1,6 @@
/* You can add global styles to this file, and also import other style files */
body {
font-family: 'Open Sans';
font-family: ".SFNSText-Regular", -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif;
margin: 0px;
height: 100vh;
}