feat(responsive): add media queries for scaling the widget on HD resolutions

androide-osorio · androide-osorio · commit 013ce401b4c8 · 2016-07-29T13:27:37.000-05:00
diff --git a/src/sass/components/weather-icons/main.scss b/src/sass/components/weather-icons/main.scss
@@ -106,8 +106,8 @@ $weather-icon-2h: $weather-icon-2w;
 		&.big {
 			background-size: 1930% 100%;
 
-			width: $weather-icon-2w !important;
-	    height: $weather-icon-2h !important;
+			//width: $weather-icon-2w !important;
+	    //height: $weather-icon-2h !important;
 		}
 	}
 
diff --git a/src/sass/global/elements.scss b/src/sass/global/elements.scss
@@ -1,6 +1,15 @@
 
 html {
   font-size: 14px;
+  $breakpoint-md: map-get($breakpoints, md);
+
+  @media all and (min-width: $breakpoint-md) and (max-width: 1099px) {
+    font-size: 20px;
+  }
+
+  @media all and (min-width: 1100px) {
+    font-size: 24px;
+  }
 }
 
 body {

Original file line number	Diff line number	Diff line change
`@@ -106,8 +106,8 @@ $weather-icon-2h: $weather-icon-2w;`
`106`	`106`	`&.big {`
`107`	`107`	`background-size: 1930% 100%;`
`108`	`108`
`109`		`- width: $weather-icon-2w !important;`
`110`		`- height: $weather-icon-2h !important;`
	`109`	`+ //width: $weather-icon-2w !important;`
	`110`	`+ //height: $weather-icon-2h !important;`
`111`	`111`	`}`
`112`	`112`	`}`
`113`	`113`