SPR-910: var rename - background (site, page, header, footer) button (bg, color), link (existing) + box-shadow as fix var

This commit is contained in:
Silke Pisulla 2017-03-23 15:38:44 +01:00
commit 202ac8de1e
18 changed files with 74 additions and 70 deletions

View file

@ -21,7 +21,7 @@
height: @page-header_height; height: @page-header_height;
box-sizing: border-box; box-sizing: border-box;
width: 100%; width: 100%;
background-color: @background_page-header; background-color: @ini_background_page-header;
border-bottom: 1px solid @ini_border_light; border-bottom: 1px solid @ini_border_light;
} }

View file

@ -11,7 +11,7 @@
@media screen { @media screen {
.page-footer { .page-footer {
min-height: @page-header_height; min-height: @page-header_height;
background-color: @background_page-header; background-color: @ini_background_page-header;
border-top: 1px solid @ini_border_light; border-top: 1px solid @ini_border_light;
border-radius: 0 0 @fix_border-radius @fix_border-radius; // @ini_default_border_radius vs. @fix_border-radius border-radius: 0 0 @fix_border-radius @fix_border-radius; // @ini_default_border_radius vs. @fix_border-radius
font-size: @font-size-default; font-size: @font-size-default;
@ -28,7 +28,7 @@
position: relative; position: relative;
z-index: 2; z-index: 2;
box-sizing: border-box; box-sizing: border-box;
background-color: @color-site-bg; background-color: @ini_background_site;
} }
p { p {

View file

@ -181,10 +181,10 @@ button[type=submit],
cursor: pointer; cursor: pointer;
box-shadow: none; box-shadow: none;
background-image: none; background-image: none;
background-color: @button_background; background-color: @ini_button_background;
border: 1px solid @button_background; border: 1px solid @ini_button_background;
border-radius: @fix_border-radius; border-radius: @fix_border-radius;
color: @button_color; color: @ini_button_color;
vertical-align: top; vertical-align: top;
padding: .3em @grid; padding: .3em @grid;
transition: @transition background-color, @transition color; transition: @transition background-color, @transition color;
@ -192,8 +192,8 @@ button[type=submit],
&:hover, &:hover,
&:active, &:active,
&:focus { &:focus {
background-color: @button_color; background-color: @ini_button_color;
color: @button_background; color: @ini_button_background;
} }
} }
@ -216,9 +216,9 @@ button[type=submit] {
&:focus { &:focus {
box-shadow: none; box-shadow: none;
background-image: none; background-image: none;
background-color: @button_background; background-color: @ini_button_background;
color: @button_color; color: @ini_button_color;
border-color: @button_background; border-color: @ini_button_background;
} }
} }

View file

@ -83,7 +83,7 @@
/* + + + wiki title + + + */ /* + + + wiki title + + + */
p.title { p.title {
background-color: @color-site-bg;; background-color: @ini_background_site;
opacity: @header-font-opacity; opacity: @header-font-opacity;
line-height: @line-height-default; line-height: @line-height-default;
margin-bottom: .5rem; margin-bottom: .5rem;

View file

@ -47,9 +47,9 @@
&:hover, &:hover,
&:active, &:active,
&:focus { &:focus {
background-color: @button_color; background-color: @ini_button_color;
color: @button_background; color: @ini_button_background;
border-color: @button_background; border-color: @ini_button_background;
&::after { &::after {
background-image: url("svg.php?svg=pencil.svg&f=button_background"); background-image: url("svg.php?svg=pencil.svg&f=button_background");

View file

@ -4,17 +4,19 @@
* @author Jana Deutschlaender <deutschlaender@cosmocode.de> * @author Jana Deutschlaender <deutschlaender@cosmocode.de>
*/ */
#dokuwiki__content.main-content {
#dokuwiki__content.main-content {
.level2 { .level2 {
p a.media { p a.media {
img { img {
border: 1px dotted @color-site-bg; border: 1px dotted @ini_background_site;
} }
&:hover, &:focus, &:active { &:hover,
&:focus,
&:active {
img { img {
border: 1px solid @color-link; border: 1px solid @ini_existing;
} }
} }
@ -31,12 +33,14 @@
} }
} }
/* + + + + + + + + + + + + + + + + + + + + + + + + + + */ /* + + + + + + + + + + + + + + + + + + + + + + + + + + */
/* min-width: 1440px */ /* min-width: 1440px */
@media @screen_min-xlg { @media @screen_min-xlg {
} }
/* + + + + + + + + + + + + + + + + + + + + + + + + + + */ /* + + + + + + + + + + + + + + + + + + + + + + + + + + */
/* max-width: 1199px */ /* max-width: 1199px */

View file

@ -52,8 +52,8 @@
width: 100%; width: 100%;
height: 100%; height: 100%;
background: @ini_background; background: @ini_background;
background: -webkit-linear-gradient(left, @ini_background, @color-content-bg); background: -webkit-linear-gradient(left, @ini_background, @ini_background_content);
background: linear-gradient(left, @ini_background, @color-content-bg); background: linear-gradient(left, @ini_background, @ini_background_content);
z-index: 0; z-index: 0;
} }
} }

View file

@ -13,7 +13,7 @@
box-sizing: border-box; box-sizing: border-box;
@media @screen_max-md { @media @screen_max-md {
background-color: @background_page-header; background-color: @ini_background_page-header;
} }
@media @screen_max-xs { @media @screen_max-xs {
@ -71,7 +71,7 @@
&:hover, &:hover,
&:focus, &:focus,
&:active { &:active {
border-color: @color-link; border-color: @ini_existing;
} }
} }
} }
@ -127,7 +127,7 @@
position: relative; position: relative;
strong { strong {
background-color: @color-site-bg; background-color: @ini_background_site;
} }
.num { .num {
@ -170,9 +170,9 @@
right: 0; right: 0;
width: auto; width: auto;
border: 0 none; border: 0 none;
background: @background_page-header; background: @ini_background_page-header;
background: -webkit-linear-gradient(top, @background_page-header, @color-content-bg); background: -webkit-linear-gradient(top, @ini_background_page-header, @ini_background_content);
background: linear-gradient(top, @background_page-header, @color-content-bg); background: linear-gradient(top, @ini_background_page-header, @ini_background_content);
box-shadow: @box-shadow-bottom; box-shadow: @box-shadow-bottom;
z-index: 2000; z-index: 2000;

View file

@ -22,7 +22,7 @@
a:visited { a:visited {
.sr-out(); .sr-out();
box-shadow: __box_shadow__; box-shadow: @box-shadow;
display: block; display: block;
width: 100%; width: 100%;
background-color: @nav_direct_background; background-color: @nav_direct_background;

View file

@ -98,7 +98,7 @@
cursor: pointer; cursor: pointer;
position: relative; position: relative;
display: block; display: block;
background-color: @color-site-bg; background-color: @ini_background_site;
border: 1px solid @ini_border_light; border: 1px solid @ini_border_light;
color: @ini_existing; color: @ini_existing;
font-size: @font-size-small; font-size: @font-size-small;
@ -113,7 +113,7 @@
@media @screen_max-md { @media @screen_max-md {
top: -1px; top: -1px;
background-color: @background_page-header; background-color: @ini_background_page-header;
border-radius: 0 0 @ini_default_border_radius @ini_default_border_radius; // @ini_default_border_radius vs. @fix_border-radius border-radius: 0 0 @ini_default_border_radius @ini_default_border_radius; // @ini_default_border_radius vs. @fix_border-radius
margin-left: 0; margin-left: 0;
padding: .2em .3rem .1em; padding: .2em .3rem .1em;
@ -141,8 +141,8 @@
&:hover, &:hover,
&:focus, &:focus,
&:active { &:active {
background-color: @color-content-bg; background-color: @ini_background_content;
border-color: @color-link; border-color: @ini_existing;
text-decoration: none; text-decoration: none;
} }
} }
@ -152,19 +152,19 @@
> a { > a {
cursor: default; cursor: default;
background-color: @color-content-bg; background-color: @ini_background_content;
border-color: @color-link; border-color: @ini_existing;
border-bottom-color: @color-content-bg; border-bottom-color: @ini_background_content;
color: @color-link; color: @ini_existing;
@media @screen_max-md { @media @screen_max-md {
border-radius: 0; border-radius: 0;
} }
@media @screen_max-sm { @media @screen_max-sm {
background-color: @color-link; background-color: @ini_existing;
border-bottom-color: @color-link; border-bottom-color: @ini_existing;
color: @color-content-bg; color: @ini_background_content;
} }
} }
} }
@ -192,7 +192,7 @@
right: 0; right: 0;
display: none; display: none;
width: 100%; width: 100%;
background-color: @color-content-bg; background-color: @ini_background_content;
border: 1px solid @ini_existing; border: 1px solid @ini_existing;
@media @screen_min-xs { @media @screen_min-xs {

View file

@ -213,7 +213,7 @@
&.noopentasks { &.noopentasks {
strong { strong {
background-color: @color-site-bg; background-color: @ini_background_site;
} }
.num { .num {

View file

@ -30,12 +30,12 @@
&:focus, &:focus,
&:active { &:active {
min-height: @icon-size; min-height: @icon-size;
background-color: @button_color; background-color: @ini_button_color;
border: solid 1px @button_background; border: solid 1px @ini_button_background;
color: @button_background; color: @ini_button_background;
&::after { &::after {
background-color: @button_background; background-color: @ini_button_background;
} }
} }
@ -97,9 +97,9 @@
top: 0; top: 0;
bottom: 0; bottom: 0;
min-height: @icon-size; min-height: @icon-size;
background-color: @button_color; background-color: @ini_button_color;
border: solid 1px @button_background; border: solid 1px @ini_button_background;
color: @button_background; color: @ini_button_background;
} }
} }

View file

@ -29,10 +29,10 @@
width: @margin-default; width: @margin-default;
height: 100%; height: 100%;
background-color: @button_background; background-color: @ini_button_background;
border: solid 1px @button_background; border: solid 1px @ini_button_background;
border-radius: @ini_default_border_radius 0 0 @ini_default_border_radius; // @ini_default_border_radius vs. @fix_border-radius border-radius: @ini_default_border_radius 0 0 @ini_default_border_radius; // @ini_default_border_radius vs. @fix_border-radius
color: @button_color; color: @ini_button_color;
text-decoration: none; text-decoration: none;
transition: @transition color, @transition background-color, @transition border-color; transition: @transition color, @transition background-color, @transition border-color;
@ -55,9 +55,9 @@
&:hover, &:hover,
&:focus, &:focus,
&:active { &:active {
background-color: @button_color; background-color: @ini_button_color;
border-color: @button_background; border-color: @ini_button_background;
color: @button_background; color: @ini_button_background;
text-decoration: none; text-decoration: none;
* { * {
@ -76,8 +76,8 @@
left: -1px; left: -1px;
a { a {
background-color: @button_background; background-color: @ini_button_background;
border-color: @button_background; border-color: @ini_button_background;
border-radius: 0 @ini_default_border_radius @ini_default_border_radius 0; // @ini_default_border_radius vs. @fix_border-radius border-radius: 0 @ini_default_border_radius @ini_default_border_radius 0; // @ini_default_border_radius vs. @fix_border-radius
&::before { &::before {
@ -93,7 +93,7 @@
&:hover, &:hover,
&:focus, &:focus,
&:active { &:active {
background-color: @button_color; background-color: @ini_button_color;
&::before { &::before {
opacity: 0; opacity: 0;

View file

@ -7,7 +7,7 @@
html, body { html, body {
background-color: @color-site-bg; background-color: @ini_background_site;
} }
@ -52,7 +52,7 @@ html, body {
clear: both; clear: both;
overflow: hidden; overflow: hidden;
word-wrap: break-word; word-wrap: break-word;
background: @color-content-bg; background: @ini_background_content;
color: inherit; color: inherit;
padding: @page_padding-top @margin-default @margin-default; padding: @page_padding-top @margin-default @margin-default;
@ -415,7 +415,7 @@ kbd {
font-size: @font-size-default; font-size: @font-size-default;
direction: ltr; direction: ltr;
text-align: left; text-align: left;
background-color: @color-site-bg; background-color: @ini_background_site;
color: @ini_text; color: @ini_text;
box-shadow: inset 0 0 .3em @ini_border; box-shadow: inset 0 0 .3em @ini_border;
border-radius: @fix_border-radius; border-radius: @fix_border-radius;

View file

@ -24,7 +24,7 @@
form div.no { form div.no {
button, button,
input.button { input.button {
border-top: solid 1px @button_background; border-top: solid 1px @ini_button_background;
margin-top: 0; margin-top: 0;
} }
} }

View file

@ -12,7 +12,7 @@
button, button,
input.button { input.button {
min-height: 1rem; min-height: 1rem;
// button - for inverted design: background-color: @button_color; color: @button_background; // button - for inverted design: background-color: @ini_button_color; color: @ini_button_background;
font-size: @font-size-small; font-size: @font-size-small;
margin-top: 0; margin-top: 0;
} }

View file

@ -31,8 +31,8 @@
&:hover, &:hover,
&:focus, &:focus,
&:active { &:active {
border-color: @button_background; border-color: @ini_button_background;
color: @button_background; color: @ini_button_background;
} }
} }
@ -42,7 +42,7 @@
width: 100%; width: 100%;
min-height: @height-context-bar; min-height: @height-context-bar;
box-sizing: border-box; box-sizing: border-box;
box-shadow: __box_shadow__; box-shadow: @box-shadow;
background-color: @ini_background_content; background-color: @ini_background_content;
border-radius: 0 0 @ini_default_border_radius @ini_default_border_radius; border-radius: 0 0 @ini_default_border_radius @ini_default_border_radius;
font-size: @font-size-default; font-size: @font-size-default;

View file

@ -11,17 +11,17 @@ div#dwpl-ti-container {
/* + + + tabnav + + + */ /* + + + tabnav + + + */
li.dwpl-ti-tab { li.dwpl-ti-tab {
box-shadow: none; box-shadow: none;
border-color: @color-site-bg; border-color: @ini_background_site;
border-radius: @fix_border-radius @fix_border-radius 0 0; border-radius: @fix_border-radius @fix_border-radius 0 0;
padding: 0; padding: 0;
div { div {
background-color: @background_page-header; background-color: @ini_background_page-header;
border-radius: inherit; border-radius: inherit;
padding: .1em .35em; padding: .1em .35em;
&.selected { &.selected {
background-color: @color-site-bg; background-color: @ini_background_site;
} }
} }
} }
@ -31,8 +31,8 @@ div#dwpl-ti-container {
div.dwpl-ti-content-box { div.dwpl-ti-content-box {
overflow: auto; overflow: auto;
box-shadow: none; box-shadow: none;
background-color: @color-site-bg; background-color: @ini_background_site;
border: solid 1px @color-site-bg; border: solid 1px @ini_background_site;
border-radius: 0; border-radius: 0;
} }
} }