#1844 - Fix ui cards > .ui.card to have correct margins, fix consecutive ui cards groups to preserve row spacing

src/definitions/views/card.less

@@ -22,44 +22,6 @@
             Standard
 *******************************/
 
-
-/*--------------
-      Cards
----------------*/
-
-.ui.cards {
-  display: @groupDisplay;
-  margin: @groupCardsMargin;
-  flex-wrap: wrap;
-}
-
-.ui.cards > .card {
-  display: @groupCardDisplay;
-  margin: @groupCardMargin;
-  float: @groupFloat;
-}
-
-.ui.cards:first-child,
-.ui.card:first-child {
-  margin-top: 0em;
-}
-.ui.cards:last-child,
-.ui.card:last-child {
-  margin-bottom: 0em;
-}
-
-/* Clearing */
-.ui.cards:after,
-.ui.card:after {
-  display: block;
-  content: ' ';
-  height: 0px;
-  clear: both;
-  overflow: hidden;
-  visibility: hidden;
-}
-
-
 /*--------------
       Card
 ---------------*/
@@ -91,6 +53,47 @@
   cursor: pointer;
 }
 
+.ui.card:first-child {
+  margin-top: 0em;
+}
+.ui.card:last-child {
+  margin-bottom: 0em;
+}
+
+/*--------------
+      Cards
+---------------*/
+
+.ui.cards {
+  display: @groupDisplay;
+  margin: @groupMargin;
+  flex-wrap: wrap;
+}
+
+.ui.cards > .card {
+  display: @groupCardDisplay;
+  margin: @groupCardMargin;
+  float: @groupCardFloat;
+}
+
+/* Clearing */
+.ui.cards:after,
+.ui.card:after {
+  display: block;
+  content: ' ';
+  height: 0px;
+  clear: both;
+  overflow: hidden;
+  visibility: hidden;
+}
+
+
+/* Consecutive Card Groups Preserve Row Spacing */
+.ui.cards ~ .ui.cards {
+  margin-top: @consecutiveGroupDistance;
+}
+
+
 
 /*--------------
   Rounded Edges

src/themes/default/views/card.variables

@@ -10,7 +10,7 @@
 @shadowDistance: 3px;
 @shadowBoxShadow: 0px @shadowDistance 0px 0px @solidBorderColor;
 
-/* Item */
+/* Card */
 @display: flex;
 @background: #FFFFFF;
 @borderRadius: @defaultBorderRadius;
@@ -28,15 +28,20 @@
 @zIndex: '';
 @transition: box-shadow @transitionDuration @transitionEasing;
 
-/* Item Group */
+/* Card Group */
 @horizontalSpacing: 1em;
-@rowSpacing: 1.5em;
+@rowSpacing: 1.75em;
+
+@groupMargin: -(@rowSpacing / 2) -(@horizontalSpacing / 2);
 @groupDisplay: flex;
+
+@groupCardFloat: none;
 @groupCardDisplay: flex;
-@groupFloat: none;
-@groupCardsMargin: -(@rowSpacing / 2) -(@horizontalSpacing / 2);
 @groupCardMargin: (@rowSpacing / 2) (@horizontalSpacing / 2);
 
+/* Consecutive Cards */
+@consecutiveGroupDistance: (@rowSpacing / 2);
+
 /*-------------------
        Content
 --------------------*/