Skip to content
This repository has been archived by the owner on Oct 8, 2021. It is now read-only.

Commit

Permalink
Theme: Added selectors for pure CSS theme inheritance.
Browse files Browse the repository at this point in the history
  • Loading branch information
@jaspermdegroot
jaspermdegroot committed May 13, 2013
1 parent 9af0e9c commit 2a742ff
Show file tree
Hide file tree
Showing 2 changed files with 47 additions and 32 deletions.
1 change: 1 addition & 0 deletions css/structure/jquery.mobile.core.css
View file
Expand Up @@ -216,6 +216,7 @@ div.ui-mobile-viewport {
font-size: 16px;
margin: .5em 0;
padding: .7em 1em;
border: 1px solid;
display: block;
position: relative;
text-align: center;
Expand Down
78 changes: 46 additions & 32 deletions css/themes/default/jquery.mobile.theme.css
View file
Expand Up @@ -352,46 +352,53 @@ button,
font-weight: bold;
}

.ui-btn-a,
.ui-btn-a:link,
.ui-btn-a:visited {
.ui-body-a .ui-btn,
.ui-body-a .ui-btn:visited,
html .ui-btn.ui-btn-a,
html .ui-btn.ui-btn-a:visited {
background: #2a2a2a /*{a-bup-background-color}*/;
border: 1px solid #1b1b1b /*{a-bup-border}*/;
border-color: #1b1b1b /*{a-bup-border}*/;
color: #fff /*{a-bup-color}*/;
text-shadow: 0 /*{a-bup-shadow-x}*/ 1px /*{a-bup-shadow-y}*/ 0 /*{a-bup-shadow-radius}*/ #000 /*{a-bup-shadow-color}*/;
font-weight: bold;
}
.ui-btn-a:hover {
.ui-body-a .ui-btn:hover,
html .ui-btn.ui-btn-a:hover {
background: #333 /*{a-bhover-background-color}*/;
border: 1px solid #222 /*{a-bhover-border}*/;
border-color: #222 /*{a-bhover-border}*/;
color: #fff /*{a-bhover-color}*/;
text-shadow: 0 /*{a-bhover-shadow-x}*/ 1px /*{a-bhover-shadow-y}*/ 0 /*{a-bhover-shadow-radius}*/ #000 /*{a-bhover-shadow-color}*/;
}
.ui-btn-a:active {
.ui-body-a .ui-btn:active,
html .ui-btn.ui-btn-a:active {
background: #2d2d2d /*{a-bdown-background-color}*/;
border: 1px solid #222 /*{a-bdown-border}*/;
border-color: #222 /*{a-bdown-border}*/;
color: #fff /*{a-bdown-color}*/;
text-shadow: 0 /*{a-bdown-shadow-x}*/ 1px /*{a-bdown-shadow-y}*/ 0 /*{a-bdown-shadow-radius}*/ #000 /*{a-bdown-shadow-color}*/;
}

.ui-btn-a.ui-btn-active {
.ui-body-a .ui-btn.ui-btn-active
html .ui-btn.ui-btn-a.ui-btn-active {
background: #34bae8 /*{a-bactive-background-color}*/;
border: 1px solid #3399cc /*{a-bactive-border}*/;
border-color: #3399cc /*{a-bactive-border}*/;
color: #fff /*{a-bactive-color}*/;
text-shadow: 0 /*{a-bactive-shadow-x}*/ 1px /*{a-bactive-shadow-y}*/ 0 /*{a-bactive-shadow-radius}*/ #3399cc /*{a-bactive-shadow-color}*/;
cursor: pointer;
}

.ui-btn-a:focus,
.ui-btn-a.ui-focus,
.ui-body-a.ui-focus {
.ui-body-a .ui-btn:focus,
.ui-body-a .ui-focus,
html .ui-body-a.ui-focus,
html .ui-btn-a:focus,
html .ui-btn-a.ui-focus {
-webkit-box-shadow: 0 0 12px #34bae8 /*{a-bactive-background-color}*/;
-moz-box-shadow: 0 0 12px #34bae8 /*{a-bactive-background-color}*/;
box-shadow: 0 0 12px #34bae8 /*{a-bactive-background-color}*/;
}

.ui-btn-a.ui-icon-checkbox-on:after,
.ui-btn-a.ui-icon-radio-on:after {
.ui-body-a .ui-icon-checkbox-on:after,
.ui-body-a .ui-icon-radio-on:after,
html .ui-btn-a.ui-icon-checkbox-on:after,
html .ui-btn-a.ui-icon-radio-on:after {
background-color: #34bae8 /*{a-bactive-background-color}*/;
}

Expand Down Expand Up @@ -466,46 +473,53 @@ button,
font-weight: bold;
}

.ui-btn-b,
.ui-btn-b:link,
.ui-btn-b:visited {
.ui-body-b .ui-btn,
.ui-body-b .ui-btn:visited,
html .ui-btn.ui-btn-b,
html .ui-btn.ui-btn-b:visited {
background: #efefef /*{b-bup-background-color}*/;
border: 1px solid #ddd /*{b-bup-border}*/;
border-color: #ddd /*{b-bup-border}*/;
color: #333 /*{b-bup-color}*/;
text-shadow: 0 /*{b-bup-shadow-x}*/ 1px /*{b-bup-shadow-y}*/ 0 /*{b-bup-shadow-radius}*/ #fff /*{b-bup-shadow-color}*/;
font-weight: bold;
}
.ui-btn-b:hover {
.ui-body-b .ui-btn:hover,
html .ui-btn.ui-btn-b:hover {
background: #e9e9e9 /*{b-bhover-background-color}*/;
border: 1px solid #d5d5d5 /*{b-bhover-border}*/;
border-color: #d5d5d5 /*{b-bhover-border}*/;
color: #333 /*{b-bhover-color}*/;
text-shadow: 0 /*{b-bhover-shadow-x}*/ 1px /*{b-bhover-shadow-y}*/ 0 /*{b-bhover-shadow-radius}*/ #fff /*{b-bhover-shadow-color}*/;
}
.ui-btn-b:active {
.ui-body-b .ui-btn:hover,
html .ui-btn.ui-btn-b:hover {
background: #e3e3e3 /*{b-bdown-background-color}*/;
border: 1px solid #d5d5d5 /*{b-bdown-border}*/;
border-color: #d5d5d5 /*{b-bdown-border}*/;
color: #333 /*{b-bdown-color}*/;
text-shadow: 0 /*{b-bdown-shadow-x}*/ 1px /*{b-bdown-shadow-y}*/ 0 /*{b-bdown-shadow-radius}*/ #fff /*{b-bdown-shadow-color}*/;
}

.ui-btn-b.ui-btn-active {
.ui-body-b .ui-btn.ui-btn-active
html .ui-btn.ui-btn-b.ui-btn-active {
background: #ff0066 /*{b-bactive-background-color}*/;
border: 1px solid #cc0066 /*{b-bactive-border}*/;
border-color: #cc0066 /*{b-bactive-border}*/;
color: #fff /*{b-bactive-color}*/;
text-shadow: 0 /*{b-bactive-shadow-x}*/ 1px /*{b-bactive-shadow-y}*/ 0 /*{b-bactive-shadow-radius}*/ #cc0066 /*{b-bactive-shadow-color}*/;
cursor: pointer;
}

.ui-btn-b:focus,
.ui-btn-b.ui-focus,
.ui-body-b.ui-focus {
.ui-body-b .ui-btn:focus,
.ui-body-b .ui-focus,
html .ui-body-b.ui-focus,
html .ui-btn-b:focus,
html .ui-btn-b.ui-focus {
-webkit-box-shadow: 0 0 12px #ff0066 /*{b-bactive-background-color}*/;
-moz-box-shadow: 0 0 12px #ff0066 /*{b-bactive-background-color}*/;
box-shadow: 0 0 12px #ff0066 /*{b-bactive-background-color}*/;
}

.ui-btn-b.ui-icon-checkbox-on:after,
.ui-btn-b.ui-icon-radio-on:after {
.ui-body-b .ui-icon-checkbox-on:after,
.ui-body-b .ui-icon-radio-on:after,
html .ui-btn-b.ui-icon-checkbox-on:after,
html .ui-btn-b.ui-icon-radio-on:after {
background-color: #ff0066 /*{b-bactive-background-color}*/;
}

Expand Down

0 comments on commit 2a742ff

Please sign in to comment.