|
|
@@ -11,97 +11,96 @@ of the styles inside media queries.
|
|
|
******************************************************************/
|
|
|
|
|
|
|
|
|
-/*********************
|
|
|
-IMPORTING STYLES
|
|
|
-*********************/
|
|
|
+//
|
|
|
+// IMPORTING STYLES
|
|
|
+//
|
|
|
|
|
|
-/* import normalize */
|
|
|
+// import normalize
|
|
|
@import "normalize.less";
|
|
|
-/* import mixins */
|
|
|
+// import mixins
|
|
|
@import "mixins.less";
|
|
|
|
|
|
-/******************************************************************
|
|
|
+/*
|
|
|
BASE (MOBILE) SIZE
|
|
|
This is the average viewing window. So Desktops, Laptops, and
|
|
|
in general anyone not viewing on a mobile device. Here's where
|
|
|
you can add resource intensive styles.
|
|
|
-******************************************************************/
|
|
|
+*/
|
|
|
|
|
|
-/* styles in base.less */
|
|
|
+// styles in base.less
|
|
|
@import "base.less";
|
|
|
|
|
|
-/******************************************************************
|
|
|
+/*
|
|
|
LARGER MOBILE DEVICES
|
|
|
This is for devices like the Galaxy Note or something that's
|
|
|
larger than an iPhone but smaller than a tablet. Let's call them
|
|
|
tweeners.
|
|
|
-******************************************************************/
|
|
|
+*/
|
|
|
@media only screen and (min-width: 481px) {
|
|
|
|
|
|
- /* styles in 481up.less */
|
|
|
+ // styles in 481up.less
|
|
|
@import "481up.less";
|
|
|
|
|
|
-} /* end of media query */
|
|
|
+} // end of media query
|
|
|
|
|
|
-/******************************************************************
|
|
|
+/*
|
|
|
TABLET & SMALLER LAPTOPS
|
|
|
This is the average viewing window. So Desktops, Laptops, and
|
|
|
in general anyone not viewing on a mobile device. Here's where
|
|
|
you can add resource intensive styles.
|
|
|
-******************************************************************/
|
|
|
+*/
|
|
|
@media only screen and (min-width: 768px) {
|
|
|
|
|
|
- /* styles in 768up.less */
|
|
|
+ // styles in 768up.less
|
|
|
@import "768up.less";
|
|
|
|
|
|
-} /* end of media query */
|
|
|
+} // end of media query
|
|
|
|
|
|
-/******************************************************************
|
|
|
+/*
|
|
|
DESKTOP
|
|
|
This is the average viewing window. So Desktops, Laptops, and
|
|
|
in general anyone not viewing on a mobile device. Here's where
|
|
|
you can add resource intensive styles.
|
|
|
-******************************************************************/
|
|
|
+*/
|
|
|
@media only screen and (min-width: 1030px) {
|
|
|
|
|
|
- /* styles in 1030up.less */
|
|
|
+ // styles in 1030up.less
|
|
|
@import "1030up.less";
|
|
|
|
|
|
-} /* end of media query */
|
|
|
+} // end of media query
|
|
|
|
|
|
-/******************************************************************
|
|
|
+/*
|
|
|
LARGE VIEWING SIZE
|
|
|
This is for the larger monitors and possibly full screen viewers.
|
|
|
-******************************************************************/
|
|
|
+*/
|
|
|
@media only screen and (min-width: 1240px) {
|
|
|
|
|
|
- /* styles in 1240up.less */
|
|
|
+ // styles in 1240up.less
|
|
|
@import "1240up.less";
|
|
|
|
|
|
-} /* end of media query */
|
|
|
+} // end of media query
|
|
|
|
|
|
-/******************************************************************
|
|
|
+/*
|
|
|
RETINA (2x RESOLUTION DEVICES)
|
|
|
This applies to the retina iPhone (4s) and iPad (2,3) along with
|
|
|
other displays with a 2x resolution. You can also create a media
|
|
|
query for retina AND a certain size if you want. Go Nuts.
|
|
|
-******************************************************************/
|
|
|
-
|
|
|
+*/
|
|
|
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
|
|
|
only screen and (min--moz-device-pixel-ratio: 1.5),
|
|
|
only screen and (min-device-pixel-ratio: 1.5) {
|
|
|
|
|
|
- /* styles in 2x.less */
|
|
|
+ // styles in 2x.less
|
|
|
@import "2x.less";
|
|
|
|
|
|
-} /* end of media query */
|
|
|
+} // end of media query
|
|
|
|
|
|
-/******************************************************************
|
|
|
+/*
|
|
|
PRINT STYLESHEET
|
|
|
Feel free to customize this. Remember to add things that won't make
|
|
|
sense to print at the bottom. Things like nav, ads, and forms should
|
|
|
be set to display none.
|
|
|
-******************************************************************/
|
|
|
+*/
|
|
|
@media print {
|
|
|
* {
|
|
|
background: transparent !important;
|
|
|
@@ -115,12 +114,12 @@ be set to display none.
|
|
|
color: #444 !important;
|
|
|
text-decoration: underline;
|
|
|
|
|
|
- /* show links on printed pages */
|
|
|
+ // show links on printed pages
|
|
|
&:after {
|
|
|
content: " (" attr(href) ")";
|
|
|
}
|
|
|
|
|
|
- /* show title too */
|
|
|
+ // show title too
|
|
|
abbr[title]:after {
|
|
|
content: " (" attr(title) ")";
|
|
|
}
|
|
|
@@ -163,7 +162,7 @@ be set to display none.
|
|
|
page-break-after: avoid;
|
|
|
}
|
|
|
|
|
|
- /* hide content people who print don't need to see */
|
|
|
+ // hide content people who print don't need to see
|
|
|
.sidebar,
|
|
|
.page-navigation,
|
|
|
.wp-prev-next,
|
eddiemachado