Skip to content

Instantly share code, notes, and snippets.

@DevinWalker
Created May 13, 2014 18:28
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save DevinWalker/c53d14d9cc36cdf2ab22 to your computer and use it in GitHub Desktop.
Save DevinWalker/c53d14d9cc36cdf2ab22 to your computer and use it in GitHub Desktop.
Nice set of base styles for WordPress Blank themes and Roots theme
/*-----------------------------------------
Typography
--------------------------------------------*/
img.alignleft, img.alignright, img.alignnone {
border-radius: 0;
border: none;
}
.content img.alignleft, .content img.alignright, .content img.alignnone {
background: #FFF;
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.15);
border: none;
padding: 5px;
}
.alignleft {
float: left;
margin: 0 25px 10px 0;
}
.alignright {
float: right;
margin: 0 0 30px 30px;
}
.alignnone {
float: none;
display: block;
text-align: center;
margin: 0 auto 30px;
}
.thumbnail .caption {
text-align: center;
font-size: 11px;
}
.content .main {
margin: 40px 0px 50px;
}
.sidebar {
margin: 50px 0 50px;
max-width: 290px;
}
.main ul, .content .main ol {
margin: 0 0 2em;
padding-left: 20px;
}
.content .main ul li, .content .main ol li {
line-height: 1.6;
margin-bottom: 0.8em;
}
.content > .main blockquote, .content > .main blockquote p {
font-size: 16px;
font-style: italic;
line-height: 1.5;
}
p.attribute {
text-align: right;
font-weight: bold;
color: #0077c0;
margin: 0 0 30px;
}
.wp-caption img {
max-width: 100%;
}
.content .main > p:first-of-type {
font-size: 1.5em;
font-weight: bold;
border-bottom: 1px solid #e5e5e5;
line-height: 1.5em;
padding: 0 0 20px;
margin: 0 0 20px;
}
/* Search Results */
article.hentry {
margin: 0 0 30px;
padding: 0 0 30px;
border-bottom: 1px solid #F1F1F1;
}
.entry-summary p {
margin: 0;
}
/* ------------------------------
* Sidebar
---------------------------------*/
.sidebar .directions-widget .map-wrap {
float: none;
width: 100%;
}
.sidebar .directions-widget .acf-map {
width: 100%;
}
.sidebar .directions-widget address {
display: block;
}
.sidebar .gform_wrapper { padding: 0 15px; }
.sidebar .ginput_right, .sidebar .ginput_left {
width: 100%;
float: none;
margin: 0 0 10px;
display: block;
}
.sidebar .gform_footer {
text-align: center;
}
.widget-title {
padding-left: 20px;
font-size: 26px;
margin: 0 0 25px;
border-top: 1px solid #c0c0c0;
border-bottom: 1px solid #c0c0c0;
text-align: center;
padding: 10px 0;
color: #0077c0;
}
.sidebar ul {
padding: 0;
margin: 0;
}
.sidebar .widget {
margin: 0 0 50px;
padding: 0;
}
.sidebar, .sidebar p {
font-size: 12px;
line-height: 22px;
}
/* Subpages Widget */
.subpages-widget {
box-shadow: 0 5px 8px rgba(0, 0, 0, 0.21);
}
.subpages-widget ul li {
list-style-type: none;
margin: 0;
padding: 0;
}
.subpages-widget ul li:first-child a {
border-top: none;
}
.subpages-widget ul li a {
font-size: 18px;
color: #6a747c;
display: block;
box-shadow: inset 0 1px 1px #FFF;
border-top: 1px solid rgba(0, 0, 0, 0.15);
padding: 15px 15px 15px 55px;
position: relative;
}
.subpages-widget ul li a > span {
border-right:1px solid rgba(0, 0, 0, 0.15);
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 40px;
box-shadow: inset -1px 0px 1px #FFF;
}
.subpages-widget ul li a > span:before {
content: "";
border-color: rgba(0, 0, 0, 0) #b3b7bb;
border-style: solid;
border-width: 0.25em 0 0.25em 0.35em;
display: block;
height: 0;
width: 0;
left: 17px;
top: 22px;
position: relative;
}
.subpages-widget ul li a:hover {
text-decoration: none;
color: #3f484f;
background: rgba(0, 0, 0, 0.04);
}
.subpages-widget ul li.current_page_item a {
color:#2289c8;
}
.subpages-widget ul li.current_page_item a span:before {
border-color: rgba(0, 0, 0, 0) #2289c8;
}
/* ------------------------------
* Standard WordPress Widget Styles
---------------------------------*/
/* Categories and Archive Widgets */
.sidebar .widget.widget_categories ul ul, .sidebar .widget.widget_pages ul ul, .sidebar .widget.widget_nav_menu ul ul {
margin: 0 !important;
padding: 0 0 0 20px;
}
.sidebar .widget.widget_categories li, .sidebar .widget.widget_pages li, .sidebar .widget.widget_nav_menu li, .sidebar .widget.widget_archive li {
padding: 8px 0;
display: block;
border-bottom: 1px solid #E6E6E6;
}
.sidebar .widget.widget_categories li li, .sidebar .widget.widget_pages li li, .sidebar .widget.widget_nav_menu li li, .sidebar .widget.widget_archive li li {
border-bottom: 0;
}
.sidebar .widget.widget_categories > ul > li:first-child > a, .sidebar .widget.widget_pages > ul > li:first-child > a, .sidebar .widget.widget_nav_menu > ul > li:first-child > a, .sidebar .widget.widget_archive > ul > li:first-child > a {
padding-top: 0px;
}
.sidebar label {
text-transform: uppercase;
font-size: 12px;
}
.sidebar .gform_heading {
margin: 0 0 20px;
}
/* Calendar Widget */
.widget_calendar {
}
#wp-calendar {
width: 100%;
}
#wp-calendar caption {
text-align: center;
font-size: 12px;
margin-top: 10px;
margin-bottom: 15px;
text-transform: uppercase;
font-weight: bold;
}
#wp-calendar thead {
font-size: 10px;
}
#wp-calendar thead th {
padding-bottom: 10px;
}
#wp-calendar tbody {
color: #aaa;
}
#wp-calendar tbody td {
background: #ECECEC;
border: 1px solid #E0E0E0;
text-align: center;
padding: 8px;
}
#wp-calendar tbody td:hover {
background: #fff;
}
#wp-calendar tbody .pad {
background: none;
}
#wp-calendar tfoot #next {
font-size: 10px;
text-transform: uppercase;
text-align: right;
}
#wp-calendar tfoot #prev {
font-size: 10px;
text-transform: uppercase;
padding-top: 10px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment