let user resize sidebar

kylesferrazza · kylesferrazza · commit 6e77f9b1e871 · 2020-05-12T16:07:42.000-04:00
diff --git a/app/javascript/components/navbar/ExamNavbar.css b/app/javascript/components/navbar/ExamNavbar.css
@@ -11,19 +11,24 @@
 }
 
 .transition {
-  transition: 0.35s width ease-in-out;
+  transition: 0.35s max-width ease-in-out, 0.35s min-width ease-in-out;
 }
 
 .sidebar-small {
   width: calc(6em + 2px);
+  min-width: calc(6em + 2px);
+  max-width: calc(6em + 2px);
 }
 
 .sidebar-expanded {
-  width: 500px;
+  min-width: 500px;
+  max-width: 100%;
+  resize: horizontal;
+  overflow: auto;
 }
 
 .width-0 {
-  width: 0;
+  max-width: 0;
 }
 
 .collapse:not(.width):not(.show) {

Original file line number	Diff line number	Diff line change
`@@ -11,19 +11,24 @@`
`11`	`11`	`}`
`12`	`12`
`13`	`13`	`.transition {`
`14`		`- transition: 0.35s width ease-in-out;`
	`14`	`+ transition: 0.35s max-width ease-in-out, 0.35s min-width ease-in-out;`
`15`	`15`	`}`
`16`	`16`
`17`	`17`	`.sidebar-small {`
`18`	`18`	`width: calc(6em + 2px);`
	`19`	`+ min-width: calc(6em + 2px);`
	`20`	`+ max-width: calc(6em + 2px);`
`19`	`21`	`}`
`20`	`22`
`21`	`23`	`.sidebar-expanded {`
`22`		`- width: 500px;`
	`24`	`+ min-width: 500px;`
	`25`	`+ max-width: 100%;`
	`26`	`+ resize: horizontal;`
	`27`	`+ overflow: auto;`
`23`	`28`	`}`
`24`	`29`
`25`	`30`	`.width-0 {`
`26`		`- width: 0;`
	`31`	`+ max-width: 0;`
`27`	`32`	`}`
`28`	`33`
`29`	`34`	`.collapse:not(.width):not(.show) {`