mdbootstrap/mdb-ui-kit
1
1
Fork 0
mirror of https://github.com/mdbootstrap/mdb-ui-kit.git synced 2024-11-30 05:24:09 +03:00
Code Issues Packages Projects Releases Wiki Activity

fixed color of labels and floating labels

Browse Source
This commit is contained in:
FezVrasta 2015-03-18 14:46:06 +01:00
parent ea57cde490
commit b4f40e2fb6
11 changed files with 49 additions and 261 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

112
dist/css/material-fullpalette.css vendored
View File

@ -2594,67 +2594,6 @@ a:hover,
a:focus { a:focus {
color: #009688; color: #009688;
} }
body .well,
.container .well,
.container-fluid .well,
body .well:not([class^="well well-material-"]),
.container .well:not([class^="well well-material-"]),
.container-fluid .well:not([class^="well well-material-"]),
body .well .form-control,
.container .well .form-control,
.container-fluid .well .form-control,
body .well:not([class^="well well-material-"]) .form-control,
.container .well:not([class^="well well-material-"]) .form-control,
.container-fluid .well:not([class^="well well-material-"]) .form-control {
color: rgba(0, 0, 0, 0.84);
}
body .well .floating-label,
.container .well .floating-label,
.container-fluid .well .floating-label,
body .well:not([class^="well well-material-"]) .floating-label,
.container .well:not([class^="well well-material-"]) .floating-label,
.container-fluid .well:not([class^="well well-material-"]) .floating-label {
color: #7e7e7e;
}
body .well .form-control::-webkit-input-placeholder,
.container .well .form-control::-webkit-input-placeholder,
.container-fluid .well .form-control::-webkit-input-placeholder,
body .well:not([class^="well well-material-"]) .form-control::-webkit-input-placeholder,
.container .well:not([class^="well well-material-"]) .form-control::-webkit-input-placeholder,
.container-fluid .well:not([class^="well well-material-"]) .form-control::-webkit-input-placeholder {
color: #7e7e7e;
}
body .well .form-control::-moz-placeholder,
.container .well .form-control::-moz-placeholder,
.container-fluid .well .form-control::-moz-placeholder,
body .well:not([class^="well well-material-"]) .form-control::-moz-placeholder,
.container .well:not([class^="well well-material-"]) .form-control::-moz-placeholder,
.container-fluid .well:not([class^="well well-material-"]) .form-control::-moz-placeholder {
color: #7e7e7e;
opacity: 1;
}
body .well .form-control:-ms-input-placeholder,
.container .well .form-control:-ms-input-placeholder,
.container-fluid .well .form-control:-ms-input-placeholder,
body .well:not([class^="well well-material-"]) .form-control:-ms-input-placeholder,
.container .well:not([class^="well well-material-"]) .form-control:-ms-input-placeholder,
.container-fluid .well:not([class^="well well-material-"]) .form-control:-ms-input-placeholder {
color: #7e7e7e;
}
body .well .option,
.container .well .option,
.container-fluid .well .option,
body .well:not([class^="well well-material-"]) .option,
.container .well:not([class^="well well-material-"]) .option,
.container-fluid .well:not([class^="well well-material-"]) .option,
body .well .create,
.container .well .create,
.container-fluid .well .create,
body .well:not([class^="well well-material-"]) .create,
.container .well:not([class^="well well-material-"]) .create,
.container-fluid .well:not([class^="well well-material-"]) .create {
color: rgba(0, 0, 0, 0.84);
}
body .well.well-sm, body .well.well-sm,
.container .well.well-sm, .container .well.well-sm,
.container-fluid .well.well-sm { .container-fluid .well.well-sm {
@ -2665,46 +2604,6 @@ body .well.well-lg,
.container-fluid .well.well-lg { .container-fluid .well.well-lg {
padding: 26px; padding: 26px;
} }
body [class^="well well-material-"],
.container [class^="well well-material-"],
.container-fluid [class^="well well-material-"],
body [class^="well well-material-"] .form-control,
.container [class^="well well-material-"] .form-control,
.container-fluid [class^="well well-material-"] .form-control,
body [class^="well well-material-"] .floating-label,
.container [class^="well well-material-"] .floating-label,
.container-fluid [class^="well well-material-"] .floating-label {
color: rgba(255, 255, 255, 0.84);
}
body [class^="well well-material-"] .form-control,
.container [class^="well well-material-"] .form-control,
.container-fluid [class^="well well-material-"] .form-control {
border-bottom-color: rgba(255, 255, 255, 0.84);
}
body [class^="well well-material-"] .form-control::-webkit-input-placeholder,
.container [class^="well well-material-"] .form-control::-webkit-input-placeholder,
.container-fluid [class^="well well-material-"] .form-control::-webkit-input-placeholder {
color: rgba(255, 255, 255, 0.84);
}
body [class^="well well-material-"] .form-control::-moz-placeholder,
.container [class^="well well-material-"] .form-control::-moz-placeholder,
.container-fluid [class^="well well-material-"] .form-control::-moz-placeholder {
color: rgba(255, 255, 255, 0.84);
opacity: 1;
}
body [class^="well well-material-"] .form-control:-ms-input-placeholder,
.container [class^="well well-material-"] .form-control:-ms-input-placeholder,
.container-fluid [class^="well well-material-"] .form-control:-ms-input-placeholder {
color: rgba(255, 255, 255, 0.84);
}
body [class^="well well-material-"] .option,
.container [class^="well well-material-"] .option,
.container-fluid [class^="well well-material-"] .option,
body [class^="well well-material-"] .create,
.container [class^="well well-material-"] .create,
.container-fluid [class^="well well-material-"] .create {
color: rgba(0, 0, 0, 0.84);
}
body .well, body .well,
.container .well, .container .well,
.container-fluid .well, .container-fluid .well,
@ -35615,6 +35514,15 @@ select[multiple].form-control.focus {
background-color: transparent; background-color: transparent;
background-color: rgba(0, 0, 0, 0); background-color: rgba(0, 0, 0, 0);
} }
.form-control::-webkit-input-placeholder {
color: #bdbdbd;
}
.form-control::-moz-placeholder {
color: #bdbdbd;
}
.form-control:-ms-input-placeholder {
color: #bdbdbd;
}
.form-control[disabled], .form-control[disabled],
.form-control[readonly], .form-control[readonly],
fieldset[disabled] .form-control { fieldset[disabled] .form-control {
@ -35645,7 +35553,7 @@ fieldset[disabled] .form-control.focus:disabled,
position: relative; position: relative;
} }
.form-control-wrapper .floating-label { .form-control-wrapper .floating-label {
color: #7E7E7E; color: #bdbdbd;
font-size: 14px; font-size: 14px;
position: absolute; position: absolute;
pointer-events: none; pointer-events: none;

2
dist/css/material-fullpalette.css.map vendored
View File

File diff suppressed because one or more lines are too long

2
dist/css/material-fullpalette.min.css vendored
View File

File diff suppressed because one or more lines are too long

2
dist/css/material-fullpalette.min.css.map vendored
View File

File diff suppressed because one or more lines are too long

112
dist/css/material.css vendored
View File

@ -2594,67 +2594,6 @@ a:hover,
a:focus { a:focus {
color: #009688; color: #009688;
} }
body .well,
.container .well,
.container-fluid .well,
body .well:not([class^="well well-material-"]),
.container .well:not([class^="well well-material-"]),
.container-fluid .well:not([class^="well well-material-"]),
body .well .form-control,
.container .well .form-control,
.container-fluid .well .form-control,
body .well:not([class^="well well-material-"]) .form-control,
.container .well:not([class^="well well-material-"]) .form-control,
.container-fluid .well:not([class^="well well-material-"]) .form-control {
color: rgba(0, 0, 0, 0.84);
}
body .well .floating-label,
.container .well .floating-label,
.container-fluid .well .floating-label,
body .well:not([class^="well well-material-"]) .floating-label,
.container .well:not([class^="well well-material-"]) .floating-label,
.container-fluid .well:not([class^="well well-material-"]) .floating-label {
color: #7e7e7e;
}
body .well .form-control::-webkit-input-placeholder,
.container .well .form-control::-webkit-input-placeholder,
.container-fluid .well .form-control::-webkit-input-placeholder,
body .well:not([class^="well well-material-"]) .form-control::-webkit-input-placeholder,
.container .well:not([class^="well well-material-"]) .form-control::-webkit-input-placeholder,
.container-fluid .well:not([class^="well well-material-"]) .form-control::-webkit-input-placeholder {
color: #7e7e7e;
}
body .well .form-control::-moz-placeholder,
.container .well .form-control::-moz-placeholder,
.container-fluid .well .form-control::-moz-placeholder,
body .well:not([class^="well well-material-"]) .form-control::-moz-placeholder,
.container .well:not([class^="well well-material-"]) .form-control::-moz-placeholder,
.container-fluid .well:not([class^="well well-material-"]) .form-control::-moz-placeholder {
color: #7e7e7e;
opacity: 1;
}
body .well .form-control:-ms-input-placeholder,
.container .well .form-control:-ms-input-placeholder,
.container-fluid .well .form-control:-ms-input-placeholder,
body .well:not([class^="well well-material-"]) .form-control:-ms-input-placeholder,
.container .well:not([class^="well well-material-"]) .form-control:-ms-input-placeholder,
.container-fluid .well:not([class^="well well-material-"]) .form-control:-ms-input-placeholder {
color: #7e7e7e;
}
body .well .option,
.container .well .option,
.container-fluid .well .option,
body .well:not([class^="well well-material-"]) .option,
.container .well:not([class^="well well-material-"]) .option,
.container-fluid .well:not([class^="well well-material-"]) .option,
body .well .create,
.container .well .create,
.container-fluid .well .create,
body .well:not([class^="well well-material-"]) .create,
.container .well:not([class^="well well-material-"]) .create,
.container-fluid .well:not([class^="well well-material-"]) .create {
color: rgba(0, 0, 0, 0.84);
}
body .well.well-sm, body .well.well-sm,
.container .well.well-sm, .container .well.well-sm,
.container-fluid .well.well-sm { .container-fluid .well.well-sm {
@ -2665,46 +2604,6 @@ body .well.well-lg,
.container-fluid .well.well-lg { .container-fluid .well.well-lg {
padding: 26px; padding: 26px;
} }
body [class^="well well-material-"],
.container [class^="well well-material-"],
.container-fluid [class^="well well-material-"],
body [class^="well well-material-"] .form-control,
.container [class^="well well-material-"] .form-control,
.container-fluid [class^="well well-material-"] .form-control,
body [class^="well well-material-"] .floating-label,
.container [class^="well well-material-"] .floating-label,
.container-fluid [class^="well well-material-"] .floating-label {
color: rgba(255, 255, 255, 0.84);
}
body [class^="well well-material-"] .form-control,
.container [class^="well well-material-"] .form-control,
.container-fluid [class^="well well-material-"] .form-control {
border-bottom-color: rgba(255, 255, 255, 0.84);
}
body [class^="well well-material-"] .form-control::-webkit-input-placeholder,
.container [class^="well well-material-"] .form-control::-webkit-input-placeholder,
.container-fluid [class^="well well-material-"] .form-control::-webkit-input-placeholder {
color: rgba(255, 255, 255, 0.84);
}
body [class^="well well-material-"] .form-control::-moz-placeholder,
.container [class^="well well-material-"] .form-control::-moz-placeholder,
.container-fluid [class^="well well-material-"] .form-control::-moz-placeholder {
color: rgba(255, 255, 255, 0.84);
opacity: 1;
}
body [class^="well well-material-"] .form-control:-ms-input-placeholder,
.container [class^="well well-material-"] .form-control:-ms-input-placeholder,
.container-fluid [class^="well well-material-"] .form-control:-ms-input-placeholder {
color: rgba(255, 255, 255, 0.84);
}
body [class^="well well-material-"] .option,
.container [class^="well well-material-"] .option,
.container-fluid [class^="well well-material-"] .option,
body [class^="well well-material-"] .create,
.container [class^="well well-material-"] .create,
.container-fluid [class^="well well-material-"] .create {
color: rgba(0, 0, 0, 0.84);
}
body .well, body .well,
.container .well, .container .well,
.container-fluid .well, .container-fluid .well,
@ -5004,6 +4903,15 @@ select[multiple].form-control.focus {
background-color: transparent; background-color: transparent;
background-color: rgba(0, 0, 0, 0); background-color: rgba(0, 0, 0, 0);
} }
.form-control::-webkit-input-placeholder {
color: #bdbdbd;
}
.form-control::-moz-placeholder {
color: #bdbdbd;
}
.form-control:-ms-input-placeholder {
color: #bdbdbd;
}
.form-control[disabled], .form-control[disabled],
.form-control[readonly], .form-control[readonly],
fieldset[disabled] .form-control { fieldset[disabled] .form-control {
@ -5034,7 +4942,7 @@ fieldset[disabled] .form-control.focus:disabled,
position: relative; position: relative;
} }
.form-control-wrapper .floating-label { .form-control-wrapper .floating-label {
color: #7E7E7E; color: #bdbdbd;
font-size: 14px; font-size: 14px;
position: absolute; position: absolute;
pointer-events: none; pointer-events: none;

2
dist/css/material.css.map vendored
View File

File diff suppressed because one or more lines are too long

2
dist/css/material.min.css vendored
View File

File diff suppressed because one or more lines are too long

2
dist/css/material.min.css.map vendored
View File

File diff suppressed because one or more lines are too long

23
less/_inputs.less
View File

@ -29,13 +29,30 @@ select[multiple].form-control {
background-position: center bottom, center calc(~"100% - 1px"); background-position: center bottom, center calc(~"100% - 1px");
background-color: transparent; background-color: transparent;
background-color: rgba(0,0,0,0); background-color: rgba(0,0,0,0);
&::-webkit-input-placeholder {
color: @input-placeholder-color;
}
&::-moz-placeholder {
color: @input-placeholder-color;
}
&:-ms-input-placeholder {
color: @input-placeholder-color;
}
} }
.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control { .form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
background-color: transparent; background-color: transparent;
background-color: rgba(0,0,0,0); background-color: rgba(0,0,0,0);
} }
fieldset[disabled] .form-control:disabled, .form-control-wrapper .form-control:disabled, .form-control:disabled, fieldset[disabled] .form-control:focus:disabled, .form-control-wrapper .form-control:focus:disabled, .form-control:focus:disabled, fieldset[disabled] .form-control.focus:disabled, .form-control-wrapper .form-control.focus:disabled, .form-control.focus:disabled { fieldset[disabled] .form-control:disabled,
border: 0; .form-control-wrapper .form-control:disabled,
.form-control:disabled,
fieldset[disabled] .form-control:focus:disabled,
.form-control-wrapper .form-control:focus:disabled,
.form-control:focus:disabled,
fieldset[disabled] .form-control.focus:disabled,
.form-control-wrapper .form-control.focus:disabled,
.form-control.focus:disabled {
border: 0; // Ugly override of Bootstrap border
} }
.form-control:focus, .form-control.focus { .form-control:focus, .form-control.focus {
@ -51,7 +68,7 @@ fieldset[disabled] .form-control:disabled, .form-control-wrapper .form-control:d
position: relative; position: relative;
.floating-label { .floating-label {
color: #7E7E7E; color: @input-placeholder-color;
font-size: 14px; font-size: 14px;
position: absolute; position: absolute;
pointer-events: none; pointer-events: none;

3
less/_variables.less
View File

@ -87,3 +87,6 @@
// Popovers and Popups // Popovers and Popups
@popover-background: rgba(101, 101, 101, 0.9); @popover-background: rgba(101, 101, 101, 0.9);
@popover-color: #ececec; @popover-color: #ececec;
// Inputs
@input-placeholder-color: #BDBDBD;

48
less/_welljumbo.less
View File

@ -1,58 +1,11 @@
body, .container, .container-fluid { body, .container, .container-fluid {
.well, .well:not([class^="well well-material-"]) {
&, .form-control {
color: @lightbg-text;
}
.floating-label {
color: #7e7e7e;
}
.form-control {
&::-webkit-input-placeholder {
color: #7e7e7e;
}
&::-moz-placeholder {
color: #7e7e7e;
opacity: 1;
}
&:-ms-input-placeholder {
color: #7e7e7e;
}
}
.option, .create {
color: @lightbg-text;
}
}
.well.well-sm { .well.well-sm {
padding: 10px; padding: 10px;
} }
.well.well-lg { .well.well-lg {
padding: 26px; padding: 26px;
} }
[class^="well well-material-"] {
&, .form-control, .floating-label {
color: @darkbg-text;
}
.form-control {
border-bottom-color: @darkbg-text;
&::-webkit-input-placeholder {
color: @darkbg-text;
}
&::-moz-placeholder {
color: @darkbg-text;
opacity: 1;
}
&:-ms-input-placeholder {
color: @darkbg-text;
}
}
// Rule to fix selectize plugin
.option, .create {
color: @lightbg-text;
}
}
.well, .jumbotron { .well, .jumbotron {
background-color: #fff; background-color: #fff;
@ -64,7 +17,6 @@ body, .container, .container-fluid {
p { p {
font-weight: 300; font-weight: 300;
} }
.variations(~"", background-color, #FFF); .variations(~"", background-color, #FFF);
} }
} }