rayelliott
/
_s
Archived
forked from mirror/_s
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

New lines and spacing.

This commit is contained in:
Tiago Noronha 2017-08-30 12:14:55 +01:00
parent 5f5eaa4bbf
commit 649b59d063
5 changed files with 909 additions and 613 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

416
style.css
View File

@ -47,10 +47,12 @@ Nicolas Gallagher and Jonathan Neal http://necolas.github.io/normalize.css/
html { html {
font-family: sans-serif; font-family: sans-serif;
-webkit-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%; } -ms-text-size-adjust: 100%;
}
body { body {
margin: 0; } margin: 0;
}
article, article,
aside, aside,
@ -64,86 +66,107 @@ menu,
nav, nav,
section, section,
summary { summary {
display: block; } display: block;
}
audio, audio,
canvas, canvas,
progress, progress,
video { video {
display: inline-block; display: inline-block;
vertical-align: baseline; } vertical-align: baseline;
}
audio:not([controls]) { audio:not([controls]) {
display: none; display: none;
height: 0; } height: 0;
}
[hidden], [hidden],
template { template {
display: none; } display: none;
}
a { a {
background-color: transparent; } background-color: transparent;
}
a:active, a:active,
a:hover { a:hover {
outline: 0; } outline: 0;
}
abbr[title] { abbr[title] {
border-bottom: 1px dotted; } border-bottom: 1px dotted;
}
b, b,
strong { strong {
font-weight: bold; } font-weight: bold;
}
dfn { dfn {
font-style: italic; } font-style: italic;
}
h1 { h1 {
font-size: 2em; font-size: 2em;
margin: 0.67em 0; } margin: 0.67em 0;
}
mark { mark {
background: #ff0; background: #ff0;
color: #000; } color: #000;
}
small { small {
font-size: 80%; } font-size: 80%;
}
sub, sub,
sup { sup {
font-size: 75%; font-size: 75%;
line-height: 0; line-height: 0;
position: relative; position: relative;
vertical-align: baseline; } vertical-align: baseline;
}
sup { sup {
top: -0.5em; } top: -0.5em;
}
sub { sub {
bottom: -0.25em; } bottom: -0.25em;
}
img { img {
border: 0; } border: 0;
}
svg:not(:root) { svg:not(:root) {
overflow: hidden; } overflow: hidden;
}
figure { figure {
margin: 1em 40px; } margin: 1em 40px;
}
hr { hr {
box-sizing: content-box; box-sizing: content-box;
height: 0; } height: 0;
}
pre { pre {
overflow: auto; } overflow: auto;
}
code, code,
kbd, kbd,
pre, pre,
samp { samp {
font-family: monospace, monospace; font-family: monospace, monospace;
font-size: 1em; } font-size: 1em;
}
button, button,
input, input,
@ -152,69 +175,85 @@ select,
textarea { textarea {
color: inherit; color: inherit;
font: inherit; font: inherit;
margin: 0; } margin: 0;
}
button { button {
overflow: visible; } overflow: visible;
}
button, button,
select { select {
text-transform: none; } text-transform: none;
}
button, button,
html input[type="button"], html input[type="button"],
input[type="reset"], input[type="reset"],
input[type="submit"] { input[type="submit"] {
-webkit-appearance: button; -webkit-appearance: button;
cursor: pointer; } cursor: pointer;
}
button[disabled], button[disabled],
html input[disabled] { html input[disabled] {
cursor: default; } cursor: default;
}
button::-moz-focus-inner, button::-moz-focus-inner,
input::-moz-focus-inner { input::-moz-focus-inner {
border: 0; border: 0;
padding: 0; } padding: 0;
}
input { input {
line-height: normal; } line-height: normal;
}
input[type="checkbox"], input[type="checkbox"],
input[type="radio"] { input[type="radio"] {
box-sizing: border-box; box-sizing: border-box;
padding: 0; } padding: 0;
}
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button { input[type="number"]::-webkit-outer-spin-button {
height: auto; } height: auto;
}
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration { input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none; } -webkit-appearance: none;
}
fieldset { fieldset {
border: 1px solid #c0c0c0; border: 1px solid #c0c0c0;
margin: 0 2px; margin: 0 2px;
padding: 0.35em 0.625em 0.75em; } padding: 0.35em 0.625em 0.75em;
}
legend { legend {
border: 0; border: 0;
padding: 0; } padding: 0;
}
textarea { textarea {
overflow: auto; } overflow: auto;
}
optgroup { optgroup {
font-weight: bold; } font-weight: bold;
}
table { table {
border-collapse: collapse; border-collapse: collapse;
border-spacing: 0; } border-spacing: 0;
}
td, td,
th { th {
padding: 0; } padding: 0;
}
/*-------------------------------------------------------------- /*--------------------------------------------------------------
# Typography # Typography
@ -229,22 +268,28 @@ textarea {
font-family: sans-serif; font-family: sans-serif;
font-size: 16px; font-size: 16px;
font-size: 1rem; font-size: 1rem;
line-height: 1.5; } line-height: 1.5;
}
h1, h2, h3, h4, h5, h6 { h1, h2, h3, h4, h5, h6 {
clear: both; } clear: both;
}
p { p {
margin-bottom: 1.5em; } margin-bottom: 1.5em;
}
dfn, cite, em, i { dfn, cite, em, i {
font-style: italic; } font-style: italic;
}
blockquote { blockquote {
margin: 0 1.5em; } margin: 0 1.5em;
}
address { address {
margin: 0 0 1.5em; } margin: 0 0 1.5em;
}
pre { pre {
background: #eee; background: #eee;
@ -255,84 +300,105 @@ pre {
margin-bottom: 1.6em; margin-bottom: 1.6em;
max-width: 100%; max-width: 100%;
overflow: auto; overflow: auto;
padding: 1.6em; } padding: 1.6em;
}
code, kbd, tt, var { code, kbd, tt, var {
font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
font-size: 15px; font-size: 15px;
font-size: 0.9375rem; } font-size: 0.9375rem;
}
abbr, acronym { abbr, acronym {
border-bottom: 1px dotted #666; border-bottom: 1px dotted #666;
cursor: help; } cursor: help;
}
mark, ins { mark, ins {
background: #fff9c0; background: #fff9c0;
text-decoration: none; } text-decoration: none;
}
big { big {
font-size: 125%; } font-size: 125%;
}
/*-------------------------------------------------------------- /*--------------------------------------------------------------
# Elements # Elements
--------------------------------------------------------------*/ --------------------------------------------------------------*/
html { html {
box-sizing: border-box; } box-sizing: border-box;
}
*, *,
*:before, *:before,
*:after { *:after {
/* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */ /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
box-sizing: inherit; } box-sizing: inherit;
}
body { body {
background: #fff; background: #fff;
/* Fallback for when there is no custom background color defined. */ } /* Fallback for when there is no custom background color defined. */
}
blockquote, q { blockquote, q {
quotes: "" ""; } quotes: "" "";
}
blockquote:before, blockquote:after, q:before, q:after { blockquote:before, blockquote:after, q:before, q:after {
content: ""; } content: "";
}
hr { hr {
background-color: #ccc; background-color: #ccc;
border: 0; border: 0;
height: 1px; height: 1px;
margin-bottom: 1.5em; } margin-bottom: 1.5em;
}
ul, ol { ul, ol {
margin: 0 0 1.5em 3em; } margin: 0 0 1.5em 3em;
}
ul { ul {
list-style: disc; } list-style: disc;
}
ol { ol {
list-style: decimal; } list-style: decimal;
}
li > ul, li > ul,
li > ol { li > ol {
margin-bottom: 0; margin-bottom: 0;
margin-left: 1.5em; } margin-left: 1.5em;
}
dt { dt {
font-weight: bold; } font-weight: bold;
}
dd { dd {
margin: 0 1.5em 1.5em; } margin: 0 1.5em 1.5em;
}
img { img {
height: auto; height: auto;
/* Make sure images are scaled correctly. */ /* Make sure images are scaled correctly. */
max-width: 100%; max-width: 100%;
/* Adhere to container width. */ } /* Adhere to container width. */
}
figure { figure {
margin: 1em 0; margin: 1em 0;
/* Extra wide images within figure tags don't overflow the content area. */ } /* Extra wide images within figure tags don't overflow the content area. */
}
table { table {
margin: 0 0 1.5em; margin: 0 0 1.5em;
width: 100%; } width: 100%;
}
/*-------------------------------------------------------------- /*--------------------------------------------------------------
# Forms # Forms
@ -349,12 +415,16 @@ input[type="submit"] {
font-size: 12px; font-size: 12px;
font-size: 0.75rem; font-size: 0.75rem;
line-height: 1; line-height: 1;
padding: .6em 1em .4em; } padding: .6em 1em .4em;
}
button:hover, button:hover,
input[type="button"]:hover, input[type="button"]:hover,
input[type="reset"]:hover, input[type="reset"]:hover,
input[type="submit"]:hover { input[type="submit"]:hover {
border-color: #ccc #bbb #aaa; } border-color: #ccc #bbb #aaa;
}
button:active, button:focus, button:active, button:focus,
input[type="button"]:active, input[type="button"]:active,
input[type="button"]:focus, input[type="button"]:focus,
@ -362,7 +432,8 @@ input[type="submit"] {
input[type="reset"]:focus, input[type="reset"]:focus,
input[type="submit"]:active, input[type="submit"]:active,
input[type="submit"]:focus { input[type="submit"]:focus {
border-color: #aaa #bbb #bbb; } border-color: #aaa #bbb #bbb;
}
input[type="text"], input[type="text"],
input[type="email"], input[type="email"],
@ -383,7 +454,9 @@ textarea {
color: #666; color: #666;
border: 1px solid #ccc; border: 1px solid #ccc;
border-radius: 3px; border-radius: 3px;
padding: 3px; } padding: 3px;
}
input[type="text"]:focus, input[type="text"]:focus,
input[type="email"]:focus, input[type="email"]:focus,
input[type="url"]:focus, input[type="url"]:focus,
@ -400,13 +473,16 @@ textarea {
input[type="datetime-local"]:focus, input[type="datetime-local"]:focus,
input[type="color"]:focus, input[type="color"]:focus,
textarea:focus { textarea:focus {
color: #111; } color: #111;
}
select { select {
border: 1px solid #ccc; } border: 1px solid #ccc;
}
textarea { textarea {
width: 100%; } width: 100%;
}
/*-------------------------------------------------------------- /*--------------------------------------------------------------
# Navigation # Navigation
@ -415,15 +491,24 @@ textarea {
## Links ## Links
--------------------------------------------------------------*/ --------------------------------------------------------------*/
a { a {
color: royalblue; } color: royalblue;
}
a:visited { a:visited {
color: purple; } color: purple;
}
a:hover, a:focus, a:active { a:hover, a:focus, a:active {
color: midnightblue; } color: midnightblue;
}
a:focus { a:focus {
outline: thin dotted; } outline: thin dotted;
}
a:hover, a:active { a:hover, a:active {
outline: 0; } outline: 0;
}
/*-------------------------------------------------------------- /*--------------------------------------------------------------
## Menus ## Menus
@ -432,66 +517,90 @@ a {
clear: both; clear: both;
display: block; display: block;
float: left; float: left;
width: 100%; } width: 100%;
}
.main-navigation ul { .main-navigation ul {
display: none; display: none;
list-style: none; list-style: none;
margin: 0; margin: 0;
padding-left: 0; } padding-left: 0;
}
.main-navigation ul ul { .main-navigation ul ul {
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2); box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
float: left; float: left;
position: absolute; position: absolute;
top: 100%; top: 100%;
left: -999em; left: -999em;
z-index: 99999; } z-index: 99999;
}
.main-navigation ul ul ul { .main-navigation ul ul ul {
left: -999em; left: -999em;
top: 0; } top: 0;
}
.main-navigation ul ul li:hover > ul, .main-navigation ul ul li:hover > ul,
.main-navigation ul ul li.focus > ul { .main-navigation ul ul li.focus > ul {
left: 100%; } left: 100%;
}
.main-navigation ul ul a { .main-navigation ul ul a {
width: 200px; } width: 200px;
}
.main-navigation ul li:hover > ul, .main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul { .main-navigation ul li.focus > ul {
left: auto; } left: auto;
}
.main-navigation li { .main-navigation li {
float: left; float: left;
position: relative; } position: relative;
}
.main-navigation a { .main-navigation a {
display: block; display: block;
text-decoration: none; } text-decoration: none;
}
/* Small menu. */ /* Small menu. */
.menu-toggle, .menu-toggle,
.main-navigation.toggled ul { .main-navigation.toggled ul {
display: block; } display: block;
}
@media screen and (min-width: 37.5em) { @media screen and (min-width: 37.5em) {
.menu-toggle { .menu-toggle {
display: none; } display: none;
}
.main-navigation ul { .main-navigation ul {
display: block; } } display: block;
}
}
.site-main .comment-navigation, .site-main .site-main .comment-navigation, .site-main
.posts-navigation, .site-main .posts-navigation, .site-main
.post-navigation { .post-navigation {
margin: 0 0 1.5em; margin: 0 0 1.5em;
overflow: hidden; } overflow: hidden;
}
.comment-navigation .nav-previous, .comment-navigation .nav-previous,
.posts-navigation .nav-previous, .posts-navigation .nav-previous,
.post-navigation .nav-previous { .post-navigation .nav-previous {
float: left; float: left;
width: 50%; } width: 50%;
}
.comment-navigation .nav-next, .comment-navigation .nav-next,
.posts-navigation .nav-next, .posts-navigation .nav-next,
.post-navigation .nav-next { .post-navigation .nav-next {
float: right; float: right;
text-align: right; text-align: right;
width: 50%; } width: 50%;
}
/*-------------------------------------------------------------- /*--------------------------------------------------------------
# Accessibility # Accessibility
@ -504,7 +613,9 @@ a {
width: 1px; width: 1px;
overflow: hidden; overflow: hidden;
word-wrap: normal !important; word-wrap: normal !important;
/* Many screen reader and browser combinations announce broken words as they would appear visually. */ } /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}
.screen-reader-text:focus { .screen-reader-text:focus {
background-color: #f1f1f1; background-color: #f1f1f1;
border-radius: 3px; border-radius: 3px;
@ -523,11 +634,13 @@ a {
top: 5px; top: 5px;
width: auto; width: auto;
z-index: 100000; z-index: 100000;
/* Above WP toolbar. */ } /* Above WP toolbar. */
}
/* Do not show the outline on the skip link target. */ /* Do not show the outline on the skip link target. */
#content[tabindex="-1"]:focus { #content[tabindex="-1"]:focus {
outline: 0; } outline: 0;
}
/*-------------------------------------------------------------- /*--------------------------------------------------------------
# Alignments # Alignments
@ -535,18 +648,21 @@ a {
.alignleft { .alignleft {
display: inline; display: inline;
float: left; float: left;
margin-right: 1.5em; } margin-right: 1.5em;
}
.alignright { .alignright {
display: inline; display: inline;
float: right; float: right;
margin-left: 1.5em; } margin-left: 1.5em;
}
.aligncenter { .aligncenter {
clear: both; clear: both;
display: block; display: block;
margin-left: auto; margin-left: auto;
margin-right: auto; } margin-right: auto;
}
/*-------------------------------------------------------------- /*--------------------------------------------------------------
# Clearings # Clearings
@ -565,7 +681,8 @@ a {
.site-footer:after { .site-footer:after {
content: ""; content: "";
display: table; display: table;
table-layout: fixed; } table-layout: fixed;
}
.clear:after, .clear:after,
.entry-content:after, .entry-content:after,
@ -573,16 +690,20 @@ a {
.site-header:after, .site-header:after,
.site-content:after, .site-content:after,
.site-footer:after { .site-footer:after {
clear: both; } clear: both;
}
/*-------------------------------------------------------------- /*--------------------------------------------------------------
# Widgets # Widgets
--------------------------------------------------------------*/ --------------------------------------------------------------*/
.widget { .widget {
margin: 0 0 1.5em; margin: 0 0 1.5em;
/* Make sure select elements fit in widgets. */ } /* Make sure select elements fit in widgets. */
}
.widget select { .widget select {
max-width: 100%; } max-width: 100%;
}
/*-------------------------------------------------------------- /*--------------------------------------------------------------
# Content # Content
@ -591,31 +712,38 @@ a {
## Posts and pages ## Posts and pages
--------------------------------------------------------------*/ --------------------------------------------------------------*/
.sticky { .sticky {
display: block; } display: block;
}
.hentry { .hentry {
margin: 0 0 1.5em; } margin: 0 0 1.5em;
}
.updated:not(.published) { .updated:not(.published) {
display: none; } display: none;
}
.page-content, .page-content,
.entry-content, .entry-content,
.entry-summary { .entry-summary {
margin: 1.5em 0 0; } margin: 1.5em 0 0;
}
.page-links { .page-links {
clear: both; clear: both;
margin: 0 0 1.5em; } margin: 0 0 1.5em;
}
/*-------------------------------------------------------------- /*--------------------------------------------------------------
## Comments ## Comments
--------------------------------------------------------------*/ --------------------------------------------------------------*/
.comment-content a { .comment-content a {
word-wrap: break-word; } word-wrap: break-word;
}
.bypostauthor { .bypostauthor {
display: block; } display: block;
}
/*-------------------------------------------------------------- /*--------------------------------------------------------------
# Infinite scroll # Infinite scroll
@ -624,11 +752,13 @@ a {
.infinite-scroll .posts-navigation, .infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer { .infinite-scroll.neverending .site-footer {
/* Theme Footer (when set to scrolling) */ /* Theme Footer (when set to scrolling) */
display: none; } display: none;
}
/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */ /* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */
.infinity-end.neverending .site-footer { .infinity-end.neverending .site-footer {
display: block; } display: block;
}
/*-------------------------------------------------------------- /*--------------------------------------------------------------
# Media # Media
@ -639,61 +769,89 @@ a {
border: none; border: none;
margin-bottom: 0; margin-bottom: 0;
margin-top: 0; margin-top: 0;
padding: 0; } padding: 0;
}
/* Make sure embeds and iframes fit their containers. */ /* Make sure embeds and iframes fit their containers. */
embed, embed,
iframe, iframe,
object { object {
max-width: 100%; } max-width: 100%;
}
/* Make sure logo link wraps around logo image. */ /* Make sure logo link wraps around logo image. */
.custom-logo-link { .custom-logo-link {
display: inline-block; } display: inline-block;
}
/*-------------------------------------------------------------- /*--------------------------------------------------------------
## Captions ## Captions
--------------------------------------------------------------*/ --------------------------------------------------------------*/
.wp-caption { .wp-caption {
margin-bottom: 1.5em; margin-bottom: 1.5em;
max-width: 100%; } max-width: 100%;
}
.wp-caption img[class*="wp-image-"] { .wp-caption img[class*="wp-image-"] {
display: block; display: block;
margin-left: auto; margin-left: auto;
margin-right: auto; } margin-right: auto;
}
.wp-caption .wp-caption-text { .wp-caption .wp-caption-text {
margin: 0.8075em 0; } margin: 0.8075em 0;
}
.wp-caption-text { .wp-caption-text {
text-align: center; } text-align: center;
}
/*-------------------------------------------------------------- /*--------------------------------------------------------------
## Galleries ## Galleries
--------------------------------------------------------------*/ --------------------------------------------------------------*/
.gallery { .gallery {
margin-bottom: 1.5em; } margin-bottom: 1.5em;
}
.gallery-item { .gallery-item {
display: inline-block; display: inline-block;
text-align: center; text-align: center;
vertical-align: top; vertical-align: top;
width: 100%; } width: 100%;
}
.gallery-columns-2 .gallery-item { .gallery-columns-2 .gallery-item {
max-width: 50%; } max-width: 50%;
}
.gallery-columns-3 .gallery-item { .gallery-columns-3 .gallery-item {
max-width: 33.33%; } max-width: 33.33%;
}
.gallery-columns-4 .gallery-item { .gallery-columns-4 .gallery-item {
max-width: 25%; } max-width: 25%;
}
.gallery-columns-5 .gallery-item { .gallery-columns-5 .gallery-item {
max-width: 20%; } max-width: 20%;
}
.gallery-columns-6 .gallery-item { .gallery-columns-6 .gallery-item {
max-width: 16.66%; } max-width: 16.66%;
}
.gallery-columns-7 .gallery-item { .gallery-columns-7 .gallery-item {
max-width: 14.28%; } max-width: 14.28%;
}
.gallery-columns-8 .gallery-item { .gallery-columns-8 .gallery-item {
max-width: 12.5%; } max-width: 12.5%;
}
.gallery-columns-9 .gallery-item { .gallery-columns-9 .gallery-item {
max-width: 11.11%; } max-width: 11.11%;
}
.gallery-caption { .gallery-caption {
display: block; } display: block;
}

364
woocommerce.css
View File

@ -3,25 +3,12 @@ Theme Name: _s
WooCommerce styles override WooCommerce styles override
*/ */
/**
* WooCommerce Plugin path variables
*/
/** /**
* WooCommerce color variables * WooCommerce color variables
*/ */
/** /**
* Imports * Imports
*/ */
/**
* Fonts
*/
@font-face {
font-family: 'star';
src: url("../../plugins/woocommerce/assets/fonts/star.eot");
src: url("../../plugins/woocommerce/assets/fonts/star.eot?#iefix") format("embedded-opentype"), url("../../plugins/woocommerce/assets/fonts/star.woff") format("woff"), url("../../plugins/woocommerce/assets/fonts/star.ttf") format("truetype"), url("../../plugins/woocommerce/assets/fonts/star.svg#star") format("svg");
font-weight: normal;
font-style: normal; }
/** /**
* Shop tables * Shop tables
*/ */
@ -29,39 +16,58 @@ WooCommerce styles override
* Shop tables * Shop tables
*/ */
table.shop_table_responsive thead { table.shop_table_responsive thead {
display: none; } display: none;
}
table.shop_table_responsive tbody th { table.shop_table_responsive tbody th {
display: none; } display: none;
}
table.shop_table_responsive tr td { table.shop_table_responsive tr td {
display: block; display: block;
text-align: right; text-align: right;
clear: both; } clear: both;
}
table.shop_table_responsive tr td:before { table.shop_table_responsive tr td:before {
content: attr(data-title) ": "; content: attr(data-title) ": ";
float: left; } float: left;
}
table.shop_table_responsive tr td.product-remove a { table.shop_table_responsive tr td.product-remove a {
text-align: left; } text-align: left;
}
table.shop_table_responsive tr td.product-remove:before { table.shop_table_responsive tr td.product-remove:before {
display: none; } display: none;
}
table.shop_table_responsive tr td.actions:before, table.shop_table_responsive tr td.download-actions:before { table.shop_table_responsive tr td.actions:before, table.shop_table_responsive tr td.download-actions:before {
display: none; } display: none;
}
table.shop_table_responsive tr td.download-actions .button { table.shop_table_responsive tr td.download-actions .button {
display: block; display: block;
text-align: center; } text-align: center;
}
@media screen and (min-width: 48em) { @media screen and (min-width: 48em) {
table.shop_table_responsive thead { table.shop_table_responsive thead {
display: table-header-group; } display: table-header-group;
}
table.shop_table_responsive tbody th { table.shop_table_responsive tbody th {
display: table-cell; } display: table-cell;
}
table.shop_table_responsive tr th, table.shop_table_responsive tr td { table.shop_table_responsive tr th, table.shop_table_responsive tr td {
text-align: left; } text-align: left;
}
table.shop_table_responsive tr td { table.shop_table_responsive tr td {
display: table-cell; } display: table-cell;
}
table.shop_table_responsive tr td:before { table.shop_table_responsive tr td:before {
display: none; } } display: none;
}
}
/** /**
* Products * Products
@ -74,40 +80,59 @@ ul.products {
display: table; display: table;
table-layout: fixed; table-layout: fixed;
margin: 0; margin: 0;
padding: 0; } padding: 0;
}
ul.products li.product { ul.products li.product {
list-style: none; list-style: none;
position: relative; position: relative;
margin-bottom: 2em; } margin-bottom: 2em;
}
ul.products li.product .woocommerce-loop-product__title { ul.products li.product .woocommerce-loop-product__title {
font-size: 1rem; } font-size: 1rem;
}
ul.products li.product img { ul.products li.product img {
display: block; } display: block;
}
ul.products li.product .button { ul.products li.product .button {
display: block; } display: block;
}
@media screen and (min-width: 48em) { @media screen and (min-width: 48em) {
ul.products li.product { ul.products li.product {
width: 30.7966666667%; width: 30.7966666667%;
float: left; float: left;
margin-right: 3.8%; } margin-right: 3.8%;
}
ul.products li.product.first { ul.products li.product.first {
clear: both; } clear: both;
}
ul.products li.product.last { ul.products li.product.last {
margin-right: 0; } margin-right: 0;
}
.columns-1 ul.products li.product { .columns-1 ul.products li.product {
float: none; float: none;
width: 100%; } width: 100%;
}
.columns-2 ul.products li.product { .columns-2 ul.products li.product {
width: 48.1%; } width: 48.1%;
}
.columns-3 ul.products li.product { .columns-3 ul.products li.product {
width: 30.7966666667%; } width: 30.7966666667%;
}
.columns-4 ul.products li.product { .columns-4 ul.products li.product {
width: 22.15%; } width: 22.15%;
}
.columns-5 ul.products li.product { .columns-5 ul.products li.product {
width: 16.96%; } width: 16.96%;
}
.columns-6 ul.products li.product { .columns-6 ul.products li.product {
width: 13.4933333333%; } } width: 13.4933333333%;
}
}
/** /**
* Single product * Single product
@ -119,66 +144,110 @@ ul.products {
content: ""; content: "";
display: table; display: table;
table-layout: fixed; table-layout: fixed;
position: relative; } position: relative;
}
.single-product div.product .woocommerce-product-gallery { .single-product div.product .woocommerce-product-gallery {
position: relative; } position: relative;
}
.single-product div.product .woocommerce-product-gallery .woocommerce-product-gallery__trigger { .single-product div.product .woocommerce-product-gallery .woocommerce-product-gallery__trigger {
position: absolute; position: absolute;
top: 1em; top: 1em;
right: 1em; right: 1em;
display: block; display: block;
z-index: 99; } z-index: 99;
}
.single-product div.product .woocommerce-product-gallery .flex-viewport { .single-product div.product .woocommerce-product-gallery .flex-viewport {
margin-bottom: 1em; } margin-bottom: 1em;
}
.single-product div.product .woocommerce-product-gallery .flex-control-thumbs { .single-product div.product .woocommerce-product-gallery .flex-control-thumbs {
content: ""; content: "";
display: table; display: table;
table-layout: fixed; table-layout: fixed;
margin: 0; margin: 0;
padding: 0; } padding: 0;
}
.single-product div.product .woocommerce-product-gallery .flex-control-thumbs li { .single-product div.product .woocommerce-product-gallery .flex-control-thumbs li {
list-style: none; list-style: none;
cursor: pointer; cursor: pointer;
float: left; } float: left;
}
.single-product div.product .woocommerce-product-gallery .flex-control-thumbs li img { .single-product div.product .woocommerce-product-gallery .flex-control-thumbs li img {
opacity: .5; } opacity: .5;
}
.single-product div.product .woocommerce-product-gallery .flex-control-thumbs li img.flex-active { .single-product div.product .woocommerce-product-gallery .flex-control-thumbs li img.flex-active {
opacity: 1; } opacity: 1;
}
.single-product div.product .woocommerce-product-gallery .flex-control-thumbs li:hover img { .single-product div.product .woocommerce-product-gallery .flex-control-thumbs li:hover img {
opacity: 1; } opacity: 1;
}
.single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-2 .flex-control-thumbs li { .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-2 .flex-control-thumbs li {
width: 48.1%; } width: 48.1%;
}
.single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-2 .flex-control-thumbs li:nth-child(2n) { .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-2 .flex-control-thumbs li:nth-child(2n) {
margin-right: 0; } margin-right: 0;
}
.single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-2 .flex-control-thumbs li:nth-child(2n+1) { .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-2 .flex-control-thumbs li:nth-child(2n+1) {
clear: both; } clear: both;
}
.single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-3 .flex-control-thumbs li { .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-3 .flex-control-thumbs li {
width: 30.7966666667%; } width: 30.7966666667%;
}
.single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-3 .flex-control-thumbs li:nth-child(3n) { .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-3 .flex-control-thumbs li:nth-child(3n) {
margin-right: 0; } margin-right: 0;
}
.single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-3 .flex-control-thumbs li:nth-child(3n+1) { .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-3 .flex-control-thumbs li:nth-child(3n+1) {
clear: both; } clear: both;
}
.single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-4 .flex-control-thumbs li { .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-4 .flex-control-thumbs li {
width: 22.15%; } width: 22.15%;
}
.single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-4 .flex-control-thumbs li:nth-child(4n) { .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-4 .flex-control-thumbs li:nth-child(4n) {
margin-right: 0; } margin-right: 0;
}
.single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-4 .flex-control-thumbs li:nth-child(4n+1) { .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-4 .flex-control-thumbs li:nth-child(4n+1) {
clear: both; } clear: both;
}
.single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-5 .flex-control-thumbs li { .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-5 .flex-control-thumbs li {
width: 16.96%; } width: 16.96%;
}
.single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-5 .flex-control-thumbs li:nth-child(5n) { .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-5 .flex-control-thumbs li:nth-child(5n) {
margin-right: 0; } margin-right: 0;
}
.single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-5 .flex-control-thumbs li:nth-child(5n+1) { .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-5 .flex-control-thumbs li:nth-child(5n+1) {
clear: both; } clear: both;
}
.stock:empty:before { .stock:empty:before {
display: none; } display: none;
}
.stock.in-stock { .stock.in-stock {
color: #0f834d; } color: #0f834d;
}
.stock.out-of-stock { .stock.out-of-stock {
color: #e2401c; } color: #e2401c;
}
/** /**
* Checkout * Checkout
@ -189,13 +258,17 @@ ul.products {
@media screen and (min-width: 768px) { @media screen and (min-width: 768px) {
.col2-set .form-row-first { .col2-set .form-row-first {
float: left; float: left;
margin-right: 3.8%; } margin-right: 3.8%;
}
.col2-set .form-row-last { .col2-set .form-row-last {
float: right; float: right;
margin-right: 0; } margin-right: 0;
}
.col2-set .form-row-first, .col2-set .form-row-first,
.col2-set .form-row-last { .col2-set .form-row-last {
width: 48.1%; } } width: 48.1%;
}
}
/** /**
* General WooCommerce components * General WooCommerce components
@ -209,16 +282,25 @@ ul.products {
padding: 0; padding: 0;
content: ""; content: "";
display: table; display: table;
table-layout: fixed; } table-layout: fixed;
}
.site-header-cart .cart-contents { .site-header-cart .cart-contents {
text-decoration: none; } text-decoration: none;
}
.site-header-cart .cart-contents .icon { .site-header-cart .cart-contents .icon {
display: none; } display: none;
}
.site-header-cart .widget_shopping_cart { .site-header-cart .widget_shopping_cart {
display: none; } display: none;
}
.site-header-cart .product_list_widget { .site-header-cart .product_list_widget {
margin: 0; margin: 0;
padding: 0; } padding: 0;
}
/** /**
* Star rating * Star rating
@ -231,27 +313,34 @@ ul.products {
font-size: 1em; font-size: 1em;
width: 5.3em; width: 5.3em;
font-family: 'star'; font-family: 'star';
font-weight: 400; } font-weight: 400;
}
.star-rating:before { .star-rating:before {
content: "\53\53\53\53\53"; content: "\53\53\53\53\53";
opacity: .25; opacity: .25;
float: left; float: left;
top: 0; top: 0;
left: 0; left: 0;
position: absolute; } position: absolute;
}
.star-rating span { .star-rating span {
overflow: hidden; overflow: hidden;
float: left; float: left;
top: 0; top: 0;
left: 0; left: 0;
position: absolute; position: absolute;
padding-top: 1.5em; } padding-top: 1.5em;
}
.star-rating span:before { .star-rating span:before {
content: "\53\53\53\53\53"; content: "\53\53\53\53\53";
top: 0; top: 0;
position: absolute; position: absolute;
left: 0; left: 0;
color: royalblue; } color: royalblue;
}
p.stars a { p.stars a {
position: relative; position: relative;
@ -261,7 +350,9 @@ p.stars a {
display: inline-block; display: inline-block;
text-decoration: none; text-decoration: none;
margin-right: 1px; margin-right: 1px;
font-weight: 400; } font-weight: 400;
}
p.stars a:before { p.stars a:before {
display: block; display: block;
position: absolute; position: absolute;
@ -274,31 +365,38 @@ p.stars a {
content: "\53"; content: "\53";
color: #404040; color: #404040;
text-indent: 0; text-indent: 0;
opacity: .25; } opacity: .25;
}
p.stars a:hover ~ a:before { p.stars a:hover ~ a:before {
content: "\53"; content: "\53";
color: #404040; color: #404040;
opacity: .25; } opacity: .25;
}
p.stars:hover a:before { p.stars:hover a:before {
content: "\53"; content: "\53";
color: royalblue; color: royalblue;
opacity: 1; } opacity: 1;
}
p.stars.selected a.active:before { p.stars.selected a.active:before {
content: "\53"; content: "\53";
color: royalblue; color: royalblue;
opacity: 1; } opacity: 1;
}
p.stars.selected a.active ~ a:before { p.stars.selected a.active ~ a:before {
content: "\53"; content: "\53";
color: #404040; color: #404040;
opacity: .25; } opacity: .25;
}
p.stars.selected a:not(.active):before { p.stars.selected a:not(.active):before {
content: "\53"; content: "\53";
color: royalblue; color: royalblue;
opacity: 1; } opacity: 1;
}
/** /**
* Tabs * Tabs
@ -307,43 +405,61 @@ p.stars.selected a:not(.active):before {
list-style: none; list-style: none;
margin: 0; margin: 0;
padding: 0; padding: 0;
text-align: left; } text-align: left;
}
.woocommerce-tabs ul.tabs li { .woocommerce-tabs ul.tabs li {
display: block; display: block;
margin: 0; margin: 0;
position: relative; } position: relative;
}
.woocommerce-tabs ul.tabs li a { .woocommerce-tabs ul.tabs li a {
padding: 1em 0; padding: 1em 0;
display: block; } display: block;
}
.woocommerce-tabs .panel h2:first-of-type { .woocommerce-tabs .panel h2:first-of-type {
margin-bottom: 1em; } margin-bottom: 1em;
}
/** /**
* Password strength meter * Password strength meter
*/ */
.woocommerce-password-strength { .woocommerce-password-strength {
text-align: right; } text-align: right;
}
.woocommerce-password-strength.strong { .woocommerce-password-strength.strong {
color: #0f834d; } color: #0f834d;
}
.woocommerce-password-strength.short { .woocommerce-password-strength.short {
color: #e2401c; } color: #e2401c;
}
.woocommerce-password-strength.bad { .woocommerce-password-strength.bad {
color: #e2401c; } color: #e2401c;
}
.woocommerce-password-strength.good { .woocommerce-password-strength.good {
color: #3D9CD2; } color: #3D9CD2;
}
/** /**
* Forms * Forms
*/ */
.form-row.woocommerce-validated input.input-text { .form-row.woocommerce-validated input.input-text {
box-shadow: inset 2px 0 0 #0f834d; } box-shadow: inset 2px 0 0 #0f834d;
}
.form-row.woocommerce-invalid input.input-text { .form-row.woocommerce-invalid input.input-text {
box-shadow: inset 2px 0 0 #e2401c; } box-shadow: inset 2px 0 0 #e2401c;
}
.required { .required {
color: red; } color: red;
}
/** /**
* Notices * Notices
@ -357,15 +473,18 @@ p.no-comments {
display: table; display: table;
table-layout: fixed; table-layout: fixed;
background-color: #0f834d; background-color: #0f834d;
clear: both; } clear: both;
}
.woocommerce-info, .woocommerce-info,
.woocommerce-noreviews, .woocommerce-noreviews,
p.no-comments { p.no-comments {
background-color: #3D9CD2; } background-color: #3D9CD2;
}
.woocommerce-error { .woocommerce-error {
background-color: #e2401c; } background-color: #e2401c;
}
.demo_store { .demo_store {
position: fixed; position: fixed;
@ -375,7 +494,8 @@ p.no-comments {
margin: 0; margin: 0;
padding: 1em; padding: 1em;
background-color: #3D9CD2; background-color: #3D9CD2;
z-index: 9999; } z-index: 9999;
}
@media screen and (min-width: 48em) { @media screen and (min-width: 48em) {
/** /**
@ -389,12 +509,16 @@ p.no-comments {
font-size: ms(-1); font-size: ms(-1);
left: -999em; left: -999em;
display: block; display: block;
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2); } box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
}
.site-header-cart .cart-contents .icon { .site-header-cart .cart-contents .icon {
display: inline; } display: inline;
}
.site-header-cart:hover .widget_shopping_cart, .site-header-cart.focus .widget_shopping_cart { .site-header-cart:hover .widget_shopping_cart, .site-header-cart.focus .widget_shopping_cart {
left: 0; left: 0;
display: block; } } display: block;
}
}
/** /**
* WooCommerce widgets * WooCommerce widgets
@ -403,17 +527,22 @@ p.no-comments {
* WooCommerce Price Filter * WooCommerce Price Filter
*/ */
.widget_price_filter .price_slider { .widget_price_filter .price_slider {
margin-bottom: 1.5em; } margin-bottom: 1.5em;
}
.widget_price_filter .price_slider_amount { .widget_price_filter .price_slider_amount {
text-align: right; text-align: right;
line-height: 2.4em; } line-height: 2.4em;
}
.widget_price_filter .price_slider_amount .button { .widget_price_filter .price_slider_amount .button {
float: left; } float: left;
}
.widget_price_filter .ui-slider { .widget_price_filter .ui-slider {
position: relative; position: relative;
text-align: left; } text-align: left;
}
.widget_price_filter .ui-slider .ui-slider-handle { .widget_price_filter .ui-slider .ui-slider-handle {
position: absolute; position: absolute;
@ -425,24 +554,33 @@ p.no-comments {
background: royalblue; background: royalblue;
box-sizing: border-box; box-sizing: border-box;
margin-top: -.25em; margin-top: -.25em;
opacity: 1; } opacity: 1;
}
.widget_price_filter .ui-slider .ui-slider-handle:last-child { .widget_price_filter .ui-slider .ui-slider-handle:last-child {
margin-left: -1em; } margin-left: -1em;
}
.widget_price_filter .ui-slider .ui-slider-handle:hover, .widget_price_filter .ui-slider .ui-slider-handle.ui-state-active { .widget_price_filter .ui-slider .ui-slider-handle:hover, .widget_price_filter .ui-slider .ui-slider-handle.ui-state-active {
box-shadow: 0 0 0 0.25em rgba(0, 0, 0, 0.1); } box-shadow: 0 0 0 0.25em rgba(0, 0, 0, 0.1);
}
.widget_price_filter .ui-slider .ui-slider-range { .widget_price_filter .ui-slider .ui-slider-range {
position: absolute; position: absolute;
z-index: 1; z-index: 1;
display: block; display: block;
border: 0; border: 0;
background: royalblue; } background: royalblue;
}
.widget_price_filter .price_slider_wrapper .ui-widget-content { .widget_price_filter .price_slider_wrapper .ui-widget-content {
background: rgba(0, 0, 0, 0.1); } background: rgba(0, 0, 0, 0.1);
}
.widget_price_filter .ui-slider-horizontal { .widget_price_filter .ui-slider-horizontal {
height: .5em; } height: .5em;
}
.widget_price_filter .ui-slider-horizontal .ui-slider-range { .widget_price_filter .ui-slider-horizontal .ui-slider-range {
height: 100%; } height: 100%;
}