|
|
@@ -1,13 +1,13 @@
|
|
|
/******************************************************************
|
|
|
-Site Name:
|
|
|
-Author:
|
|
|
+Site Name:
|
|
|
+Author:
|
|
|
|
|
|
Stylesheet: 481px and Up Stylesheet
|
|
|
|
|
|
-This stylesheet is loaded for larger devices. It's set to
|
|
|
+This stylesheet is loaded for larger devices. It's set to
|
|
|
481px because at 480px it would load on a landscaped iPhone.
|
|
|
This isn't ideal because then you would be loading all those
|
|
|
-extra styles on that same mobile connection.
|
|
|
+extra styles on that same mobile connection.
|
|
|
|
|
|
A word of warning. This size COULD be a larger mobile device,
|
|
|
so you still want to keep it pretty light and simply expand
|
|
|
@@ -15,8 +15,14 @@ upon your base.scss styles.
|
|
|
|
|
|
******************************************************************/
|
|
|
|
|
|
+/*
|
|
|
+IMPORTANT NOTE ABOUT SASS 3.3 & UP
|
|
|
+You can't use @extend within media queries
|
|
|
+anymore, so just be aware that if you drop
|
|
|
+them in here, they won't work.
|
|
|
+*/
|
|
|
+
|
|
|
|
|
|
-
|
|
|
/*********************
|
|
|
NAVIGATION STYLES
|
|
|
*********************/
|
|
|
@@ -28,19 +34,19 @@ NAVIGATION STYLES
|
|
|
ul {
|
|
|
li {
|
|
|
a {
|
|
|
-
|
|
|
+
|
|
|
/*
|
|
|
you can use hover styles here even though this size
|
|
|
has the possibility of being a mobile device.
|
|
|
*/
|
|
|
&:hover, &:focus {
|
|
|
-
|
|
|
+
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
&:first-child {}
|
|
|
&:last-child {}
|
|
|
-
|
|
|
+
|
|
|
/*
|
|
|
plan your menus and drop-downs wisely.
|
|
|
*/
|
|
|
@@ -57,9 +63,9 @@ NAVIGATION STYLES
|
|
|
}
|
|
|
}
|
|
|
} /* end .menu ul li */
|
|
|
-
|
|
|
+
|
|
|
/* highlight current page */
|
|
|
- li.current-menu-item,
|
|
|
+ li.current-menu-item,
|
|
|
li.current_page_item,
|
|
|
li.current-page-ancestor {
|
|
|
a {}
|
|
|
@@ -73,32 +79,32 @@ POSTS & CONTENT STYLES
|
|
|
|
|
|
/* entry content */
|
|
|
.entry-content {
|
|
|
-
|
|
|
-
|
|
|
+
|
|
|
+
|
|
|
/* at this larger size, we can start to align images */
|
|
|
- .alignleft, img.alignleft {
|
|
|
- margin-right: 1.5em;
|
|
|
- display: inline;
|
|
|
- float: left;
|
|
|
+ .alignleft, img.alignleft {
|
|
|
+ margin-right: 1.5em;
|
|
|
+ display: inline;
|
|
|
+ float: left;
|
|
|
}
|
|
|
- .alignright, img.alignright {
|
|
|
- margin-left: 1.5em;
|
|
|
- display: inline;
|
|
|
- float: right;
|
|
|
+ .alignright, img.alignright {
|
|
|
+ margin-left: 1.5em;
|
|
|
+ display: inline;
|
|
|
+ float: right;
|
|
|
}
|
|
|
- .aligncenter, img.aligncenter {
|
|
|
- margin-right: auto;
|
|
|
- margin-left: auto;
|
|
|
- display: block;
|
|
|
- clear: both;
|
|
|
+ .aligncenter, img.aligncenter {
|
|
|
+ margin-right: auto;
|
|
|
+ margin-left: auto;
|
|
|
+ display: block;
|
|
|
+ clear: both;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
} /* end .entry-content */
|
|
|
|
|
|
/*********************
|
|
|
FOOTER STYLES
|
|
|
*********************/
|
|
|
-
|
|
|
+
|
|
|
/*
|
|
|
check your menus here. do they look good?
|
|
|
do they need tweaking?
|
|
|
@@ -108,4 +114,4 @@ do they need tweaking?
|
|
|
li {}
|
|
|
}
|
|
|
} /* end .footer-links */
|
|
|
-
|
|
|
+
|