Merge pull request #306 from indirectlylit/style-tweaks

style updates
learningequality · Jul 28, 2016 · f7813e1 · f7813e1
2 parents fe3d217 + 7f5c55d
commit f7813e1
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 8 deletions.
diff --git a/kolibri/plugins/learn/assets/src/vue/index.vue b/kolibri/plugins/learn/assets/src/vue/index.vue
@@ -108,6 +108,8 @@
     top: 1rem
     right: 2rem
     z-index: 1
+    @media screen and (max-width: $portrait-breakpoint)
+      right: 1rem
 
   .search-pane
     background-color: $core-bg-canvas

diff --git a/kolibri/plugins/learn/assets/src/vue/learn.styl b/kolibri/plugins/learn/assets/src/vue/learn.styl
@@ -8,12 +8,12 @@ $card-width = 280px         // fixed card width
 $card-gutter = 20px         // spacing between columns
 $n-cols-array = 1 2 3 4 5     // possible numbers of columns
 
-$left-margin = 80px
-$right-margin = 55px
+$left-margin = 100px
+$right-margin = 25px
 
 // compute the target grid width based on the number of columns
 grid-width($n-cols)
-  ($card-width * $n-cols) + ($card-gutter * $n-cols)
+  ($card-width * $n-cols) + ($card-gutter * ($n-cols + 1))
 
 $portrait-breakpoint = $left-margin * 2 + grid-width(1) + $right-margin
 

diff --git a/kolibri/plugins/learn/assets/src/vue/side-nav/index.vue b/kolibri/plugins/learn/assets/src/vue/side-nav/index.vue
@@ -71,10 +71,6 @@
   @require '~core-theme.styl'
   @require '../learn'
 
-  $font-size = 1em
-  $nav-size = $left-margin - $card-gutter * 0.5
-  $portrait-scale = 0.8
-
   .nav-wrapper
     display: table
     background: $core-bg-light
@@ -85,7 +81,7 @@
       font-size: 1em
       height: 100%
     @media screen and (max-width: $portrait-breakpoint)
-      font-size: $font-size * $portrait-scale
+      font-size: 0.8em
       bottom: 0
       width: 100%