mirror of
https://dev.azure.com/hugendubel/ISA/_git/ISA-Frontend
synced 2025-12-31 09:37:15 +01:00
Finished design for event card in dashboard feed
This commit is contained in:
@@ -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) {
|
||||
|
||||
@@ -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>
|
||||
@@ -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;
|
||||
}
|
||||
@@ -1,3 +1,5 @@
|
||||
<p>
|
||||
{{card.cardTitle}}
|
||||
</p>
|
||||
<div class="card-container">
|
||||
<div class="card-title align-left">
|
||||
<span>{{card.cardTitle}}</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -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;
|
||||
}
|
||||
@@ -1,3 +1,5 @@
|
||||
<p>
|
||||
{{card.cardTitle}}
|
||||
</p>
|
||||
<div class="card-container">
|
||||
<div class="card-title align-left">
|
||||
<span>{{card.cardTitle}}</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -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;
|
||||
}
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user