mirror of
https://github.com/mdbootstrap/mdb-ui-kit.git
synced 2024-11-25 11:04:09 +03:00
security fix
This commit is contained in:
FezVrasta
parent
04de0f6023
commit
4e810295b5
1
.gitignore
vendored
1
.gitignore
vendored
|
|
@ -4,3 +4,4 @@
|
|||
|
||||
Thumbs.db
|
||||
.DS_Store
|
||||
/node_modules/
|
||||
|
|
|
|||
11
CONTRIBUTING.md
Normal file
11
CONTRIBUTING.md
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
## Playground
|
||||
|
||||
Use this pen to test and deveop new features of Material Design for Bootstrap:
|
||||
|
||||
http://codepen.io/FezVrasta/pen/ihmea
|
||||
|
||||
It already includes every needed dependency and is based on the latest version of the theme.
|
||||
|
||||
## Grunt
|
||||
|
||||
**Grunt!** Ok... when you edit something please run `grunt` to compile CSS and copy stuff in the correct folders. Thanks!
|
||||
|
|
@ -56,6 +56,10 @@ If you like this project you may support me by donating something on Gittip, sta
|
|||
[](https://www.gittip.com/FezVrasta/)
|
||||
[](https://github.com/FezVrasta/bootstrap-material-design/issues)
|
||||
|
||||
# Contribute
|
||||
|
||||
Please see the [contrib](CONTRIBUTING.md) file.
|
||||
|
||||
# Documentation
|
||||
|
||||
Material Design for Bootstrap provides some additional stuff to get the best from Material Design.
|
||||
|
|
|
|||
1
compile.json
Normal file
1
compile.json
Normal file
|
|
@ -0,0 +1 @@
|
|||
{ "less": [] }
|
||||
|
|
@ -1,19 +1,4 @@
|
|||
/* Generated by less 1.7.5 */
|
||||
@import url(//fonts.googleapis.com/css?family=Roboto+Condensed:300italic,400italic,700italic,400,700,300|Roboto:400,100,100italic,300,300italic,400italic,500,500italic,700,700italic);
|
||||
@-webkit-keyframes input-highlight {
|
||||
0% {
|
||||
left: 20%;
|
||||
width: 20%;
|
||||
}
|
||||
99% {
|
||||
width: 0;
|
||||
left: 0;
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes input-highlight {
|
||||
0% {
|
||||
left: 20%;
|
||||
|
|
@ -401,7 +386,6 @@ body .jumbotron-material-lightgrey,
|
|||
text-transform: uppercase;
|
||||
text-decoration: none;
|
||||
color: rgba(255, 255, 255, 0.84);
|
||||
-webkit-transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
outline: none !important;
|
||||
}
|
||||
|
|
@ -500,7 +484,6 @@ body .jumbotron-material-lightgrey,
|
|||
}
|
||||
.btn-raised {
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
-webkit-transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
}
|
||||
.btn-raised:active:not(.btn-link) {
|
||||
|
|
@ -588,7 +571,6 @@ body .jumbotron-material-lightgrey,
|
|||
border-radius: 4px;
|
||||
margin: 10px 1px;
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
-webkit-transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
}
|
||||
.btn-group:active:not(.btn-link),
|
||||
|
|
@ -602,7 +584,6 @@ body .jumbotron-material-lightgrey,
|
|||
.btn-group.btn-group-raised,
|
||||
.btn-group-vertical.btn-group-raised {
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
-webkit-transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
}
|
||||
.btn-group.btn-group-raised:active:not(.btn-link),
|
||||
|
|
@ -740,8 +721,6 @@ body .jumbotron-material-lightgrey,
|
|||
padding-top: 15px;
|
||||
}
|
||||
.checkbox {
|
||||
-webkit-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
.checkbox label {
|
||||
|
|
@ -753,7 +732,6 @@ body .jumbotron-material-lightgrey,
|
|||
display: block;
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
-webkit-transition-duration: 0.2s;
|
||||
transition-duration: 0.2s;
|
||||
}
|
||||
.checkbox label .check:after {
|
||||
|
|
@ -776,7 +754,6 @@ body .jumbotron-material-lightgrey,
|
|||
border: 2px solid rgba(0, 0, 0, 0.84);
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
-webkit-transition-delay: 0.2s;
|
||||
transition-delay: 0.2s;
|
||||
}
|
||||
.checkbox .check,
|
||||
|
|
@ -860,35 +837,29 @@ body .jumbotron-material-lightgrey,
|
|||
height: 18px;
|
||||
border: solid 2px;
|
||||
border-color: #5a5a5a;
|
||||
-webkit-animation: uncheck 300ms ease-out forwards;
|
||||
-ms-animation: uncheck 300ms ease-out forwards;
|
||||
animation: uncheck 300ms ease-out forwards;
|
||||
}
|
||||
.checkbox input[type=checkbox]:focus ~ .check:after {
|
||||
opacity: 0.2;
|
||||
}
|
||||
.checkbox input[type=checkbox]:checked ~ .check:before {
|
||||
-webkit-animation: check 300ms ease-out forwards;
|
||||
-ms-animation: check 300ms ease-out forwards;
|
||||
animation: check 300ms ease-out forwards;
|
||||
}
|
||||
.checkbox input[type=checkbox]:not(:checked) ~ .check:after {
|
||||
-webkit-animation: rippleOff 500ms;
|
||||
-ms-animation: rippleOff 500ms;
|
||||
animation: rippleOff 500ms;
|
||||
animation: rippleOff 500ms linear forwards;
|
||||
}
|
||||
.checkbox input[type=checkbox]:checked ~ .check:after {
|
||||
-webkit-animation: rippleOn 500ms;
|
||||
-ms-animation: rippleOn 500ms;
|
||||
animation: rippleOn 500ms;
|
||||
animation: rippleOn 500ms linear forwards;
|
||||
}
|
||||
.checkbox:not(:hover) input[type=checkbox] ~ .check:before,
|
||||
.checkbox:not(:hover) input[type=checkbox] ~ .check:after {
|
||||
animation-duration: 1ms;
|
||||
}
|
||||
.checkbox input[type=checkbox][disabled]:not(:checked) ~ .check:before {
|
||||
opacity: 0.5;
|
||||
}
|
||||
.checkbox input[type=checkbox][disabled] ~ .check:after {
|
||||
background-color: rgba(0, 0, 0, 0.84);
|
||||
-webkit-transform: rotate(-45deg);
|
||||
-ms-transform: rotate(-45deg);
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
.checkbox input[type=checkbox]:checked ~ .check:after,
|
||||
|
|
@ -961,86 +932,6 @@ body .jumbotron-material-lightgrey,
|
|||
.checkbox-material-lightgrey input[type=checkbox]:checked ~ .check:after {
|
||||
background-color: #ececec;
|
||||
}
|
||||
@-webkit-keyframes uncheck {
|
||||
0% {
|
||||
top: -3px;
|
||||
left: 17px;
|
||||
width: 10px;
|
||||
height: 21px;
|
||||
border-color: #0f9d58;
|
||||
border-left-color: transparent;
|
||||
border-top-color: transparent;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
50% {
|
||||
top: 14px;
|
||||
left: 17px;
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-color: #0f9d58;
|
||||
border-left-color: transparent;
|
||||
border-top-color: transparent;
|
||||
}
|
||||
51% {
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
border-top-color: #5a5a5a;
|
||||
}
|
||||
100% {
|
||||
top: 1px;
|
||||
left: 12px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
border-top-color: #5a5a5a;
|
||||
}
|
||||
}
|
||||
@-ms-keyframes uncheck {
|
||||
0% {
|
||||
top: -3px;
|
||||
left: 17px;
|
||||
width: 10px;
|
||||
height: 21px;
|
||||
border-color: #0f9d58;
|
||||
border-left-color: transparent;
|
||||
border-top-color: transparent;
|
||||
-ms-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
50% {
|
||||
top: 14px;
|
||||
left: 17px;
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
-ms-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-color: #0f9d58;
|
||||
border-left-color: transparent;
|
||||
border-top-color: transparent;
|
||||
}
|
||||
51% {
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
border-top-color: #5a5a5a;
|
||||
}
|
||||
100% {
|
||||
top: 1px;
|
||||
left: 12px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
border-top-color: #5a5a5a;
|
||||
}
|
||||
}
|
||||
@keyframes uncheck {
|
||||
0% {
|
||||
top: -3px;
|
||||
|
|
@ -1050,7 +941,6 @@ body .jumbotron-material-lightgrey,
|
|||
border-color: #0f9d58;
|
||||
border-left-color: transparent;
|
||||
border-top-color: transparent;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
50% {
|
||||
|
|
@ -1058,7 +948,6 @@ body .jumbotron-material-lightgrey,
|
|||
left: 17px;
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-color: #0f9d58;
|
||||
border-left-color: transparent;
|
||||
|
|
@ -1074,85 +963,6 @@ body .jumbotron-material-lightgrey,
|
|||
left: 12px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
border-top-color: #5a5a5a;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes check {
|
||||
100% {
|
||||
top: -3px;
|
||||
left: 17px;
|
||||
width: 10px;
|
||||
height: 21px;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-color: #0f9d58;
|
||||
border-left-color: transparent;
|
||||
border-top-color: transparent;
|
||||
}
|
||||
51% {
|
||||
border-left: transparent;
|
||||
border-top-color: transparent;
|
||||
}
|
||||
50% {
|
||||
top: 14px;
|
||||
left: 17px;
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
border-top-color: #5a5a5a;
|
||||
}
|
||||
0% {
|
||||
top: 1px;
|
||||
left: 12px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
border-top-color: #5a5a5a;
|
||||
}
|
||||
}
|
||||
@-ms-keyframes check {
|
||||
100% {
|
||||
top: -3px;
|
||||
left: 17px;
|
||||
width: 10px;
|
||||
height: 21px;
|
||||
-ms-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-color: #0f9d58;
|
||||
border-left-color: transparent;
|
||||
border-top-color: transparent;
|
||||
}
|
||||
51% {
|
||||
border-left: transparent;
|
||||
border-top-color: transparent;
|
||||
}
|
||||
50% {
|
||||
top: 14px;
|
||||
left: 17px;
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
-ms-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
border-top-color: #5a5a5a;
|
||||
}
|
||||
0% {
|
||||
top: 1px;
|
||||
left: 12px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
|
|
@ -1165,7 +975,6 @@ body .jumbotron-material-lightgrey,
|
|||
left: 17px;
|
||||
width: 10px;
|
||||
height: 21px;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-color: #0f9d58;
|
||||
border-left-color: transparent;
|
||||
|
|
@ -1180,7 +989,6 @@ body .jumbotron-material-lightgrey,
|
|||
left: 17px;
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
|
|
@ -1191,53 +999,12 @@ body .jumbotron-material-lightgrey,
|
|||
left: 12px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
border-top-color: #5a5a5a;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@-ms-keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
|
|
@ -1248,55 +1015,6 @@ body .jumbotron-material-lightgrey,
|
|||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes rippleOff {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@-ms-keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes rippleOff {
|
||||
0% {
|
||||
|
|
@ -1308,15 +1026,6 @@ body .jumbotron-material-lightgrey,
|
|||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
.form-horizontal .radio {
|
||||
margin-bottom: 10px;
|
||||
|
|
@ -1331,7 +1040,6 @@ body .jumbotron-material-lightgrey,
|
|||
position: absolute;
|
||||
left: 10px;
|
||||
top: 2px;
|
||||
-webkit-transition-duration: 0.2s;
|
||||
transition-duration: 0.2s;
|
||||
}
|
||||
.radio label .circle {
|
||||
|
|
@ -1345,8 +1053,6 @@ body .jumbotron-material-lightgrey,
|
|||
width: 15px;
|
||||
border-radius: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.84);
|
||||
-webkit-transform: scale(0);
|
||||
-ms-transform: scale(0);
|
||||
transform: scale(0);
|
||||
}
|
||||
.radio label .check:after {
|
||||
|
|
@ -1362,18 +1068,12 @@ body .jumbotron-material-lightgrey,
|
|||
z-index: 1;
|
||||
opacity: 0;
|
||||
margin: 0;
|
||||
-webkit-transform: scale(1.5);
|
||||
-ms-transform: scale(1.5);
|
||||
transform: scale(1.5);
|
||||
}
|
||||
.radio label input[type=radio]:not(:checked) ~ .check:after {
|
||||
-webkit-animation: rippleOff 500ms;
|
||||
-ms-animation: rippleOff 500ms;
|
||||
animation: rippleOff 500ms;
|
||||
}
|
||||
.radio label input[type=radio]:checked ~ .check:after {
|
||||
-webkit-animation: rippleOn 500ms;
|
||||
-ms-animation: rippleOn 500ms;
|
||||
animation: rippleOn 500ms;
|
||||
}
|
||||
.radio input[type=radio]:checked ~ .check,
|
||||
|
|
@ -1524,8 +1224,6 @@ body .jumbotron-material-lightgrey,
|
|||
display: none;
|
||||
}
|
||||
.radio input[type=radio]:checked ~ .check {
|
||||
-webkit-transform: scale(0.55);
|
||||
-ms-transform: scale(0.55);
|
||||
transform: scale(0.55);
|
||||
}
|
||||
.radio input[type=radio][disabled] ~ .circle {
|
||||
|
|
@ -1534,46 +1232,6 @@ body .jumbotron-material-lightgrey,
|
|||
.radio input[type=radio][disabled] ~ .check {
|
||||
background-color: rgba(0, 0, 0, 0.84);
|
||||
}
|
||||
@-webkit-keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@-ms-keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
|
|
@ -1584,55 +1242,6 @@ body .jumbotron-material-lightgrey,
|
|||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes rippleOff {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@-ms-keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes rippleOff {
|
||||
0% {
|
||||
|
|
@ -1644,15 +1253,6 @@ body .jumbotron-material-lightgrey,
|
|||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
fieldset[disabled] .form-control,
|
||||
.form-control-wrapper .form-control,
|
||||
|
|
@ -1716,7 +1316,6 @@ select[multiple].form-control.focus {
|
|||
pointer-events: none;
|
||||
left: 0px;
|
||||
top: 5px;
|
||||
-webkit-transition: 0.2s ease all;
|
||||
transition: 0.2s ease all;
|
||||
opacity: 0;
|
||||
}
|
||||
|
|
@ -1750,18 +1349,12 @@ select[multiple].form-control.focus {
|
|||
height: 2px;
|
||||
background-color: #5264ae;
|
||||
bottom: -1px;
|
||||
-webkit-transform: scaleX(0);
|
||||
-ms-transform: scaleX(0);
|
||||
transform: scaleX(0);
|
||||
-webkit-transition: -webkit-transform 0s;
|
||||
transition: transform 0s;
|
||||
}
|
||||
.form-control-wrapper .form-control:focus ~ .material-input:before,
|
||||
.form-control-wrapper .form-control.focus ~ .material-input:before {
|
||||
-webkit-transform: scaleX(1);
|
||||
-ms-transform: scaleX(1);
|
||||
transform: scaleX(1);
|
||||
-webkit-transition: -webkit-transform 0.2s ease-out;
|
||||
transition: transform 0.2s ease-out;
|
||||
}
|
||||
.form-control-wrapper .material-input:after {
|
||||
|
|
@ -1774,8 +1367,6 @@ select[multiple].form-control.focus {
|
|||
left: 0;
|
||||
pointer-events: none;
|
||||
opacity: 0.9;
|
||||
-webkit-transform-origin: left;
|
||||
-ms-transform-origin: left;
|
||||
transform-origin: left;
|
||||
}
|
||||
.form-control-wrapper .input-lg ~ .material-input:after {
|
||||
|
|
@ -1789,9 +1380,7 @@ select[multiple].form-control.focus {
|
|||
}
|
||||
.form-control-wrapper .form-control:focus ~ .material-input:after,
|
||||
.form-control-wrapper .form-control.focus ~ .material-input:after {
|
||||
-webkit-animation: input-highlight 0.3s ease;
|
||||
animation: input-highlight 0.3s ease;
|
||||
-webkit-animation-fill-mode: forwards;
|
||||
animation-fill-mode: forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
|
@ -2212,11 +1801,9 @@ select.form-control.focus {
|
|||
@keyframes input-highlight {
|
||||
0% {
|
||||
left: 20%;
|
||||
-webkit-transform: scaleX(20%);
|
||||
transform: scaleX(20%);
|
||||
}
|
||||
99% {
|
||||
-webkit-transform: scaleX(0);
|
||||
transform: scaleX(0);
|
||||
left: 0;
|
||||
opacity: 1;
|
||||
|
|
@ -2306,7 +1893,6 @@ legend {
|
|||
}
|
||||
.list-group .list-group-item .row-content {
|
||||
display: inline-block;
|
||||
width: -webkit-calc(100% - 92px);
|
||||
width: calc(100% - 92px);
|
||||
min-height: 66px;
|
||||
}
|
||||
|
|
@ -2321,7 +1907,6 @@ legend {
|
|||
cursor: pointer;
|
||||
}
|
||||
.list-group .list-group-item .row-content .action-secondary ~ * {
|
||||
max-width: -webkit-calc(100% - 30px);
|
||||
max-width: calc(100% - 30px);
|
||||
}
|
||||
.list-group .list-group-item .row-content .least-content {
|
||||
|
|
@ -2344,7 +1929,6 @@ legend {
|
|||
}
|
||||
.list-group .list-group-separator:before {
|
||||
content: "";
|
||||
width: -webkit-calc(100% - 90px);
|
||||
width: calc(100% - 90px);
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
||||
float: right;
|
||||
|
|
@ -2392,8 +1976,14 @@ legend {
|
|||
color: #e5e5e5;
|
||||
background-color: transparent;
|
||||
}
|
||||
.navbar .navbar-toggle {
|
||||
border-color: rgba(255, 255, 255, 0.84);
|
||||
.navbar-toggle {
|
||||
margin-top: 13px;
|
||||
}
|
||||
.navbar-default .navbar-toggle {
|
||||
border-color: transparent;
|
||||
}
|
||||
.navbar-inverse .navbar-toggle {
|
||||
border-color: transparent;
|
||||
}
|
||||
.navbar .navbar-toggle:hover,
|
||||
.navbar .navbar-toggle:focus {
|
||||
|
|
@ -2923,20 +2513,14 @@ fieldset[disabled] .navbar .btn-link:focus {
|
|||
border-radius: 2px;
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
|
||||
height: 0;
|
||||
-webkit-transition: -webkit-transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s, padding 0 linear 0.2s, height 0 linear 0.2s;
|
||||
transition: transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s, padding 0 linear 0.2s, height 0 linear 0.2s;
|
||||
-webkit-transform: translateY(200%);
|
||||
-ms-transform: translateY(200%);
|
||||
transform: translateY(200%);
|
||||
}
|
||||
.snackbar.snackbar-opened {
|
||||
padding: 14px 15px;
|
||||
margin-bottom: 20px;
|
||||
height: auto;
|
||||
-webkit-transition: -webkit-transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s;
|
||||
transition: transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s, height 0 linear 0.2s;
|
||||
-webkit-transform: none;
|
||||
-ms-transform: none;
|
||||
transform: none;
|
||||
}
|
||||
.snackbar.toast {
|
||||
|
|
@ -2945,11 +2529,8 @@ fieldset[disabled] .navbar .btn-link:focus {
|
|||
.noUi-target,
|
||||
.noUi-target * {
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-touch-action: none;
|
||||
-ms-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-moz-box-sizing: border-box;
|
||||
user-select: none;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.noUi-base {
|
||||
|
|
@ -2967,9 +2548,7 @@ fieldset[disabled] .navbar .btn-link:focus {
|
|||
.noUi-handle {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
}
|
||||
.noUi-stacking .noUi-handle {
|
||||
z-index: 10;
|
||||
|
|
@ -2978,7 +2557,6 @@ fieldset[disabled] .navbar .btn-link:focus {
|
|||
*z-index: -1;
|
||||
}
|
||||
.noUi-state-tap .noUi-origin {
|
||||
-webkit-transition: left 0.3s, top 0.3s;
|
||||
transition: left 0.3s, top 0.3s;
|
||||
}
|
||||
.noUi-state-drag * {
|
||||
|
|
@ -2988,7 +2566,6 @@ fieldset[disabled] .navbar .btn-link:focus {
|
|||
height: 10px;
|
||||
}
|
||||
.noUi-horizontal .noUi-handle {
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
|
|
@ -3024,7 +2601,6 @@ fieldset[disabled] .navbar .btn-link:focus {
|
|||
.noUi-handle {
|
||||
border-radius: 100%;
|
||||
cursor: default;
|
||||
-webkit-transition: all 0.2s ease-out;
|
||||
transition: all 0.2s ease-out;
|
||||
border: 1px solid;
|
||||
}
|
||||
|
|
@ -3033,8 +2609,6 @@ fieldset[disabled] .navbar .btn-link:focus {
|
|||
margin: 15px 0;
|
||||
}
|
||||
.noUi-horizontal .noUi-handle.noUi-active {
|
||||
-webkit-transform: scale(2.5);
|
||||
-ms-transform: scale(2.5);
|
||||
transform: scale(2.5);
|
||||
}
|
||||
[disabled].noUi-slider {
|
||||
|
|
|
|||
1
css-compiled/material-wfont.min.css
vendored
Normal file
1
css-compiled/material-wfont.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
|
|
@ -1,18 +1,3 @@
|
|||
/* Generated by less 1.7.5 */
|
||||
@-webkit-keyframes input-highlight {
|
||||
0% {
|
||||
left: 20%;
|
||||
width: 20%;
|
||||
}
|
||||
99% {
|
||||
width: 0;
|
||||
left: 0;
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes input-highlight {
|
||||
0% {
|
||||
left: 20%;
|
||||
|
|
@ -400,7 +385,6 @@ body .jumbotron-material-lightgrey,
|
|||
text-transform: uppercase;
|
||||
text-decoration: none;
|
||||
color: rgba(255, 255, 255, 0.84);
|
||||
-webkit-transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
outline: none !important;
|
||||
}
|
||||
|
|
@ -499,7 +483,6 @@ body .jumbotron-material-lightgrey,
|
|||
}
|
||||
.btn-raised {
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
-webkit-transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
}
|
||||
.btn-raised:active:not(.btn-link) {
|
||||
|
|
@ -587,7 +570,6 @@ body .jumbotron-material-lightgrey,
|
|||
border-radius: 4px;
|
||||
margin: 10px 1px;
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
-webkit-transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
}
|
||||
.btn-group:active:not(.btn-link),
|
||||
|
|
@ -601,7 +583,6 @@ body .jumbotron-material-lightgrey,
|
|||
.btn-group.btn-group-raised,
|
||||
.btn-group-vertical.btn-group-raised {
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
-webkit-transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
}
|
||||
.btn-group.btn-group-raised:active:not(.btn-link),
|
||||
|
|
@ -739,8 +720,6 @@ body .jumbotron-material-lightgrey,
|
|||
padding-top: 15px;
|
||||
}
|
||||
.checkbox {
|
||||
-webkit-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
.checkbox label {
|
||||
|
|
@ -752,7 +731,6 @@ body .jumbotron-material-lightgrey,
|
|||
display: block;
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
-webkit-transition-duration: 0.2s;
|
||||
transition-duration: 0.2s;
|
||||
}
|
||||
.checkbox label .check:after {
|
||||
|
|
@ -775,7 +753,6 @@ body .jumbotron-material-lightgrey,
|
|||
border: 2px solid rgba(0, 0, 0, 0.84);
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
-webkit-transition-delay: 0.2s;
|
||||
transition-delay: 0.2s;
|
||||
}
|
||||
.checkbox .check,
|
||||
|
|
@ -859,35 +836,29 @@ body .jumbotron-material-lightgrey,
|
|||
height: 18px;
|
||||
border: solid 2px;
|
||||
border-color: #5a5a5a;
|
||||
-webkit-animation: uncheck 300ms ease-out forwards;
|
||||
-ms-animation: uncheck 300ms ease-out forwards;
|
||||
animation: uncheck 300ms ease-out forwards;
|
||||
}
|
||||
.checkbox input[type=checkbox]:focus ~ .check:after {
|
||||
opacity: 0.2;
|
||||
}
|
||||
.checkbox input[type=checkbox]:checked ~ .check:before {
|
||||
-webkit-animation: check 300ms ease-out forwards;
|
||||
-ms-animation: check 300ms ease-out forwards;
|
||||
animation: check 300ms ease-out forwards;
|
||||
}
|
||||
.checkbox input[type=checkbox]:not(:checked) ~ .check:after {
|
||||
-webkit-animation: rippleOff 500ms;
|
||||
-ms-animation: rippleOff 500ms;
|
||||
animation: rippleOff 500ms;
|
||||
animation: rippleOff 500ms linear forwards;
|
||||
}
|
||||
.checkbox input[type=checkbox]:checked ~ .check:after {
|
||||
-webkit-animation: rippleOn 500ms;
|
||||
-ms-animation: rippleOn 500ms;
|
||||
animation: rippleOn 500ms;
|
||||
animation: rippleOn 500ms linear forwards;
|
||||
}
|
||||
.checkbox:not(:hover) input[type=checkbox] ~ .check:before,
|
||||
.checkbox:not(:hover) input[type=checkbox] ~ .check:after {
|
||||
animation-duration: 1ms;
|
||||
}
|
||||
.checkbox input[type=checkbox][disabled]:not(:checked) ~ .check:before {
|
||||
opacity: 0.5;
|
||||
}
|
||||
.checkbox input[type=checkbox][disabled] ~ .check:after {
|
||||
background-color: rgba(0, 0, 0, 0.84);
|
||||
-webkit-transform: rotate(-45deg);
|
||||
-ms-transform: rotate(-45deg);
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
.checkbox input[type=checkbox]:checked ~ .check:after,
|
||||
|
|
@ -960,86 +931,6 @@ body .jumbotron-material-lightgrey,
|
|||
.checkbox-material-lightgrey input[type=checkbox]:checked ~ .check:after {
|
||||
background-color: #ececec;
|
||||
}
|
||||
@-webkit-keyframes uncheck {
|
||||
0% {
|
||||
top: -3px;
|
||||
left: 17px;
|
||||
width: 10px;
|
||||
height: 21px;
|
||||
border-color: #0f9d58;
|
||||
border-left-color: transparent;
|
||||
border-top-color: transparent;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
50% {
|
||||
top: 14px;
|
||||
left: 17px;
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-color: #0f9d58;
|
||||
border-left-color: transparent;
|
||||
border-top-color: transparent;
|
||||
}
|
||||
51% {
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
border-top-color: #5a5a5a;
|
||||
}
|
||||
100% {
|
||||
top: 1px;
|
||||
left: 12px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
border-top-color: #5a5a5a;
|
||||
}
|
||||
}
|
||||
@-ms-keyframes uncheck {
|
||||
0% {
|
||||
top: -3px;
|
||||
left: 17px;
|
||||
width: 10px;
|
||||
height: 21px;
|
||||
border-color: #0f9d58;
|
||||
border-left-color: transparent;
|
||||
border-top-color: transparent;
|
||||
-ms-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
50% {
|
||||
top: 14px;
|
||||
left: 17px;
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
-ms-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-color: #0f9d58;
|
||||
border-left-color: transparent;
|
||||
border-top-color: transparent;
|
||||
}
|
||||
51% {
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
border-top-color: #5a5a5a;
|
||||
}
|
||||
100% {
|
||||
top: 1px;
|
||||
left: 12px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
border-top-color: #5a5a5a;
|
||||
}
|
||||
}
|
||||
@keyframes uncheck {
|
||||
0% {
|
||||
top: -3px;
|
||||
|
|
@ -1049,7 +940,6 @@ body .jumbotron-material-lightgrey,
|
|||
border-color: #0f9d58;
|
||||
border-left-color: transparent;
|
||||
border-top-color: transparent;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
50% {
|
||||
|
|
@ -1057,7 +947,6 @@ body .jumbotron-material-lightgrey,
|
|||
left: 17px;
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-color: #0f9d58;
|
||||
border-left-color: transparent;
|
||||
|
|
@ -1073,85 +962,6 @@ body .jumbotron-material-lightgrey,
|
|||
left: 12px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
border-top-color: #5a5a5a;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes check {
|
||||
100% {
|
||||
top: -3px;
|
||||
left: 17px;
|
||||
width: 10px;
|
||||
height: 21px;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-color: #0f9d58;
|
||||
border-left-color: transparent;
|
||||
border-top-color: transparent;
|
||||
}
|
||||
51% {
|
||||
border-left: transparent;
|
||||
border-top-color: transparent;
|
||||
}
|
||||
50% {
|
||||
top: 14px;
|
||||
left: 17px;
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
border-top-color: #5a5a5a;
|
||||
}
|
||||
0% {
|
||||
top: 1px;
|
||||
left: 12px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
border-top-color: #5a5a5a;
|
||||
}
|
||||
}
|
||||
@-ms-keyframes check {
|
||||
100% {
|
||||
top: -3px;
|
||||
left: 17px;
|
||||
width: 10px;
|
||||
height: 21px;
|
||||
-ms-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-color: #0f9d58;
|
||||
border-left-color: transparent;
|
||||
border-top-color: transparent;
|
||||
}
|
||||
51% {
|
||||
border-left: transparent;
|
||||
border-top-color: transparent;
|
||||
}
|
||||
50% {
|
||||
top: 14px;
|
||||
left: 17px;
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
-ms-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
border-top-color: #5a5a5a;
|
||||
}
|
||||
0% {
|
||||
top: 1px;
|
||||
left: 12px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
|
|
@ -1164,7 +974,6 @@ body .jumbotron-material-lightgrey,
|
|||
left: 17px;
|
||||
width: 10px;
|
||||
height: 21px;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-color: #0f9d58;
|
||||
border-left-color: transparent;
|
||||
|
|
@ -1179,7 +988,6 @@ body .jumbotron-material-lightgrey,
|
|||
left: 17px;
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
|
|
@ -1190,53 +998,12 @@ body .jumbotron-material-lightgrey,
|
|||
left: 12px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
border-top-color: #5a5a5a;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@-ms-keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
|
|
@ -1247,55 +1014,6 @@ body .jumbotron-material-lightgrey,
|
|||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes rippleOff {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@-ms-keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes rippleOff {
|
||||
0% {
|
||||
|
|
@ -1307,15 +1025,6 @@ body .jumbotron-material-lightgrey,
|
|||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
.form-horizontal .radio {
|
||||
margin-bottom: 10px;
|
||||
|
|
@ -1330,7 +1039,6 @@ body .jumbotron-material-lightgrey,
|
|||
position: absolute;
|
||||
left: 10px;
|
||||
top: 2px;
|
||||
-webkit-transition-duration: 0.2s;
|
||||
transition-duration: 0.2s;
|
||||
}
|
||||
.radio label .circle {
|
||||
|
|
@ -1344,8 +1052,6 @@ body .jumbotron-material-lightgrey,
|
|||
width: 15px;
|
||||
border-radius: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.84);
|
||||
-webkit-transform: scale(0);
|
||||
-ms-transform: scale(0);
|
||||
transform: scale(0);
|
||||
}
|
||||
.radio label .check:after {
|
||||
|
|
@ -1361,18 +1067,12 @@ body .jumbotron-material-lightgrey,
|
|||
z-index: 1;
|
||||
opacity: 0;
|
||||
margin: 0;
|
||||
-webkit-transform: scale(1.5);
|
||||
-ms-transform: scale(1.5);
|
||||
transform: scale(1.5);
|
||||
}
|
||||
.radio label input[type=radio]:not(:checked) ~ .check:after {
|
||||
-webkit-animation: rippleOff 500ms;
|
||||
-ms-animation: rippleOff 500ms;
|
||||
animation: rippleOff 500ms;
|
||||
}
|
||||
.radio label input[type=radio]:checked ~ .check:after {
|
||||
-webkit-animation: rippleOn 500ms;
|
||||
-ms-animation: rippleOn 500ms;
|
||||
animation: rippleOn 500ms;
|
||||
}
|
||||
.radio input[type=radio]:checked ~ .check,
|
||||
|
|
@ -1523,8 +1223,6 @@ body .jumbotron-material-lightgrey,
|
|||
display: none;
|
||||
}
|
||||
.radio input[type=radio]:checked ~ .check {
|
||||
-webkit-transform: scale(0.55);
|
||||
-ms-transform: scale(0.55);
|
||||
transform: scale(0.55);
|
||||
}
|
||||
.radio input[type=radio][disabled] ~ .circle {
|
||||
|
|
@ -1533,46 +1231,6 @@ body .jumbotron-material-lightgrey,
|
|||
.radio input[type=radio][disabled] ~ .check {
|
||||
background-color: rgba(0, 0, 0, 0.84);
|
||||
}
|
||||
@-webkit-keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@-ms-keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
|
|
@ -1583,55 +1241,6 @@ body .jumbotron-material-lightgrey,
|
|||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes rippleOff {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@-ms-keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes rippleOff {
|
||||
0% {
|
||||
|
|
@ -1643,15 +1252,6 @@ body .jumbotron-material-lightgrey,
|
|||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
fieldset[disabled] .form-control,
|
||||
.form-control-wrapper .form-control,
|
||||
|
|
@ -1715,7 +1315,6 @@ select[multiple].form-control.focus {
|
|||
pointer-events: none;
|
||||
left: 0px;
|
||||
top: 5px;
|
||||
-webkit-transition: 0.2s ease all;
|
||||
transition: 0.2s ease all;
|
||||
opacity: 0;
|
||||
}
|
||||
|
|
@ -1749,18 +1348,12 @@ select[multiple].form-control.focus {
|
|||
height: 2px;
|
||||
background-color: #5264ae;
|
||||
bottom: -1px;
|
||||
-webkit-transform: scaleX(0);
|
||||
-ms-transform: scaleX(0);
|
||||
transform: scaleX(0);
|
||||
-webkit-transition: -webkit-transform 0s;
|
||||
transition: transform 0s;
|
||||
}
|
||||
.form-control-wrapper .form-control:focus ~ .material-input:before,
|
||||
.form-control-wrapper .form-control.focus ~ .material-input:before {
|
||||
-webkit-transform: scaleX(1);
|
||||
-ms-transform: scaleX(1);
|
||||
transform: scaleX(1);
|
||||
-webkit-transition: -webkit-transform 0.2s ease-out;
|
||||
transition: transform 0.2s ease-out;
|
||||
}
|
||||
.form-control-wrapper .material-input:after {
|
||||
|
|
@ -1773,8 +1366,6 @@ select[multiple].form-control.focus {
|
|||
left: 0;
|
||||
pointer-events: none;
|
||||
opacity: 0.9;
|
||||
-webkit-transform-origin: left;
|
||||
-ms-transform-origin: left;
|
||||
transform-origin: left;
|
||||
}
|
||||
.form-control-wrapper .input-lg ~ .material-input:after {
|
||||
|
|
@ -1788,9 +1379,7 @@ select[multiple].form-control.focus {
|
|||
}
|
||||
.form-control-wrapper .form-control:focus ~ .material-input:after,
|
||||
.form-control-wrapper .form-control.focus ~ .material-input:after {
|
||||
-webkit-animation: input-highlight 0.3s ease;
|
||||
animation: input-highlight 0.3s ease;
|
||||
-webkit-animation-fill-mode: forwards;
|
||||
animation-fill-mode: forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
|
@ -2211,11 +1800,9 @@ select.form-control.focus {
|
|||
@keyframes input-highlight {
|
||||
0% {
|
||||
left: 20%;
|
||||
-webkit-transform: scaleX(20%);
|
||||
transform: scaleX(20%);
|
||||
}
|
||||
99% {
|
||||
-webkit-transform: scaleX(0);
|
||||
transform: scaleX(0);
|
||||
left: 0;
|
||||
opacity: 1;
|
||||
|
|
@ -2305,7 +1892,6 @@ legend {
|
|||
}
|
||||
.list-group .list-group-item .row-content {
|
||||
display: inline-block;
|
||||
width: -webkit-calc(100% - 92px);
|
||||
width: calc(100% - 92px);
|
||||
min-height: 66px;
|
||||
}
|
||||
|
|
@ -2320,7 +1906,6 @@ legend {
|
|||
cursor: pointer;
|
||||
}
|
||||
.list-group .list-group-item .row-content .action-secondary ~ * {
|
||||
max-width: -webkit-calc(100% - 30px);
|
||||
max-width: calc(100% - 30px);
|
||||
}
|
||||
.list-group .list-group-item .row-content .least-content {
|
||||
|
|
@ -2343,7 +1928,6 @@ legend {
|
|||
}
|
||||
.list-group .list-group-separator:before {
|
||||
content: "";
|
||||
width: -webkit-calc(100% - 90px);
|
||||
width: calc(100% - 90px);
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
||||
float: right;
|
||||
|
|
@ -2391,8 +1975,14 @@ legend {
|
|||
color: #e5e5e5;
|
||||
background-color: transparent;
|
||||
}
|
||||
.navbar .navbar-toggle {
|
||||
border-color: rgba(255, 255, 255, 0.84);
|
||||
.navbar-toggle {
|
||||
margin-top: 13px;
|
||||
}
|
||||
.navbar-default .navbar-toggle {
|
||||
border-color: transparent;
|
||||
}
|
||||
.navbar-inverse .navbar-toggle {
|
||||
border-color: transparent;
|
||||
}
|
||||
.navbar .navbar-toggle:hover,
|
||||
.navbar .navbar-toggle:focus {
|
||||
|
|
@ -2922,20 +2512,14 @@ fieldset[disabled] .navbar .btn-link:focus {
|
|||
border-radius: 2px;
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
|
||||
height: 0;
|
||||
-webkit-transition: -webkit-transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s, padding 0 linear 0.2s, height 0 linear 0.2s;
|
||||
transition: transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s, padding 0 linear 0.2s, height 0 linear 0.2s;
|
||||
-webkit-transform: translateY(200%);
|
||||
-ms-transform: translateY(200%);
|
||||
transform: translateY(200%);
|
||||
}
|
||||
.snackbar.snackbar-opened {
|
||||
padding: 14px 15px;
|
||||
margin-bottom: 20px;
|
||||
height: auto;
|
||||
-webkit-transition: -webkit-transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s;
|
||||
transition: transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s, height 0 linear 0.2s;
|
||||
-webkit-transform: none;
|
||||
-ms-transform: none;
|
||||
transform: none;
|
||||
}
|
||||
.snackbar.toast {
|
||||
|
|
@ -2944,11 +2528,8 @@ fieldset[disabled] .navbar .btn-link:focus {
|
|||
.noUi-target,
|
||||
.noUi-target * {
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-touch-action: none;
|
||||
-ms-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-moz-box-sizing: border-box;
|
||||
user-select: none;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.noUi-base {
|
||||
|
|
@ -2966,9 +2547,7 @@ fieldset[disabled] .navbar .btn-link:focus {
|
|||
.noUi-handle {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
}
|
||||
.noUi-stacking .noUi-handle {
|
||||
z-index: 10;
|
||||
|
|
@ -2977,7 +2556,6 @@ fieldset[disabled] .navbar .btn-link:focus {
|
|||
*z-index: -1;
|
||||
}
|
||||
.noUi-state-tap .noUi-origin {
|
||||
-webkit-transition: left 0.3s, top 0.3s;
|
||||
transition: left 0.3s, top 0.3s;
|
||||
}
|
||||
.noUi-state-drag * {
|
||||
|
|
@ -2987,7 +2565,6 @@ fieldset[disabled] .navbar .btn-link:focus {
|
|||
height: 10px;
|
||||
}
|
||||
.noUi-horizontal .noUi-handle {
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
|
|
@ -3023,7 +2600,6 @@ fieldset[disabled] .navbar .btn-link:focus {
|
|||
.noUi-handle {
|
||||
border-radius: 100%;
|
||||
cursor: default;
|
||||
-webkit-transition: all 0.2s ease-out;
|
||||
transition: all 0.2s ease-out;
|
||||
border: 1px solid;
|
||||
}
|
||||
|
|
@ -3032,8 +2608,6 @@ fieldset[disabled] .navbar .btn-link:focus {
|
|||
margin: 15px 0;
|
||||
}
|
||||
.noUi-horizontal .noUi-handle.noUi-active {
|
||||
-webkit-transform: scale(2.5);
|
||||
-ms-transform: scale(2.5);
|
||||
transform: scale(2.5);
|
||||
}
|
||||
[disabled].noUi-slider {
|
||||
|
|
|
|||
1
css-compiled/material.min.css
vendored
Normal file
1
css-compiled/material.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
|
|
@ -1,4 +1,3 @@
|
|||
/* Generated by less 1.7.5 */
|
||||
.withripple {
|
||||
position: relative;
|
||||
}
|
||||
|
|
@ -20,22 +19,16 @@
|
|||
margin-top: -10px;
|
||||
border-radius: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.05);
|
||||
-webkit-transform: scale(1);
|
||||
-ms-transform: scale(1);
|
||||
transform: scale(1);
|
||||
-webkit-transform-origin: 50%;
|
||||
-ms-transform-origin: 50%;
|
||||
transform-origin: 50%;
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
.ripple.ripple-on {
|
||||
-webkit-transition: opacity 0.15s ease-in 0s, -webkit-transform 0.5s cubic-bezier(0.4, 0, 0.2, 1) 0.1s;
|
||||
transition: opacity 0.15s ease-in 0s, transform 0.5s cubic-bezier(0.4, 0, 0.2, 1) 0.1s;
|
||||
opacity: 1;
|
||||
}
|
||||
.ripple.ripple-out {
|
||||
-webkit-transition: opacity 0.1s linear 0s !important;
|
||||
transition: opacity 0.1s linear 0s !important;
|
||||
opacity: 0;
|
||||
}
|
||||
|
|
|
|||
1
css-compiled/ripples.min.css
vendored
Normal file
1
css-compiled/ripples.min.css
vendored
Normal file
|
|
@ -0,0 +1 @@
|
|||
.withripple{position:relative}.ripple-wrapper{position:absolute;top:0;left:0;z-index:1;width:100%;height:100%;overflow:hidden;border-radius:2px}.ripple{position:absolute;width:20px;height:20px;margin-left:-10px;margin-top:-10px;border-radius:100%;background-color:rgba(0,0,0,.05);-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1);-webkit-transform-origin:50%;-ms-transform-origin:50%;transform-origin:50%;opacity:0;pointer-events:none}.ripple.ripple-on{-webkit-transition:opacity .15s ease-in 0s,-webkit-transform .5s cubic-bezier(0.4,0,.2,1) .1s;transition:opacity .15s ease-in 0s,transform .5s cubic-bezier(0.4,0,.2,1) .1s;opacity:1}.ripple.ripple-out{-webkit-transition:opacity .1s linear 0s!important;transition:opacity .1s linear 0s!important;opacity:0}
|
||||
61
gruntfile.js
Normal file
61
gruntfile.js
Normal file
|
|
@ -0,0 +1,61 @@
|
|||
module.exports = function(grunt) {
|
||||
|
||||
"use strict";
|
||||
|
||||
grunt.initConfig({
|
||||
|
||||
less: {
|
||||
production: {
|
||||
options: {
|
||||
paths: ["less"]
|
||||
},
|
||||
files: {
|
||||
"css-compiled/material.css": "less/material.less",
|
||||
"css-compiled/material-wfont.css": "less/material-wfont.less",
|
||||
"css-compiled/ripples.css": "less/ripples.less"
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
autoprefixer: {
|
||||
options: {
|
||||
browsers: ["last 3 versions", "ie 8", "ie 9", "ie 10", "ie 11"]
|
||||
},
|
||||
dist: {
|
||||
files: {
|
||||
"css-compiled/material.css": "css-compiled/material.css",
|
||||
"css-compiled/material-wfont.css": "css-compiled/material-wfont.css",
|
||||
"css-compiled/ripples.css": "css-compiled/ripples.css"
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
cssmin: {
|
||||
minify: {
|
||||
expand: true,
|
||||
cwd: "css-compiled/",
|
||||
src: ["*.css", "!*.min.css"],
|
||||
dest: "css-compiled/",
|
||||
ext: ".min.css"
|
||||
}
|
||||
},
|
||||
|
||||
copy: {
|
||||
css: {
|
||||
src: "css-compiled/*.min.css",
|
||||
dest: "template/material/"
|
||||
},
|
||||
js: {
|
||||
src: "scripts/*.js",
|
||||
dest: "template/material/"
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
grunt.loadNpmTasks("grunt-contrib-less");
|
||||
grunt.loadNpmTasks("grunt-autoprefixer");
|
||||
grunt.loadNpmTasks("grunt-contrib-cssmin");
|
||||
grunt.loadNpmTasks("grunt-contrib-copy");
|
||||
grunt.registerTask("default", ["less", "autoprefixer", "cssmin", "copy"]);
|
||||
};
|
||||
|
|
@ -1,33 +1,5 @@
|
|||
// main: material.less
|
||||
|
||||
@-webkit-keyframes input-highlight {
|
||||
0% {
|
||||
left: 20%;
|
||||
width: 20%;
|
||||
}
|
||||
99% {
|
||||
width: 0;
|
||||
left: 0;
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@-moz-keyframes input-highlight {
|
||||
0% {
|
||||
left: 20%;
|
||||
width: 20%;
|
||||
}
|
||||
99% {
|
||||
width: 0;
|
||||
left: 0;
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes input-highlight {
|
||||
0% {
|
||||
left: 20%;
|
||||
|
|
|
|||
|
|
@ -35,7 +35,7 @@
|
|||
border: 2px solid @lightbg-text;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
.transition-delay(0.2s);
|
||||
transition-delay: 0.2s;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -53,7 +53,7 @@
|
|||
height: 18px;
|
||||
border: solid 2px;
|
||||
border-color: #5a5a5a;
|
||||
.animation(uncheck 300ms ease-out forwards);
|
||||
animation: uncheck 300ms ease-out forwards;
|
||||
}
|
||||
|
||||
input[type=checkbox]:focus ~ .check:after {
|
||||
|
|
@ -61,21 +61,21 @@
|
|||
}
|
||||
|
||||
input[type=checkbox]:checked ~ .check:before {
|
||||
.animation(check 300ms ease-out forwards);
|
||||
animation: check 300ms ease-out forwards;
|
||||
}
|
||||
|
||||
// Ripple effect on click
|
||||
input[type=checkbox]:not(:checked) ~ .check:after {
|
||||
.animation(rippleOff 500ms linear forwards);
|
||||
animation: rippleOff 500ms linear forwards;
|
||||
}
|
||||
input[type=checkbox]:checked ~ .check:after {
|
||||
.animation(rippleOn 500ms linear forwards);
|
||||
animation: rippleOn 500ms linear forwards;
|
||||
}
|
||||
|
||||
// Make animate quickly when not hover
|
||||
&:not(:hover) input[type=checkbox] ~ .check {
|
||||
&:before, &:after {
|
||||
.animation-duration(1ms);
|
||||
animation-duration: 1ms;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -91,8 +91,7 @@
|
|||
.variations(~" input[type=checkbox]:checked ~ .check:after", background-color, @success);
|
||||
}
|
||||
|
||||
|
||||
.keyframe-uncheck() {
|
||||
@keyframes uncheck {
|
||||
0% {
|
||||
top: -3px;
|
||||
left: 17px;
|
||||
|
|
@ -130,7 +129,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
.keyframe-check() {
|
||||
@keyframes check {
|
||||
100% {
|
||||
top: -3px;
|
||||
left: 17px;
|
||||
|
|
@ -166,19 +165,8 @@
|
|||
border-top-color: #5a5a5a;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes uncheck {.keyframe-uncheck()}
|
||||
@-moz-keyframes uncheck {.keyframe-uncheck()}
|
||||
@-ms-keyframes uncheck {.keyframe-uncheck()}
|
||||
@-o-keyframes uncheck {.keyframe-uncheck()}
|
||||
@keyframes uncheck {.keyframe-uncheck()}
|
||||
|
||||
@-webkit-keyframes check {.keyframe-check()}
|
||||
@-moz-keyframes check {.keyframe-check()}
|
||||
@-ms-keyframes check {.keyframe-check()}
|
||||
@-o-keyframes check {.keyframe-check()}
|
||||
@keyframes check {.keyframe-check()}
|
||||
|
||||
.ripple() {
|
||||
@keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
|
@ -190,14 +178,14 @@
|
|||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes rippleOn {.ripple()}
|
||||
@-moz-keyframes rippleOn {.ripple()}
|
||||
@-ms-keyframes rippleOn {.ripple()}
|
||||
@-o-keyframes rippleOn {.ripple()}
|
||||
@keyframes rippleOn {.ripple()}
|
||||
|
||||
@-webkit-keyframes rippleOff {.ripple()}
|
||||
@-moz-keyframes rippleOff {.ripple()}
|
||||
@-ms-keyframes rippleOn {.ripple()}
|
||||
@-o-keyframes rippleOff {.ripple()}
|
||||
@keyframes rippleOff {.ripple()}
|
||||
@keyframes rippleOff {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -99,9 +99,7 @@ select[multiple].form-control {
|
|||
|
||||
/* active state */
|
||||
.form-control:focus ~ .material-input:after, .form-control.focus ~ .material-input:after {
|
||||
-webkit-animation: input-highlight 0.3s ease;
|
||||
animation: input-highlight 0.3s ease;
|
||||
-webkit-animation-fill-mode: forwards;
|
||||
animation-fill-mode: forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,2 @@
|
|||
// out: ../css-compiled/material-wfont.css
|
||||
@import url(//fonts.googleapis.com/css?family=Roboto+Condensed:300italic,400italic,700italic,400,700,300|Roboto:400,100,100italic,300,300italic,400italic,500,500italic,700,700italic);
|
||||
@import "material.less";
|
||||
|
|
|
|||
|
|
@ -1,18 +1,4 @@
|
|||
/* Generated by less 1.7.5 */
|
||||
@-webkit-keyframes input-highlight {
|
||||
0% {
|
||||
left: 20%;
|
||||
width: 20%;
|
||||
}
|
||||
99% {
|
||||
width: 0;
|
||||
left: 0;
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes input-highlight {
|
||||
0% {
|
||||
left: 20%;
|
||||
|
|
@ -400,7 +386,6 @@ body .jumbotron-material-lightgrey,
|
|||
text-transform: uppercase;
|
||||
text-decoration: none;
|
||||
color: rgba(255, 255, 255, 0.84);
|
||||
-webkit-transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
outline: none !important;
|
||||
}
|
||||
|
|
@ -499,7 +484,6 @@ body .jumbotron-material-lightgrey,
|
|||
}
|
||||
.btn-raised {
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
-webkit-transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
}
|
||||
.btn-raised:active:not(.btn-link) {
|
||||
|
|
@ -587,7 +571,6 @@ body .jumbotron-material-lightgrey,
|
|||
border-radius: 4px;
|
||||
margin: 10px 1px;
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
-webkit-transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
}
|
||||
.btn-group:active:not(.btn-link),
|
||||
|
|
@ -601,7 +584,6 @@ body .jumbotron-material-lightgrey,
|
|||
.btn-group.btn-group-raised,
|
||||
.btn-group-vertical.btn-group-raised {
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
-webkit-transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
}
|
||||
.btn-group.btn-group-raised:active:not(.btn-link),
|
||||
|
|
@ -739,8 +721,6 @@ body .jumbotron-material-lightgrey,
|
|||
padding-top: 15px;
|
||||
}
|
||||
.checkbox {
|
||||
-webkit-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
.checkbox label {
|
||||
|
|
@ -752,7 +732,6 @@ body .jumbotron-material-lightgrey,
|
|||
display: block;
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
-webkit-transition-duration: 0.2s;
|
||||
transition-duration: 0.2s;
|
||||
}
|
||||
.checkbox label .check:after {
|
||||
|
|
@ -775,7 +754,6 @@ body .jumbotron-material-lightgrey,
|
|||
border: 2px solid rgba(0, 0, 0, 0.84);
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
-webkit-transition-delay: 0.2s;
|
||||
transition-delay: 0.2s;
|
||||
}
|
||||
.checkbox .check,
|
||||
|
|
@ -859,35 +837,29 @@ body .jumbotron-material-lightgrey,
|
|||
height: 18px;
|
||||
border: solid 2px;
|
||||
border-color: #5a5a5a;
|
||||
-webkit-animation: uncheck 300ms ease-out forwards;
|
||||
-ms-animation: uncheck 300ms ease-out forwards;
|
||||
animation: uncheck 300ms ease-out forwards;
|
||||
}
|
||||
.checkbox input[type=checkbox]:focus ~ .check:after {
|
||||
opacity: 0.2;
|
||||
}
|
||||
.checkbox input[type=checkbox]:checked ~ .check:before {
|
||||
-webkit-animation: check 300ms ease-out forwards;
|
||||
-ms-animation: check 300ms ease-out forwards;
|
||||
animation: check 300ms ease-out forwards;
|
||||
}
|
||||
.checkbox input[type=checkbox]:not(:checked) ~ .check:after {
|
||||
-webkit-animation: rippleOff 500ms;
|
||||
-ms-animation: rippleOff 500ms;
|
||||
animation: rippleOff 500ms;
|
||||
animation: rippleOff 500ms linear forwards;
|
||||
}
|
||||
.checkbox input[type=checkbox]:checked ~ .check:after {
|
||||
-webkit-animation: rippleOn 500ms;
|
||||
-ms-animation: rippleOn 500ms;
|
||||
animation: rippleOn 500ms;
|
||||
animation: rippleOn 500ms linear forwards;
|
||||
}
|
||||
.checkbox:not(:hover) input[type=checkbox] ~ .check:before,
|
||||
.checkbox:not(:hover) input[type=checkbox] ~ .check:after {
|
||||
animation-duration: 1ms;
|
||||
}
|
||||
.checkbox input[type=checkbox][disabled]:not(:checked) ~ .check:before {
|
||||
opacity: 0.5;
|
||||
}
|
||||
.checkbox input[type=checkbox][disabled] ~ .check:after {
|
||||
background-color: rgba(0, 0, 0, 0.84);
|
||||
-webkit-transform: rotate(-45deg);
|
||||
-ms-transform: rotate(-45deg);
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
.checkbox input[type=checkbox]:checked ~ .check:after,
|
||||
|
|
@ -960,7 +932,7 @@ body .jumbotron-material-lightgrey,
|
|||
.checkbox-material-lightgrey input[type=checkbox]:checked ~ .check:after {
|
||||
background-color: #ececec;
|
||||
}
|
||||
@-webkit-keyframes uncheck {
|
||||
@keyframes uncheck {
|
||||
0% {
|
||||
top: -3px;
|
||||
left: 17px;
|
||||
|
|
@ -969,7 +941,6 @@ body .jumbotron-material-lightgrey,
|
|||
border-color: #0f9d58;
|
||||
border-left-color: transparent;
|
||||
border-top-color: transparent;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
50% {
|
||||
|
|
@ -977,7 +948,6 @@ body .jumbotron-material-lightgrey,
|
|||
left: 17px;
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-color: #0f9d58;
|
||||
border-left-color: transparent;
|
||||
|
|
@ -993,85 +963,6 @@ body .jumbotron-material-lightgrey,
|
|||
left: 12px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
border-top-color: #5a5a5a;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes check {
|
||||
100% {
|
||||
top: -3px;
|
||||
left: 17px;
|
||||
width: 10px;
|
||||
height: 21px;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-color: #0f9d58;
|
||||
border-left-color: transparent;
|
||||
border-top-color: transparent;
|
||||
}
|
||||
51% {
|
||||
border-left: transparent;
|
||||
border-top-color: transparent;
|
||||
}
|
||||
50% {
|
||||
top: 14px;
|
||||
left: 17px;
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
border-top-color: #5a5a5a;
|
||||
}
|
||||
0% {
|
||||
top: 1px;
|
||||
left: 12px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
border-top-color: #5a5a5a;
|
||||
}
|
||||
}
|
||||
@-ms-keyframes check {
|
||||
100% {
|
||||
top: -3px;
|
||||
left: 17px;
|
||||
width: 10px;
|
||||
height: 21px;
|
||||
-ms-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-color: #0f9d58;
|
||||
border-left-color: transparent;
|
||||
border-top-color: transparent;
|
||||
}
|
||||
51% {
|
||||
border-left: transparent;
|
||||
border-top-color: transparent;
|
||||
}
|
||||
50% {
|
||||
top: 14px;
|
||||
left: 17px;
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
-ms-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
border-top-color: #5a5a5a;
|
||||
}
|
||||
0% {
|
||||
top: 1px;
|
||||
left: 12px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
|
|
@ -1084,7 +975,6 @@ body .jumbotron-material-lightgrey,
|
|||
left: 17px;
|
||||
width: 10px;
|
||||
height: 21px;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-color: #0f9d58;
|
||||
border-left-color: transparent;
|
||||
|
|
@ -1099,7 +989,6 @@ body .jumbotron-material-lightgrey,
|
|||
left: 17px;
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
|
|
@ -1110,53 +999,12 @@ body .jumbotron-material-lightgrey,
|
|||
left: 12px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
border-color: #5a5a5a;
|
||||
border-left-color: #5a5a5a;
|
||||
border-top-color: #5a5a5a;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@-ms-keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
|
|
@ -1167,55 +1015,6 @@ body .jumbotron-material-lightgrey,
|
|||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes rippleOff {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@-ms-keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes rippleOff {
|
||||
0% {
|
||||
|
|
@ -1227,15 +1026,6 @@ body .jumbotron-material-lightgrey,
|
|||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
.form-horizontal .radio {
|
||||
margin-bottom: 10px;
|
||||
|
|
@ -1250,7 +1040,6 @@ body .jumbotron-material-lightgrey,
|
|||
position: absolute;
|
||||
left: 10px;
|
||||
top: 2px;
|
||||
-webkit-transition-duration: 0.2s;
|
||||
transition-duration: 0.2s;
|
||||
}
|
||||
.radio label .circle {
|
||||
|
|
@ -1264,8 +1053,6 @@ body .jumbotron-material-lightgrey,
|
|||
width: 15px;
|
||||
border-radius: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.84);
|
||||
-webkit-transform: scale(0);
|
||||
-ms-transform: scale(0);
|
||||
transform: scale(0);
|
||||
}
|
||||
.radio label .check:after {
|
||||
|
|
@ -1281,18 +1068,12 @@ body .jumbotron-material-lightgrey,
|
|||
z-index: 1;
|
||||
opacity: 0;
|
||||
margin: 0;
|
||||
-webkit-transform: scale(1.5);
|
||||
-ms-transform: scale(1.5);
|
||||
transform: scale(1.5);
|
||||
}
|
||||
.radio label input[type=radio]:not(:checked) ~ .check:after {
|
||||
-webkit-animation: rippleOff 500ms;
|
||||
-ms-animation: rippleOff 500ms;
|
||||
animation: rippleOff 500ms;
|
||||
}
|
||||
.radio label input[type=radio]:checked ~ .check:after {
|
||||
-webkit-animation: rippleOn 500ms;
|
||||
-ms-animation: rippleOn 500ms;
|
||||
animation: rippleOn 500ms;
|
||||
}
|
||||
.radio input[type=radio]:checked ~ .check,
|
||||
|
|
@ -1443,8 +1224,6 @@ body .jumbotron-material-lightgrey,
|
|||
display: none;
|
||||
}
|
||||
.radio input[type=radio]:checked ~ .check {
|
||||
-webkit-transform: scale(0.55);
|
||||
-ms-transform: scale(0.55);
|
||||
transform: scale(0.55);
|
||||
}
|
||||
.radio input[type=radio][disabled] ~ .circle {
|
||||
|
|
@ -1453,46 +1232,6 @@ body .jumbotron-material-lightgrey,
|
|||
.radio input[type=radio][disabled] ~ .check {
|
||||
background-color: rgba(0, 0, 0, 0.84);
|
||||
}
|
||||
@-webkit-keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@-ms-keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
|
|
@ -1503,55 +1242,6 @@ body .jumbotron-material-lightgrey,
|
|||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes rippleOff {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@-ms-keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes rippleOff {
|
||||
0% {
|
||||
|
|
@ -1563,15 +1253,6 @@ body .jumbotron-material-lightgrey,
|
|||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
fieldset[disabled] .form-control,
|
||||
.form-control-wrapper .form-control,
|
||||
|
|
@ -1635,7 +1316,6 @@ select[multiple].form-control.focus {
|
|||
pointer-events: none;
|
||||
left: 0px;
|
||||
top: 5px;
|
||||
-webkit-transition: 0.2s ease all;
|
||||
transition: 0.2s ease all;
|
||||
opacity: 0;
|
||||
}
|
||||
|
|
@ -1669,18 +1349,12 @@ select[multiple].form-control.focus {
|
|||
height: 2px;
|
||||
background-color: #5264ae;
|
||||
bottom: -1px;
|
||||
-webkit-transform: scaleX(0);
|
||||
-ms-transform: scaleX(0);
|
||||
transform: scaleX(0);
|
||||
-webkit-transition: -webkit-transform 0s;
|
||||
transition: transform 0s;
|
||||
}
|
||||
.form-control-wrapper .form-control:focus ~ .material-input:before,
|
||||
.form-control-wrapper .form-control.focus ~ .material-input:before {
|
||||
-webkit-transform: scaleX(1);
|
||||
-ms-transform: scaleX(1);
|
||||
transform: scaleX(1);
|
||||
-webkit-transition: -webkit-transform 0.2s ease-out;
|
||||
transition: transform 0.2s ease-out;
|
||||
}
|
||||
.form-control-wrapper .material-input:after {
|
||||
|
|
@ -1693,8 +1367,6 @@ select[multiple].form-control.focus {
|
|||
left: 0;
|
||||
pointer-events: none;
|
||||
opacity: 0.9;
|
||||
-webkit-transform-origin: left;
|
||||
-ms-transform-origin: left;
|
||||
transform-origin: left;
|
||||
}
|
||||
.form-control-wrapper .input-lg ~ .material-input:after {
|
||||
|
|
@ -1708,9 +1380,7 @@ select[multiple].form-control.focus {
|
|||
}
|
||||
.form-control-wrapper .form-control:focus ~ .material-input:after,
|
||||
.form-control-wrapper .form-control.focus ~ .material-input:after {
|
||||
-webkit-animation: input-highlight 0.3s ease;
|
||||
animation: input-highlight 0.3s ease;
|
||||
-webkit-animation-fill-mode: forwards;
|
||||
animation-fill-mode: forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
|
@ -2131,11 +1801,9 @@ select.form-control.focus {
|
|||
@keyframes input-highlight {
|
||||
0% {
|
||||
left: 20%;
|
||||
-webkit-transform: scaleX(20%);
|
||||
transform: scaleX(20%);
|
||||
}
|
||||
99% {
|
||||
-webkit-transform: scaleX(0);
|
||||
transform: scaleX(0);
|
||||
left: 0;
|
||||
opacity: 1;
|
||||
|
|
@ -2225,7 +1893,6 @@ legend {
|
|||
}
|
||||
.list-group .list-group-item .row-content {
|
||||
display: inline-block;
|
||||
width: -webkit-calc(100% - 92px);
|
||||
width: calc(100% - 92px);
|
||||
min-height: 66px;
|
||||
}
|
||||
|
|
@ -2240,7 +1907,6 @@ legend {
|
|||
cursor: pointer;
|
||||
}
|
||||
.list-group .list-group-item .row-content .action-secondary ~ * {
|
||||
max-width: -webkit-calc(100% - 30px);
|
||||
max-width: calc(100% - 30px);
|
||||
}
|
||||
.list-group .list-group-item .row-content .least-content {
|
||||
|
|
@ -2263,7 +1929,6 @@ legend {
|
|||
}
|
||||
.list-group .list-group-separator:before {
|
||||
content: "";
|
||||
width: -webkit-calc(100% - 90px);
|
||||
width: calc(100% - 90px);
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
||||
float: right;
|
||||
|
|
@ -2842,20 +2507,14 @@ fieldset[disabled] .navbar .btn-link:focus {
|
|||
border-radius: 2px;
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
|
||||
height: 0;
|
||||
-webkit-transition: -webkit-transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s, padding 0 linear 0.2s, height 0 linear 0.2s;
|
||||
transition: transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s, padding 0 linear 0.2s, height 0 linear 0.2s;
|
||||
-webkit-transform: translateY(200%);
|
||||
-ms-transform: translateY(200%);
|
||||
transform: translateY(200%);
|
||||
}
|
||||
.snackbar.snackbar-opened {
|
||||
padding: 14px 15px;
|
||||
margin-bottom: 20px;
|
||||
height: auto;
|
||||
-webkit-transition: -webkit-transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s;
|
||||
transition: transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s, height 0 linear 0.2s;
|
||||
-webkit-transform: none;
|
||||
-ms-transform: none;
|
||||
transform: none;
|
||||
}
|
||||
.snackbar.toast {
|
||||
|
|
@ -2864,11 +2523,8 @@ fieldset[disabled] .navbar .btn-link:focus {
|
|||
.noUi-target,
|
||||
.noUi-target * {
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-touch-action: none;
|
||||
-ms-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-moz-box-sizing: border-box;
|
||||
user-select: none;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.noUi-base {
|
||||
|
|
@ -2886,9 +2542,7 @@ fieldset[disabled] .navbar .btn-link:focus {
|
|||
.noUi-handle {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
}
|
||||
.noUi-stacking .noUi-handle {
|
||||
z-index: 10;
|
||||
|
|
@ -2897,7 +2551,6 @@ fieldset[disabled] .navbar .btn-link:focus {
|
|||
*z-index: -1;
|
||||
}
|
||||
.noUi-state-tap .noUi-origin {
|
||||
-webkit-transition: left 0.3s, top 0.3s;
|
||||
transition: left 0.3s, top 0.3s;
|
||||
}
|
||||
.noUi-state-drag * {
|
||||
|
|
@ -2907,7 +2560,6 @@ fieldset[disabled] .navbar .btn-link:focus {
|
|||
height: 10px;
|
||||
}
|
||||
.noUi-horizontal .noUi-handle {
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
|
|
@ -2943,7 +2595,6 @@ fieldset[disabled] .navbar .btn-link:focus {
|
|||
.noUi-handle {
|
||||
border-radius: 100%;
|
||||
cursor: default;
|
||||
-webkit-transition: all 0.2s ease-out;
|
||||
transition: all 0.2s ease-out;
|
||||
border: 1px solid;
|
||||
}
|
||||
|
|
@ -2952,8 +2603,6 @@ fieldset[disabled] .navbar .btn-link:focus {
|
|||
margin: 15px 0;
|
||||
}
|
||||
.noUi-horizontal .noUi-handle.noUi-active {
|
||||
-webkit-transform: scale(2.5);
|
||||
-ms-transform: scale(2.5);
|
||||
transform: scale(2.5);
|
||||
}
|
||||
[disabled].noUi-slider {
|
||||
|
|
@ -1,10 +1,8 @@
|
|||
// out: ../css-compiled/material.css
|
||||
// Material Theme 0.0.1
|
||||
// -----------------------------------------------------
|
||||
|
||||
@import "variables.less";
|
||||
@import "mixins.less";
|
||||
@import "prefixer.less";
|
||||
@import "animations.less";
|
||||
@import "shadows.less";
|
||||
|
||||
|
|
|
|||
|
|
@ -55,7 +55,8 @@
|
|||
|
||||
// Darken the responsive nav toggle
|
||||
.navbar-toggle {
|
||||
border-color: @navbar-toggle-border-color;
|
||||
margin-top: 13px;
|
||||
border-color: transparent;
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: @navbar-toggle-hover-bg;
|
||||
|
|
@ -65,6 +66,11 @@
|
|||
}
|
||||
}
|
||||
|
||||
.navbar-default .navbar-toggle,
|
||||
.navbar-inverse .navbar-toggle {
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.navbar-collapse,
|
||||
.navbar-form {
|
||||
border-color: rgba(0,0,0,0.1);
|
||||
|
|
|
|||
|
|
@ -2,11 +2,8 @@
|
|||
.noUi-target,
|
||||
.noUi-target * {
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-touch-action: none;
|
||||
-ms-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-moz-box-sizing: border-box;
|
||||
user-select: none;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.noUi-base {
|
||||
|
|
@ -25,7 +22,6 @@
|
|||
position: relative;
|
||||
z-index: 1;
|
||||
box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
}
|
||||
.noUi-stacking .noUi-handle {
|
||||
z-index: 10;
|
||||
|
|
@ -34,7 +30,6 @@
|
|||
*z-index: -1;
|
||||
}
|
||||
.noUi-state-tap .noUi-origin {
|
||||
-webkit-transition: left 0.3s, top 0.3s;
|
||||
transition: left 0.3s, top 0.3s;
|
||||
}
|
||||
.noUi-state-drag * {
|
||||
|
|
|
|||
|
|
@ -13,11 +13,7 @@
|
|||
|
||||
// Animation
|
||||
height: 0;
|
||||
-moz-transition: -moz-transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s, padding 0 linear 0.2s, height 0 linear 0.2s;
|
||||
-webkit-transition: -webkit-transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s, padding 0 linear 0.2s, height 0 linear 0.2s;
|
||||
transition: transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s, padding 0 linear 0.2s, height 0 linear 0.2s;
|
||||
-moz-transform: translateY(200%);
|
||||
-webkit-transform: translateY(200%);
|
||||
transform: translateY(200%);
|
||||
}
|
||||
|
||||
|
|
@ -28,11 +24,7 @@
|
|||
|
||||
// Animation
|
||||
height: auto;
|
||||
-moz-transition: -moz-transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s;
|
||||
-webkit-transition: -webkit-transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s;
|
||||
transition: transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s, height 0 linear 0.2s;
|
||||
-moz-transform: none;
|
||||
-webkit-transform: none;
|
||||
transform: none;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,372 +0,0 @@
|
|||
// main: material
|
||||
|
||||
//---------------------------------------------------
|
||||
// LESS Prefixer
|
||||
//---------------------------------------------------
|
||||
//
|
||||
// All of the CSS3 fun, none of the prefixes!
|
||||
//
|
||||
// As a rule, you can use the CSS properties you
|
||||
// would expect just by adding a '.':
|
||||
//
|
||||
// box-shadow => .box-shadow(@args)
|
||||
//
|
||||
// Also, when shorthand is available, arguments are
|
||||
// not parameterized. Learn CSS, not LESS Prefixer.
|
||||
//
|
||||
// -------------------------------------------------
|
||||
// TABLE OF CONTENTS
|
||||
// (*) denotes a syntax-sugar helper
|
||||
// -------------------------------------------------
|
||||
//
|
||||
// .animation(@args)
|
||||
// .animation-delay(@delay)
|
||||
// .animation-direction(@direction)
|
||||
// .animation-duration(@duration)
|
||||
// .animation-fill-mode(@mode)
|
||||
// .animation-iteration-count(@count)
|
||||
// .animation-name(@name)
|
||||
// .animation-play-state(@state)
|
||||
// .animation-timing-function(@function)
|
||||
// .background-size(@args)
|
||||
// .border-radius(@args)
|
||||
// .box-shadow(@args)
|
||||
// .inner-shadow(@args) *
|
||||
// .box-sizing(@args)
|
||||
// .border-box() *
|
||||
// .content-box() *
|
||||
// .columns(@args)
|
||||
// .column-count(@count)
|
||||
// .column-gap(@gap)
|
||||
// .column-rule(@args)
|
||||
// .column-width(@width)
|
||||
// .gradient(@default,@start,@stop) *
|
||||
// .linear-gradient-top(@default,@color1,@stop1,@color2,@stop2,[@color3,@stop3,@color4,@stop4])*
|
||||
// .linear-gradient-left(@default,@color1,@stop1,@color2,@stop2,[@color3,@stop3,@color4,@stop4])*
|
||||
// .opacity(@factor)
|
||||
// .transform(@args)
|
||||
// .transform-origin(@args)
|
||||
// .transform-style(@style)
|
||||
// .rotate(@deg)
|
||||
// .scale(@factor)
|
||||
// .translate(@x,@y)
|
||||
// .translate3d(@x,@y,@z)
|
||||
// .translateHardware(@x,@y) *
|
||||
// .text-shadow(@args)
|
||||
// .transition(@args)
|
||||
// .transition-delay(@delay)
|
||||
// .transition-duration(@duration)
|
||||
// .transition-property(@property)
|
||||
// .transition-timing-function(@function)
|
||||
//
|
||||
//
|
||||
//
|
||||
// Credit to LESS Elements for the motivation and
|
||||
// to CSS3Please.com for implementation.
|
||||
//
|
||||
// Copyright (c) 2012 Joel Sutherland
|
||||
// MIT Licensed:
|
||||
// http://www.opensource.org/licenses/mit-license.php
|
||||
//
|
||||
//---------------------------------------------------
|
||||
|
||||
|
||||
// Animation
|
||||
|
||||
.animation(@args) {
|
||||
-webkit-animation: @args;
|
||||
-moz-animation: @args;
|
||||
-ms-animation: @args;
|
||||
-o-animation: @args;
|
||||
animation: @args;
|
||||
}
|
||||
.animation-delay(@delay) {
|
||||
-webkit-animation-delay: @delay;
|
||||
-moz-animation-delay: @delay;
|
||||
-ms-animation-delay: @delay;
|
||||
-o-animation-delay: @delay;
|
||||
animation-delay: @delay;
|
||||
}
|
||||
.animation-direction(@direction) {
|
||||
-webkit-animation-direction: @direction;
|
||||
-moz-animation-direction: @direction;
|
||||
-ms-animation-direction: @direction;
|
||||
-o-animation-direction: @direction;
|
||||
}
|
||||
.animation-duration(@duration) {
|
||||
-webkit-animation-duration: @duration;
|
||||
-moz-animation-duration: @duration;
|
||||
-ms-animation-duration: @duration;
|
||||
-o-animation-duration: @duration;
|
||||
animation-duration: @duration;
|
||||
}
|
||||
.animation-fill-mode(@mode) {
|
||||
-webkit-animation-fill-mode: @mode;
|
||||
-moz-animation-fill-mode: @mode;
|
||||
-ms-animation-fill-mode: @mode;
|
||||
-o-animation-fill-mode: @mode;
|
||||
animation-fill-mode: @mode;
|
||||
}
|
||||
.animation-iteration-count(@count) {
|
||||
-webkit-animation-iteration-count: @count;
|
||||
-moz-animation-iteration-count: @count;
|
||||
-ms-animation-iteration-count: @count;
|
||||
-o-animation-iteration-count: @count;
|
||||
animation-iteration-count: @count;
|
||||
}
|
||||
.animation-name(@name) {
|
||||
-webkit-animation-name: @name;
|
||||
-moz-animation-name: @name;
|
||||
-ms-animation-name: @name;
|
||||
-o-animation-name: @name;
|
||||
animation-name: @name;
|
||||
}
|
||||
.animation-play-state(@state) {
|
||||
-webkit-animation-play-state: @state;
|
||||
-moz-animation-play-state: @state;
|
||||
-ms-animation-play-state: @state;
|
||||
-o-animation-play-state: @state;
|
||||
animation-play-state: @state;
|
||||
}
|
||||
.animation-timing-function(@function) {
|
||||
-webkit-animation-timing-function: @function;
|
||||
-moz-animation-timing-function: @function;
|
||||
-ms-animation-timing-function: @function;
|
||||
-o-animation-timing-function: @function;
|
||||
animation-timing-function: @function;
|
||||
}
|
||||
|
||||
|
||||
// Background Size
|
||||
|
||||
.background-size(@args) {
|
||||
-webkit-background-size: @args;
|
||||
background-size: @args;
|
||||
}
|
||||
|
||||
|
||||
// Border Radius
|
||||
|
||||
.border-radius(@args) {
|
||||
-webkit-border-radius: @args;
|
||||
border-radius: @args;
|
||||
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
|
||||
// Box Shadows
|
||||
|
||||
.box-shadow(@args) {
|
||||
-webkit-box-shadow: @args;
|
||||
box-shadow: @args;
|
||||
}
|
||||
.inner-shadow(@args) {
|
||||
.box-shadow(inset @args);
|
||||
}
|
||||
|
||||
|
||||
// Box Sizing
|
||||
|
||||
.box-sizing(@args) {
|
||||
-webkit-box-sizing: @args;
|
||||
-moz-box-sizing: @args;
|
||||
box-sizing: @args;
|
||||
}
|
||||
.border-box(){
|
||||
.box-sizing(border-box);
|
||||
}
|
||||
.content-box(){
|
||||
.box-sizing(content-box);
|
||||
}
|
||||
|
||||
|
||||
// Columns
|
||||
|
||||
.columns(@args) {
|
||||
-webkit-columns: @args;
|
||||
-moz-columns: @args;
|
||||
columns: @args;
|
||||
}
|
||||
.column-count(@count) {
|
||||
-webkit-column-count: @count;
|
||||
-moz-column-count: @count;
|
||||
column-count: @count;
|
||||
}
|
||||
.column-gap(@gap) {
|
||||
-webkit-column-gap: @gap;
|
||||
-moz-column-gap: @gap;
|
||||
column-gap: @gap;
|
||||
}
|
||||
.column-width(@width) {
|
||||
-webkit-column-width: @width;
|
||||
-moz-column-width: @width;
|
||||
column-width: @width;
|
||||
}
|
||||
.column-rule(@args) {
|
||||
-webkit-column-rule: @args;
|
||||
-moz-column-rule: @args;
|
||||
column-rule: @args;
|
||||
}
|
||||
|
||||
|
||||
// Gradients
|
||||
|
||||
.gradient(@default: #F5F5F5, @start: #EEE, @stop: #FFF) {
|
||||
.linear-gradient-top(@default,@start,0%,@stop,100%);
|
||||
}
|
||||
.linear-gradient-top(@default,@color1,@stop1,@color2,@stop2) {
|
||||
background-color: @default;
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(@stop1, @color1), color-stop(@stop2 @color2));
|
||||
background-image: -webkit-linear-gradient(top, @color1 @stop1, @color2 @stop2);
|
||||
background-image: -moz-linear-gradient(top, @color1 @stop1, @color2 @stop2);
|
||||
background-image: -ms-linear-gradient(top, @color1 @stop1, @color2 @stop2);
|
||||
background-image: -o-linear-gradient(top, @color1 @stop1, @color2 @stop2);
|
||||
background-image: linear-gradient(top, @color1 @stop1, @color2 @stop2);
|
||||
}
|
||||
.linear-gradient-top(@default,@color1,@stop1,@color2,@stop2,@color3,@stop3) {
|
||||
background-color: @default;
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(@stop1, @color1), color-stop(@stop2 @color2), color-stop(@stop3 @color3));
|
||||
background-image: -webkit-linear-gradient(top, @color1 @stop1, @color2 @stop2, @color3 @stop3);
|
||||
background-image: -moz-linear-gradient(top, @color1 @stop1, @color2 @stop2, @color3 @stop3);
|
||||
background-image: -ms-linear-gradient(top, @color1 @stop1, @color2 @stop2, @color3 @stop3);
|
||||
background-image: -o-linear-gradient(top, @color1 @stop1, @color2 @stop2, @color3 @stop3);
|
||||
background-image: linear-gradient(top, @color1 @stop1, @color2 @stop2, @color3 @stop3);
|
||||
}
|
||||
.linear-gradient-top(@default,@color1,@stop1,@color2,@stop2,@color3,@stop3,@color4,@stop4) {
|
||||
background-color: @default;
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(@stop1, @color1), color-stop(@stop2 @color2), color-stop(@stop3 @color3), color-stop(@stop4 @color4));
|
||||
background-image: -webkit-linear-gradient(top, @color1 @stop1, @color2 @stop2, @color3 @stop3, @color4 @stop4);
|
||||
background-image: -moz-linear-gradient(top, @color1 @stop1, @color2 @stop2, @color3 @stop3, @color4 @stop4);
|
||||
background-image: -ms-linear-gradient(top, @color1 @stop1, @color2 @stop2, @color3 @stop3, @color4 @stop4);
|
||||
background-image: -o-linear-gradient(top, @color1 @stop1, @color2 @stop2, @color3 @stop3, @color4 @stop4);
|
||||
background-image: linear-gradient(top, @color1 @stop1, @color2 @stop2, @color3 @stop3, @color4 @stop4);
|
||||
}
|
||||
.linear-gradient-left(@default,@color1,@stop1,@color2,@stop2) {
|
||||
background-color: @default;
|
||||
background-image: -webkit-gradient(linear, left top, left top, color-stop(@stop1, @color1), color-stop(@stop2 @color2));
|
||||
background-image: -webkit-linear-gradient(left, @color1 @stop1, @color2 @stop2);
|
||||
background-image: -moz-linear-gradient(left, @color1 @stop1, @color2 @stop2);
|
||||
background-image: -ms-linear-gradient(left, @color1 @stop1, @color2 @stop2);
|
||||
background-image: -o-linear-gradient(left, @color1 @stop1, @color2 @stop2);
|
||||
background-image: linear-gradient(left, @color1 @stop1, @color2 @stop2);
|
||||
}
|
||||
.linear-gradient-left(@default,@color1,@stop1,@color2,@stop2,@color3,@stop3) {
|
||||
background-color: @default;
|
||||
background-image: -webkit-gradient(linear, left top, left top, color-stop(@stop1, @color1), color-stop(@stop2 @color2), color-stop(@stop3 @color3));
|
||||
background-image: -webkit-linear-gradient(left, @color1 @stop1, @color2 @stop2, @color3 @stop3);
|
||||
background-image: -moz-linear-gradient(left, @color1 @stop1, @color2 @stop2, @color3 @stop3);
|
||||
background-image: -ms-linear-gradient(left, @color1 @stop1, @color2 @stop2, @color3 @stop3);
|
||||
background-image: -o-linear-gradient(left, @color1 @stop1, @color2 @stop2, @color3 @stop3);
|
||||
background-image: linear-gradient(left, @color1 @stop1, @color2 @stop2, @color3 @stop3);
|
||||
}
|
||||
.linear-gradient-left(@default,@color1,@stop1,@color2,@stop2,@color3,@stop3,@color4,@stop4) {
|
||||
background-color: @default;
|
||||
background-image: -webkit-gradient(linear, left top, left top, color-stop(@stop1, @color1), color-stop(@stop2 @color2), color-stop(@stop3 @color3), color-stop(@stop4 @color4));
|
||||
background-image: -webkit-linear-gradient(left, @color1 @stop1, @color2 @stop2, @color3 @stop3, @color4 @stop4);
|
||||
background-image: -moz-linear-gradient(left, @color1 @stop1, @color2 @stop2, @color3 @stop3, @color4 @stop4);
|
||||
background-image: -ms-linear-gradient(left, @color1 @stop1, @color2 @stop2, @color3 @stop3, @color4 @stop4);
|
||||
background-image: -o-linear-gradient(left, @color1 @stop1, @color2 @stop2, @color3 @stop3, @color4 @stop4);
|
||||
background-image: linear-gradient(left, @color1 @stop1, @color2 @stop2, @color3 @stop3, @color4 @stop4);
|
||||
}
|
||||
|
||||
|
||||
// Opacity
|
||||
|
||||
.opacity(@factor) {
|
||||
@iefactor: @factor*100;
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=@{iefactor})";
|
||||
filter: ~"alpha(opacity=(@{iefactor}))";
|
||||
opacity: @factor;
|
||||
}
|
||||
|
||||
|
||||
// Text Shadow
|
||||
|
||||
.text-shadow(@args) {
|
||||
text-shadow: @args;
|
||||
}
|
||||
|
||||
|
||||
// Transforms
|
||||
|
||||
.transform(@args) {
|
||||
-webkit-transform: @args;
|
||||
-moz-transform: @args;
|
||||
-ms-transform: @args;
|
||||
-o-transform: @args;
|
||||
transform: @args;
|
||||
}
|
||||
.transform-origin(@args) {
|
||||
-webkit-transform-origin: @args;
|
||||
-moz-transform-origin: @args;
|
||||
-ms-transform-origin: @args;
|
||||
-o-transform-origin: @args;
|
||||
transform-origin: @args;
|
||||
}
|
||||
.transform-style(@style) {
|
||||
-webkit-transform-style: @style;
|
||||
-moz-transform-style: @style;
|
||||
-ms-transform-style: @style;
|
||||
-o-transform-style: @style;
|
||||
transform-style: @style;
|
||||
}
|
||||
.rotate(@deg:45deg){
|
||||
.transform(rotate(@deg));
|
||||
}
|
||||
.scale(@factor:.5){
|
||||
.transform(scale(@factor));
|
||||
}
|
||||
.translate(@x,@y){
|
||||
.transform(translate(@x,@y));
|
||||
}
|
||||
.translate3d(@x,@y,@z) {
|
||||
.transform(translate3d(@x,@y,@z));
|
||||
}
|
||||
.translateHardware(@x,@y) {
|
||||
.translate(@x,@y);
|
||||
-webkit-transform: translate3d(@x,@y,0);
|
||||
-moz-transform: translate3d(@x,@y,0);
|
||||
-o-transform: translate3d(@x,@y,0);
|
||||
-ms-transform: translate3d(@x,@y,0);
|
||||
transform: translate3d(@x,@y,0);
|
||||
}
|
||||
|
||||
|
||||
// Transitions
|
||||
|
||||
.transition(@args:200ms) {
|
||||
-webkit-transition: @args;
|
||||
-moz-transition: @args;
|
||||
-o-transition: @args;
|
||||
-ms-transition: @args;
|
||||
transition: @args;
|
||||
}
|
||||
.transition-delay(@delay:0) {
|
||||
-webkit-transition-delay: @delay;
|
||||
-moz-transition-delay: @delay;
|
||||
-o-transition-delay: @delay;
|
||||
-ms-transition-delay: @delay;
|
||||
transition-delay: @delay;
|
||||
}
|
||||
.transition-duration(@duration:200ms) {
|
||||
-webkit-transition-duration: @duration;
|
||||
-moz-transition-duration: @duration;
|
||||
-o-transition-duration: @duration;
|
||||
-ms-transition-duration: @duration;
|
||||
transition-duration: @duration;
|
||||
}
|
||||
.transition-property(@property:all) {
|
||||
-webkit-transition-property: @property;
|
||||
-moz-transition-property: @property;
|
||||
-o-transition-property: @property;
|
||||
-ms-transition-property: @property;
|
||||
transition-property: @property;
|
||||
}
|
||||
.transition-timing-function(@function:ease) {
|
||||
-webkit-transition-timing-function: @function;
|
||||
-moz-transition-timing-function: @function;
|
||||
-o-transition-timing-function: @function;
|
||||
-ms-transition-timing-function: @function;
|
||||
transition-timing-function: @function;
|
||||
}
|
||||
|
|
@ -44,10 +44,10 @@
|
|||
transform: scale(1.5);
|
||||
}
|
||||
input[type=radio]:not(:checked) ~ .check:after {
|
||||
.animation(rippleOff 500ms);
|
||||
animation: rippleOff 500ms;
|
||||
}
|
||||
input[type=radio]:checked ~ .check:after {
|
||||
.animation(rippleOn 500ms);
|
||||
animation: rippleOn 500ms;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -72,7 +72,7 @@
|
|||
|
||||
}
|
||||
|
||||
.ripple() {
|
||||
@keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
|
@ -84,14 +84,14 @@
|
|||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes rippleOn {.ripple()}
|
||||
@-moz-keyframes rippleOn {.ripple()}
|
||||
@-ms-keyframes rippleOn {.ripple()}
|
||||
@-o-keyframes rippleOn {.ripple()}
|
||||
@keyframes rippleOn {.ripple()}
|
||||
|
||||
@-webkit-keyframes rippleOff {.ripple()}
|
||||
@-moz-keyframes rippleOff {.ripple()}
|
||||
@-ms-keyframes rippleOn {.ripple()}
|
||||
@-o-keyframes rippleOff {.ripple()}
|
||||
@keyframes rippleOff {.ripple()}
|
||||
@keyframes rippleOff {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,3 @@
|
|||
// out: ../css-compiled/ripples.css
|
||||
|
||||
.withripple {
|
||||
position: relative;
|
||||
}
|
||||
|
|
@ -21,24 +19,16 @@
|
|||
margin-top: -10px;
|
||||
border-radius: 100%;
|
||||
background-color: rgba(0,0,0,0.05);
|
||||
-webkit-transform: scale(1);
|
||||
-ms-transform: scale(1);
|
||||
transform: scale(1);
|
||||
-webkit-transform-origin: 50%;
|
||||
-ms-transform-origin: 50%;
|
||||
transform-origin: 50%;
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
.ripple.ripple-on {
|
||||
-webkit-transition: opacity 0.15s ease-in 0s, -webkit-transform 0.5s cubic-bezier(0.4, 0, 0.2, 1) 0.1s;
|
||||
-ms-transition: opacity 0.15s ease-in 0s, -ms-transform 0.5s cubic-bezier(0.4, 0, 0.2, 1) 0.1s;
|
||||
-moz-transition: opacity 0.15s ease-in 0s, -moz-transform 0.5s cubic-bezier(0.4, 0, 0.2, 1) 0.1s;
|
||||
transition: opacity 0.15s ease-in 0s, transform 0.5s cubic-bezier(0.4, 0, 0.2, 1) 0.1s;
|
||||
opacity: 1;
|
||||
}
|
||||
.ripple.ripple-out {
|
||||
-webkit-transition: opacity 0.1s linear 0s !important;
|
||||
transition: opacity 0.1s linear 0s !important;
|
||||
opacity: 0;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -71,7 +71,6 @@ var ripples = {
|
|||
};
|
||||
|
||||
var rippleOut = function($ripple) {
|
||||
console.log($ripple);
|
||||
// Clear previous animation
|
||||
$ripple.className = "ripple ripple-on ripple-out";
|
||||
|
||||
|
|
@ -109,12 +108,14 @@ var ripples = {
|
|||
// init RippleJS and start ripple effect on mousedown
|
||||
bind("mouseover", withRipple, rippleInit);
|
||||
|
||||
console.log(withRipple);
|
||||
// start ripple effect on mousedown
|
||||
bind("mousedown", ".ripple-wrapper", rippleStart);
|
||||
// if animation ends and user is not holding mouse then destroy the ripple
|
||||
bind("rippleEnd", ".ripple-wrapper .ripple", function(e, $ripple) {
|
||||
if (!mouseDown) {
|
||||
|
||||
var $ripples = $ripple.parentNode.getElementsByClassName("ripple");
|
||||
|
||||
if (!mouseDown || ( $ripples[0] == $ripple && $ripples.length > 1)) {
|
||||
rippleOut($ripple);
|
||||
}
|
||||
});
|
||||
|
|
|
|||
|
|
@ -3,8 +3,8 @@
|
|||
<head>
|
||||
|
||||
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="material/ripples.css" rel="stylesheet">
|
||||
<link href="material/material.css" rel="stylesheet">
|
||||
<link href="material/css-compiled/ripples.min.css" rel="stylesheet">
|
||||
<link href="material/css-compiled/material-wfont.min.css" rel="stylesheet">
|
||||
|
||||
</head>
|
||||
|
||||
|
|
@ -12,17 +12,11 @@
|
|||
|
||||
<!-- Your site -->
|
||||
|
||||
<h1>
|
||||
You can add your site here.
|
||||
</h1>
|
||||
<h1>You can add your site here.</h1>
|
||||
|
||||
<h2>
|
||||
To ensure that material-design theme is working, check out the buttons below.
|
||||
</h2>
|
||||
<h2>To ensure that material-design theme is working, check out the buttons below.</h2>
|
||||
|
||||
<h3 class="text-muted">
|
||||
If you can see the ripple effect on clicking them, then you are good to go!
|
||||
</h3>
|
||||
<h3 class="text-muted">If you can see the ripple effect on clicking them, then you are good to go!</h3>
|
||||
|
||||
|
||||
<p class="bs-component">
|
||||
|
|
@ -40,8 +34,8 @@
|
|||
<script src="//code.jquery.com/jquery-1.10.2.min.js"></script>
|
||||
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
|
||||
|
||||
<script src="material/ripples.js"></script>
|
||||
<script src="material/material.js"></script>
|
||||
<script src="material/scripts/ripples.js"></script>
|
||||
<script src="material/scripts/material.js"></script>
|
||||
|
||||
</body>
|
||||
|
||||
|
|
|
|||
1
template/material/css-compiled/material-wfont.min.css
vendored
Normal file
1
template/material/css-compiled/material-wfont.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
1
template/material/css-compiled/material.min.css
vendored
Normal file
1
template/material/css-compiled/material.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
1
template/material/css-compiled/ripples.min.css
vendored
Normal file
1
template/material/css-compiled/ripples.min.css
vendored
Normal file
|
|
@ -0,0 +1 @@
|
|||
.withripple{position:relative}.ripple-wrapper{position:absolute;top:0;left:0;z-index:1;width:100%;height:100%;overflow:hidden;border-radius:2px}.ripple{position:absolute;width:20px;height:20px;margin-left:-10px;margin-top:-10px;border-radius:100%;background-color:rgba(0,0,0,.05);-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1);-webkit-transform-origin:50%;-ms-transform-origin:50%;transform-origin:50%;opacity:0;pointer-events:none}.ripple.ripple-on{-webkit-transition:opacity .15s ease-in 0s,-webkit-transform .5s cubic-bezier(0.4,0,.2,1) .1s;transition:opacity .15s ease-in 0s,transform .5s cubic-bezier(0.4,0,.2,1) .1s;opacity:1}.ripple.ripple-out{-webkit-transition:opacity .1s linear 0s!important;transition:opacity .1s linear 0s!important;opacity:0}
|
||||
|
|
@ -1,41 +0,0 @@
|
|||
/* Generated by less 1.7.5 */
|
||||
.withripple {
|
||||
position: relative;
|
||||
}
|
||||
.ripple-wrapper {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 1;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
border-radius: 2px;
|
||||
}
|
||||
.ripple {
|
||||
position: absolute;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-left: -10px;
|
||||
margin-top: -10px;
|
||||
border-radius: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.05);
|
||||
-webkit-transform: scale(1);
|
||||
-ms-transform: scale(1);
|
||||
transform: scale(1);
|
||||
-webkit-transform-origin: 50%;
|
||||
-ms-transform-origin: 50%;
|
||||
transform-origin: 50%;
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
.ripple.ripple-on {
|
||||
-webkit-transition: opacity 0.15s ease-in 0s, -webkit-transform 0.5s cubic-bezier(0.4, 0, 0.2, 1) 0.1s;
|
||||
transition: opacity 0.15s ease-in 0s, transform 0.5s cubic-bezier(0.4, 0, 0.2, 1) 0.1s;
|
||||
opacity: 1;
|
||||
}
|
||||
.ripple.ripple-out {
|
||||
-webkit-transition: opacity 0.1s linear 0s !important;
|
||||
transition: opacity 0.1s linear 0s !important;
|
||||
opacity: 0;
|
||||
}
|
||||
|
|
@ -71,7 +71,6 @@ var ripples = {
|
|||
};
|
||||
|
||||
var rippleOut = function($ripple) {
|
||||
console.log($ripple);
|
||||
// Clear previous animation
|
||||
$ripple.className = "ripple ripple-on ripple-out";
|
||||
|
||||
|
|
@ -109,12 +108,14 @@ var ripples = {
|
|||
// init RippleJS and start ripple effect on mousedown
|
||||
bind("mouseover", withRipple, rippleInit);
|
||||
|
||||
console.log(withRipple);
|
||||
// start ripple effect on mousedown
|
||||
bind("mousedown", ".ripple-wrapper", rippleStart);
|
||||
// if animation ends and user is not holding mouse then destroy the ripple
|
||||
bind("rippleEnd", ".ripple-wrapper .ripple", function(e, $ripple) {
|
||||
if (!mouseDown) {
|
||||
|
||||
var $ripples = $ripple.parentNode.getElementsByClassName("ripple");
|
||||
|
||||
if (!mouseDown || ( $ripples[0] == $ripple && $ripples.length > 1)) {
|
||||
rippleOut($ripple);
|
||||
}
|
||||
});
|
||||
Loading…
Reference in New Issue
Block a user