fix grid row overflow

jpstroop · May 20, 2020 · c4feed2 · c4feed2
1 parent 4ab0327
commit c4feed2
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 4 deletions.
diff --git a/src/App.vue b/src/App.vue
@@ -1,7 +1,7 @@
 <template>
   <div id="app">
     <h1>Storage Finder</h1>
-    <div class="small-container">
+    <div class="container-fluid">
       <div class="row">
         <feature-categories :categories="categories" :features="features" />
         <option-list :options="options" />

diff --git a/src/components/OptionList.vue b/src/components/OptionList.vue
@@ -1,5 +1,5 @@
 <template>
-  <ul id="option-list" class="col-sm-7">
+  <ul id="option-list" class="col-sm-8">
     <b-collapse v-for="option in options"
       tag="li" :visible="true"
       :key="option.id" :id="option.id"
@@ -75,11 +75,12 @@ h2 {
 .option {
   /* This plus option-wrapper below keeps jQuery animations smooth */
   padding: 0;
-  border-bottom: 1px solid rgba(0,0,0,.125);
 }
 
 .option-wrapper {
-  padding: 1rem .5rem;
+  padding: 1rem 0;
+  margin: 0 1rem;
+  border-bottom: 1px solid rgba(0,0,0,.125);
 }
 
 .option-features {