Merge pull request #168 from dcarral/responsify_views

Responsify views & allow Neat's visual-grid to be used
eurucamp · Aug 20, 2015 · 6d19b39 · 6d19b39
2 parents c6482e7 + 5a4d13f
commit 6d19b39
Show file tree

Hide file tree

Showing 5 changed files with 16 additions and 16 deletions.
diff --git a/app/assets/stylesheets/_settings.sass b/app/assets/stylesheets/_settings.sass
@@ -2,6 +2,9 @@
 
 // DEV
 $visual-grid:          false
+$visual-grid-opacity:  0.2
+$visual-grid-index:    front
+$visual-grid-color:    blue
 
 // grid set-up
 $column:               225px

diff --git a/app/assets/stylesheets/application.css.scss b/app/assets/stylesheets/application.css.scss
@@ -1,6 +1,6 @@
 @import "normalize";
-@import "settings";
 @import "bourbon";
+@import "settings";
 @import "neat";
 @import "utils";
 @import "base";

diff --git a/app/assets/stylesheets/partials/_user.sass b/app/assets/stylesheets/partials/_user.sass
@@ -32,8 +32,10 @@ body.user
     font-size: 1.5em
 
   section.form
-    width: 640px
-    padding: 70px
+    +span-columns(6)
+    padding: 10px
+    +media($smartphone-landscape)
+      padding: 70px
     margin: 0 auto
     background: $white
     box-shadow: 0 0 7px transparentize($black, 0.9)

diff --git a/app/assets/stylesheets/partials/activities/_form.sass b/app/assets/stylesheets/partials/activities/_form.sass
@@ -54,15 +54,19 @@ form#new-activity
   label
     &.location
       display: inline-block
-      width: 80%
+      +span-columns(6)
+      +media($tablet-lite)
+        +span-columns(3)
 
     &.limit-of-participants
       display: inline-block
       text-align: right
-      width: 20%
+      +span-columns(6)
 
-      input
-        width: 85%
+      +media($tablet-lite)
+        +span-columns(1)
+        input
+          width: 85%
 
     &.image-url
       .preview

diff --git a/app/assets/stylesheets/partials/activities/_index.sass b/app/assets/stylesheets/partials/activities/_index.sass
@@ -216,15 +216,6 @@ a#new-activity
         +transition(all 0.15s ease-out 0.15s)
 
 
-  +media($smartphone-portrait)
-    li
-      +span-columns(2)
-
-
   +media($tablet-lite)
     li
       +span-columns(2)
-
-  +media($tablet-portrait-plus)
-    li
-      +span-columns(2)