socialnetworknews-web

commit 89d6a9287cd8a74ff56dc2b5024565ec2a242b34
parent d3e238e3a943ad940333dd8afa099cf30c9be550
Author: MTRNord <mtrnord1@gmail.com>
Date:   Sun, 25 Mar 2018 17:15:07 +0200

Prevent style from getting overwritten

Diffstat:
M
src/app/tweet-list/tweet-list.component.html
 | 
2
+-
M
src/app/tweet-list/tweet-list.component.scss
 | 
15
+++------------

2 files changed, 4 insertions(+), 13 deletions(-)
diff --git a/src/app/tweet-list/tweet-list.component.html b/src/app/tweet-list/tweet-list.component.html
@@ -1,5 +1,5 @@
 <spinner spinner="spinner"></spinner>
-<div fxLayout fxLayout.xs="column" fxLayoutGap="10px" fxLayoutGap.xs="0" fxLayoutAlign="start" *ngFor="let row of data" style="margin-bottom: 10px;">
+<div fxLayout fxLayout.xs="column" fxLayoutGap="10px" fxLayoutGap.xs="0" fxLayoutAlign="start" *ngFor="let row of data" class="gridHack">
   <mat-card *ngFor="let item of row">
     <div class="ribbon ribbon-top-left" *ngIf="item.retweet" style="max-width: 22rem">
       <span>
diff --git a/src/app/tweet-list/tweet-list.component.scss b/src/app/tweet-list/tweet-list.component.scss
@@ -1,15 +1,6 @@
-.grid {
-  display: grid;
-  grid-template-columns: auto;
-  grid-gap: 20px;
-  //align-items: end;
-  @media (min-width: 30em) {
-    grid-template-columns: 1fr 1fr;
-  }
-
-  @media (min-width: 60em) {
-    grid-template-columns: repeat(4, 1fr);
-  }
+.gridHack {
+  align-items: flex-start !important;
+  margin-bottom: 10px;
 }
 
 /* Made by https://codepen.io/gschier/pen/HCoqh */