change cards flex to column

public/assets/css/theme-bthree-dark.css

@@ -338,6 +338,15 @@
   opacity: 0.7;
 }
 
+.ui.cards-column {
+  margin: -0.875em -0.5em;
+  display: flex;
+  flex-wrap: wrap;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+}
+
 /* Users/Organizations list. */
 /* Fix alignment issue since */
 .ui.user.list img.avatar,

templates/components/card_repos.tmpl

@@ -1,5 +1,5 @@
-<div class="ui cards stackable">
+<div class="ui cards-column stackable">
-  <div class="ui card" style="flex: 1;">
+  <div class="ui card" style="width: 100%; margin: 0.5rem;">
     <div class="content">
       <a href="{{AppSubUrl}}/zeldon/mineping">
         <h3>Mineping</h3>
@@ -10,7 +10,7 @@
     </div>
   </div>
 
-  <div class="ui card" style="flex: 1;">
+  <div class="ui card" style="width: 100%; margin: 0.5rem;">
     <div class="content">
       <a href="{{AppSubUrl}}/zeldon/zeldon-site">
         <h3>Website</h3>
@@ -21,7 +21,7 @@
     </div>
   </div>
 
-  <div class="ui card" style="flex: 1;">
+  <div class="ui card" style="width: 100%; margin: 0.5rem;">
     <div class="content">
       <a href="{{AppSubUrl}}/zeldon/http-proxy-server">
         <h3>http-proxy-server</h3>
@@ -36,6 +36,6 @@
 <div class="ui center stackable">
   <button class="ui button primary">
     <a class="item" rel="nofollow" style="text-decoration: none;color: inherit;"
-      href="{{AppSubUrl}}/explore/repos">Explore!</a>
+      href="{{AppSubUrl}}/explore/repos">Explore other!</a>
   </button>
 </div>