responsive chosen selects. Hide milestone dropdown for sm displays

Signed-off-by: Dmitriy Zaporozhets <dmitriy.zaporozhets@gmail.com>

responsive chosen selects. Hide milestone dropdown for sm displays
Signed-off-by: Dmitriy Zaporozhets <dmitriy.zaporozhets@gmail.com>
Dmitriy Zaporozhets
1 parent 35287f10
Showing 3 changed files with 28 additions and 8 deletions Show diff stats
app/assets/stylesheets/generic/selects.scss
app/assets/stylesheets/sections/issues.scss
app/views/projects/issues/_issue_context.html.haml
@@ -59,10 +59,36 @@
 select {
   &.chosen {
-    min-width: 200px;
+    min-width: 100px;
   }
   &.chosen-sm {
     min-width: 100px;
   }
 }
+
+@media (min-width: $screen-sm-min) {
+  select {
+    &.chosen {
+      min-width: 150px;
+    }
+  }
+}
+
+/* Medium devices (desktops, 992px and up) */
+@media (min-width: $screen-md-min) {
+  select {
+    &.chosen {
+      min-width: 170px;
+    }
+  }
+}
+
+/* Large devices (large desktops, 1200px and up) */
+@media (min-width: $screen-lg-min) {
+  select {
+    &.chosen {
+      min-width: 200px;
+    }
+  }
+}
@@ -120,11 +120,6 @@ input.check_all_issues {
   }
 }
-.edit-issue.inline-update select {
-  width: 100%;
-  max-width: 200px;
-}
-
 .issue-show-labels .label {
   padding: 6px 10px;
 }
 = form_for [@project, @issue], remote: true, html: {class: 'edit-issue inline-update'} do |f|
-  .pull-right
   Created by #{link_to_member(@project, issue.author)}&nbsp;
   - if issue.assignee
     \ and currently assigned to
@@ -12,7 +11,7 @@
     = link_to_member(@project, @issue.assignee)
-  .pull-right
+  .pull-right.hidden-sm
     - if issue.milestone
       - milestone = issue.milestone
       %cite.cgray Attached to milestone
	@@ -59,10 +59,36 @@		@@ -59,10 +59,36 @@
59		59
60	select {	60	select {
61	&.chosen {	61	&.chosen {
62	- min-width: 200px;	62	+ min-width: 100px;
63	}	63	}
64		64
65	&.chosen-sm {	65	&.chosen-sm {
66	min-width: 100px;	66	min-width: 100px;
67	}	67	}
68	}	68	}
		69	+
		70	+@media (min-width: $screen-sm-min) {
		71	+ select {
		72	+ &.chosen {
		73	+ min-width: 150px;
		74	+ }
		75	+ }
		76	+}
		77	+
		78	+/* Medium devices (desktops, 992px and up) */
		79	+@media (min-width: $screen-md-min) {
		80	+ select {
		81	+ &.chosen {
		82	+ min-width: 170px;
		83	+ }
		84	+ }
		85	+}
		86	+
		87	+/* Large devices (large desktops, 1200px and up) */
		88	+@media (min-width: $screen-lg-min) {
		89	+ select {
		90	+ &.chosen {
		91	+ min-width: 200px;
		92	+ }
		93	+ }
		94	+}