| /* |
| * Industrial Theme for Jenkins Build Monitor Plugin |
| */ |
| |
| /* |
| * The MIT License |
| * |
| * Copyright (c) 2014, Jan Molak, SmartCode Ltd http://smartcodeltd.co.uk |
| * |
| * Permission is hereby granted, free of charge, to any person obtaining a copy |
| * of this software and associated documentation files (the "Software"), to deal |
| * in the Software without restriction, including without limitation the rights |
| * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell |
| * copies of the Software, and to permit persons to whom the Software is |
| * furnished to do so, subject to the following conditions: |
| * |
| * The above copyright notice and this permission notice shall be included in |
| * all copies or substantial portions of the Software. |
| * |
| * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR |
| * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, |
| * FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE |
| * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER |
| * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, |
| * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN |
| * THE SOFTWARE. |
| */ |
| |
| |
| /* |
| * Colours & Typography |
| */ |
| |
| @font-face { |
| font-family: 'Open Sans'; |
| font-style: normal; |
| font-weight: 400; |
| src: local('Open Sans'), local('OpenSans'), url("industrial/open-sans-normal.woff") format('woff'); |
| } |
| @font-face { |
| font-family: 'Open Sans'; |
| font-style: normal; |
| font-weight: 700; |
| src: local('Open Sans Bold'), local('OpenSans-Bold'), url("industrial/open-sans-bold.woff") format('woff'); |
| } |
| |
| html{color:#fff;font-family:'Open sans',sans-serif;font-size:16px;line-height:1.4;} |
| h1,h2,h3,h4,h5,h6 { |
| text-align:center; |
| margin:0; padding:0; |
| } |
| h1,h2,h3,h4,h5,h6, li, a { |
| font-family: 'Open sans', Verdana, Helvetica, sans serif; |
| } |
| .build-monitor { color:#fff; } |
| .build-monitor header>h1 { |
| text-shadow: 2px 2px rgba(0,0,0,0.5); |
| } |
| h2 { |
| text-shadow: 1px 1px rgba(0,0,0,0.5); |
| } |
| |
| .build-monitor a { |
| color: #73BFFF; |
| text-decoration: none; |
| } |
| |
| .build-monitor #job-views li a, |
| .build-monitor #job-views li a:visited, |
| .build-monitor header>h1>a{ |
| color:white; |
| } |
| .build-monitor a:hover { |
| text-decoration: underline; |
| } |
| |
| .build-monitor header h1 { |
| margin:12px auto 0 auto; |
| font-size: 3em; |
| letter-spacing: 0.0em; |
| display:block; |
| } |
| |
| .build-monitor header a.home-link { |
| position: absolute; |
| top: 5px; |
| left: 8px; |
| z-index:2; |
| background: url('industrial/v-96x96.png') no-repeat; |
| background-size: 100%; |
| width: 50px; /* 100 */ |
| height: 69px; /* 138 */ |
| text-indent: -100%; |
| text-decoration: none; |
| white-space: nowrap; |
| overflow: hidden; |
| } |
| |
| .build-monitor header .oncall { |
| position: absolute; |
| top: 8px; |
| left: 8px; |
| z-index:2; |
| background: url('industrial/police.png') no-repeat; |
| width: 600px; |
| height: 50px; |
| white-space: nowrap; |
| overflow: hidden; |
| line-height: 50px; |
| text-decoration: none; |
| font-size: 24px; |
| padding-left: 52px; |
| color: #ccc; |
| } |
| |
| .build-monitor h2 { |
| font-weight: normal; |
| font-size: 3.5em; |
| margin-bottom: 0.1em; |
| } |
| |
| .build-monitor p { |
| font-size: 1.2em; |
| margin: 0 0 0.5em 0; |
| } |
| |
| .build-monitor .unknown { background-color:#474747; } |
| .build-monitor .successful { background-color:darkgreen; } |
| .build-monitor .unstable { background-color:#f59400; } |
| .build-monitor .failing { background-color:darkred; } |
| |
| /* |
| * Striped background patterns inspired by Lea Verou |
| * http://lea.verou.me/2010/12/checkered-stripes-other-background-patterns-with-css3-gradients/ |
| */ |
| .build-monitor .successful, |
| .build-monitor .unstable, |
| .build-monitor .failing { |
| -webkit-background-size: 50px 50px; |
| -moz-background-size: 50px 50px; |
| background-size: 50px 50px; /* Controls the size of the stripes */ |
| } |
| |
| |
| .build-monitor .colour-blind-mode .unstable { |
| /* diamonds */ |
| background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, rgba(255, 255, 255, .2)), color-stop(.25, transparent), to(transparent)), |
| -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255, 255, 255, .2)), color-stop(.25, transparent), to(transparent)), |
| -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.75, transparent), color-stop(.75, rgba(255, 255, 255, .2))), |
| -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.75, transparent), color-stop(.75, rgba(255, 255, 255, .2))); |
| background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, transparent), |
| -webkit-linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, transparent), |
| -webkit-linear-gradient(45deg, transparent 75%, rgba(255, 255, 255, .2) 75%), |
| -webkit-linear-gradient(-45deg, transparent 75%, rgba(255, 255, 255, .2) 75%); |
| background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, transparent), |
| -moz-linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, transparent), |
| -moz-linear-gradient(45deg, transparent 75%, rgba(255, 255, 255, .2) 75%), |
| -moz-linear-gradient(-45deg, transparent 75%, rgba(255, 255, 255, .2) 75%); |
| background-image: -ms-linear-gradient(45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, transparent), |
| -ms-linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, transparent), |
| -ms-linear-gradient(45deg, transparent 75%, rgba(255, 255, 255, .2) 75%), |
| -ms-linear-gradient(-45deg, transparent 75%, rgba(255, 255, 255, .2) 75%); |
| background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, transparent), |
| -o-linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, transparent), |
| -o-linear-gradient(45deg, transparent 75%, rgba(255, 255, 255, .2) 75%), |
| -o-linear-gradient(-45deg, transparent 75%, rgba(255, 255, 255, .2) 75%); |
| background-image: linear-gradient(45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, transparent), |
| linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, transparent), |
| linear-gradient(45deg, transparent 75%, rgba(255, 255, 255, .2) 75%), |
| linear-gradient(-45deg, transparent 75%, rgba(255, 255, 255, .2) 75%); |
| } |
| |
| .build-monitor .colour-blind-mode .failing { |
| background-image: -webkit-gradient(linear, 0 100%, 100% 0, |
| color-stop(.25, rgba(255, 255, 255, .2)), color-stop(.25, transparent), |
| color-stop(.5, transparent), color-stop(.5, rgba(255, 255, 255, .2)), |
| color-stop(.75, rgba(255, 255, 255, .2)), color-stop(.75, transparent), |
| to(transparent)); |
| background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, |
| transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%, |
| transparent 75%, transparent); |
| background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, |
| transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%, |
| transparent 75%, transparent); |
| background-image: -ms-linear-gradient(45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, |
| transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%, |
| transparent 75%, transparent); |
| background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, |
| transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%, |
| transparent 75%, transparent); |
| background-image: linear-gradient(45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, |
| transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%, |
| transparent 75%, transparent); |
| } |
| |
| .build-monitor .unstable.claimed, |
| .build-monitor .failing.claimed { |
| background-image: -webkit-gradient(linear, 0 0, 100% 100%, |
| color-stop(.25, rgba(255, 255, 255, .2)), color-stop(.25, transparent), |
| color-stop(.5, transparent), color-stop(.5, rgba(255, 255, 255, .2)), |
| color-stop(.75, rgba(255, 255, 255, .2)), color-stop(.75, transparent), |
| to(transparent)); |
| background-image: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, |
| transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%, |
| transparent 75%, transparent); |
| background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, |
| transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%, |
| transparent 75%, transparent); |
| background-image: -ms-linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, |
| transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%, |
| transparent 75%, transparent); |
| background-image: -o-linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, |
| transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%, |
| transparent 75%, transparent); |
| background-image: linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, |
| transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%, |
| transparent 75%, transparent); |
| } |
| |
| |
| .build-monitor #job-views .build-time, |
| .build-monitor #job-views .build-name { |
| font-weight: bold; |
| color:rgba(255,255,255, 0.3); |
| } |
| .build-monitor #job-views .running .build-time, |
| .build-monitor #job-views .running .build-name { |
| font-weight: bold; |
| color:rgba(255,255,255, 0.5); |
| } |
| .build-monitor #job-views .build-name { font-size: 2em; line-height: 1.75em; } |
| .build-monitor #job-views .build-time { font-size: 2em; line-height: 1.75em; } |
| .build-monitor #job-views .build-time>.elapsed { font-size: 1.0em; color:rgba(255,255,255,0.7); } |
| .build-monitor #job-views .build-time>.elapsed:after { content:"|"; margin-left:0.1em; font-weight: normal; } |
| |
| .build-monitor footer { |
| padding: 0 8px; |
| color: #ddd; |
| clear: both; |
| } |
| |
| .build-monitor footer span { |
| line-height: 150%; |
| } |
| |
| .build-monitor footer .notifier { |
| float: left; |
| background: #ffcf85; |
| padding:0 10px; |
| border-radius: 10px; |
| color:#393939; |
| } |
| |
| .build-monitor footer .plugin-author { |
| float: right; |
| font-size: 14px; |
| color: #aaa; |
| } |
| |
| .build-monitor footer .build-cop { |
| font-size: 14px; |
| color: #aaa; |
| } |
| |
| |
| .build-monitor .latest-results ul, |
| .build-monitor .latest-results ol { |
| list-style-type: none; |
| margin: 0 0 0.25em 1em; padding: 0; |
| font-size: 1.3em; |
| } |
| |
| .build-monitor .meta li { display: inline-block; } |
| .build-monitor .meta .culprits li { padding-right:0; margin-right:0.5em; } |
| .build-monitor .meta .culprits li:after { content: ","; } |
| .build-monitor .meta .culprits li:last-child:after { content: ""; } |
| |
| .build-monitor ul.culprits li:first-child:before { |
| content: "Possible Culprits: "; |
| } |
| |
| .build-monitor .meta .failures li { margin-right:0.5em; } |
| .build-monitor .meta .failures li:after { content: ","; } |
| .build-monitor .meta .failures li:last-child:after { content: ""; } |
| |
| .build-monitor .failing ul.failures li:first-child:before { |
| content: "Identified Problems: "; |
| } |
| |
| |
| /* |
| * Layout |
| */ |
| .no-flexbox .build-monitor.dashboard * { |
| display:none; |
| } |
| |
| .dashboard { background: url('industrial/background.png'); } |
| |
| .build-monitor.dashboard { |
| overflow: hidden; |
| position: fixed; left:0px; top:0px; |
| z-index: 9999; |
| height: 100%; |
| width: 100%; |
| margin:0; padding: 0; |
| |
| display: -webkit-flex; |
| display: flex; |
| flex-flow: column; |
| -webkit-flex-flow: column; |
| -webkit-justify-content: space-around; |
| justify-content: space-around; |
| } |
| |
| .build-monitor header { |
| /*-webkit-flex: 8;*/ |
| /*flex: 8;*/ |
| |
| /*min-height:4em;*/ |
| /*max-height:4em;*/ |
| height:56px; |
| |
| display: -webkit-flex; |
| display: flex; |
| |
| align-items: center; |
| align-content: center; |
| } |
| |
| .build-monitor #job-views { |
| -webkit-flex: 88; |
| flex: 88; |
| |
| display: -webkit-flex; |
| display: flex; |
| -webkit-flex-flow: row wrap; |
| flex-flow: row wrap; |
| -webkit-justify-content: space-around; |
| justify-content: space-around; |
| } |
| |
| .build-monitor #job-views.empty em { |
| padding:5em 0 0 0; |
| } |
| |
| .build-monitor footer { |
| height:32px; |
| } |
| |
| .build-monitor ul#job-views { |
| list-style-type: none; |
| margin: 4px; |
| padding:0; |
| } |
| |
| /* |
| * Grid |
| */ |
| .build-monitor ul#job-views>li { |
| margin: 4px; |
| } |
| .build-monitor ul#job-views.columns-1 li { |
| -webkit-flex: 1 99%; |
| flex: 1 99%; |
| } |
| .build-monitor ul#job-views.columns-2 li { |
| -webkit-flex: 1 48%; |
| flex: 1 48%; |
| } |
| .build-monitor ul#job-views.columns-3 li { |
| -webkit-flex: 1 32%; |
| flex: 1 32%; |
| } |
| .build-monitor ul#job-views.columns-4 li { |
| -webkit-flex: 1 24%; |
| flex: 1 24%; |
| } |
| .build-monitor ul#job-views.columns-5 li { |
| -webkit-flex: 1 19%; |
| flex: 1 19%; |
| } |
| .build-monitor ul#job-views.columns-6 li { |
| -webkit-flex: 1 15.5%; |
| flex: 1 15.5%; |
| } |
| .build-monitor ul#job-views.columns-7 li { |
| -webkit-flex: 1 13%; |
| flex: 1 13%; |
| } |
| .build-monitor ul#job-views.columns-8 li { |
| -webkit-flex: 1 11.5%; |
| flex: 1 11.5%; |
| } |
| |
| .build-monitor ul#job-views .meta { |
| display: -webkit-flex; |
| display: flex; |
| -webkit-justify-content: space-around; |
| justify-content: space-around; |
| align-content: center; |
| align-items:center; |
| } |
| |
| .build-monitor ul#job-views .meta .latest-results { |
| width:90%; margin:0 auto; |
| } |
| .build-monitor ul#job-views .meta .latest-results * { |
| text-align: center; |
| } |
| |
| .build-monitor ul#job-views .meta ul, |
| .build-monitor ul#job-views .meta ol { |
| margin:0; |
| overflow: hidden; |
| } |
| .build-monitor ul#job-views .meta ul li, |
| .build-monitor ul#job-views .meta ol li { |
| border-radius: 0; |
| } |
| |
| .build-monitor #job-views .build-time, |
| .build-monitor #job-views .build-name { |
| display:block; |
| position:absolute; |
| } |
| .build-monitor #job-views .build-time { |
| vertical-align: middle; |
| } |
| .build-monitor #job-views .build-name { bottom:0; left:0.3em; } |
| .build-monitor #job-views .build-time { bottom:0; right:0.3em; } |
| |
| /* |
| * Job meta-data |
| */ |
| |
| .build-monitor ul#job-views li .meta { |
| z-index: 10; |
| position:absolute; left:0; top:0; |
| width:100%; height:100%; |
| } |
| |
| /* |
| * Progress bar |
| */ |
| |
| .build-monitor ul#job-views>li { |
| position:relative; |
| border-radius:10px; |
| overflow: hidden; |
| -webkit-box-shadow: 2px 2px 1px rgba(0,0,0,0.5); |
| box-shadow: 2px 2px 1px rgba(0,0,0,0.5); |
| } |
| |
| .build-monitor ul#job-views .progress { |
| z-index: 0; |
| position:absolute; left:0; top:0; |
| width:0%; height:100%; |
| text-align: right; |
| overflow: hidden; |
| border-radius:10px; |
| } |
| .build-monitor ul#job-views .progress span { |
| display:none; |
| } |
| |
| .build-monitor ul#job-views .unknown > .progress { |
| -webkit-animation: forUnknown 2.25s 2 alternate; |
| -moz-animation: forUnknown 2.25s 2 alternate; |
| animation: forUnknown 2.25s 2 alternate; |
| background-color: #9D9D9D; |
| } |
| |
| .build-monitor ul#job-views .successful > .progress { |
| -webkit-animation: forSuccessful 2.25s 2 alternate; |
| -moz-animation: forSuccessful 2.25s 2 alternate; |
| animation: forSuccessful 2.25s 2 alternate; |
| background-color: green; |
| } |
| |
| .build-monitor ul#job-views .unstable > .progress { |
| -webkit-animation: forUnstable 2.25s 2 alternate; |
| -moz-animation: forUnstable 2.25s 2 alternate; |
| animation: forUnstable 2.25s 2 alternate; |
| background-color: #f9aa1c; |
| } |
| |
| .build-monitor ul#job-views .failing > .progress { |
| -webkit-animation: forFailing 2.25s 2 alternate; |
| -moz-animation: forFailing 2.25s 2 alternate; |
| animation: forFailing 2.25s 2 alternate; |
| background-color: firebrick; |
| } |
| |
| @-webkit-keyframes forUnknown { 0% {background-color: #9d9d9d;} 100% {background-color: grey;} } |
| @-moz-keyframes forUnknown { 0% {background-color: #9d9d9d;} 100% {background-color: grey;} } |
| @-keyframes forUnknown { 0% {background-color: #9d9d9d;} 100% {background-color: grey;} } |
| @-webkit-keyframes forSuccessful { 0% {background-color: green;} 100% {background-color: limegreen;} } |
| @-moz-keyframes forSuccessful { 0% {background-color: green;} 100% {background-color: limegreen;} } |
| @-keyframes forSuccessful { 0% {background-color: green;} 100% {background-color: limegreen;} } |
| @-webkit-keyframes forUnstable { 0% {background-color: #f9aa1c;} 100% {background-color: #ffc500;} } |
| @-moz-keyframes forUnstable { 0% {background-color: #f9aa1c;} 100% {background-color: #ffc500;} } |
| @-keyframes forUnstable { 0% {background-color: #f9aa1c;} 100% {background-color: #ffc500;} } |
| @-webkit-keyframes forFailing { 0% {background-color: firebrick;} 100% {background-color: red;} } |
| @-moz-keyframes forFailing { 0% {background-color: firebrick;} 100% {background-color: red;} } |
| @-keyframes forFailing { 0% {background-color: firebrick;} 100% {background-color: red;} } |
| |
| /* |
| * Modal |
| */ |
| .modal { |
| width: 60%; |
| margin-left: -30%; |
| color: #000; |
| background: #fff; |
| } |
| .modal-header h1 { |
| text-align: left; |
| font-size:2.5em; |
| } |
| .modal-body p { |
| font-size:1.2em; |
| } |
| |
| .modal textarea { |
| font-family: "Consolas", "Menlo", "Courier", monospace; |
| width: 100%; |
| } |
| |
| |
| /* |
| * Config nav |
| */ |
| |
| .build-monitor nav { |
| border:1px solid white; |
| z-index: 999; |
| position:absolute; |
| top:10px; |
| right:8px; |
| width:32px; |
| overflow: hidden; |
| margin: 0; padding: 5px; |
| background: rgba(57, 57, 57, 0.9); |
| border-radius: 5px; |
| opacity:0.5; |
| |
| -webkit-transition: all 0.25 ease-in; |
| transition: all 0.25s ease-in; |
| min-width: 48px; |
| } |
| .build-monitor nav:hover { |
| opacity:1.0; |
| } |
| .build-monitor .showSettings { |
| opacity: 1.0; |
| width:200px !important; |
| } |
| .build-monitor nav.showSettings ul { |
| height:auto; |
| } |
| |
| .build-monitor nav ul { |
| height:0; |
| width:200px !important; |
| overflow: hidden; |
| |
| list-style-type: none; |
| margin:0; padding:0; |
| } |
| .build-monitor nav li { |
| display: block; |
| margin:0 0.5em; |
| border-radius: 5px; |
| } |
| |
| .build-monitor nav label { |
| width:100%; |
| } |
| .build-monitor nav li:nth-child(1), |
| .build-monitor nav li:nth-child(6) { |
| margin-top:2em; |
| } |
| .build-monitor nav li:last-child { |
| padding:1em 0 1em 0; |
| } |
| |
| .build-monitor nav li .slider-label { |
| width:100px; |
| margin-right:10px; |
| } |
| |
| .build-monitor nav li a.btn { |
| width: 86%; |
| color: #000 !important; |
| text-decoration: none; |
| } |
| .build-monitor nav li button.btn { |
| width: 100%; |
| } |
| |
| /* |
| * Angular slider |
| */ |
| slider { |
| width: 180px; |
| } |
| |
| /* |
| * Inspired by WittySparks - (c) Sravan Kumar, WittySparks.com |
| */ |
| .build-monitor nav input[type='checkbox']#settings-toggle{opacity:0;position:absolute;filter:alpha(opacity=0);margin:5px 0 0 5px} |
| .build-monitor nav input[type='checkbox']#settings-toggle+label { |
| background:url("industrial/glyphs.png") left top no-repeat; |
| background-size:32px 32px; |
| position:relative; |
| margin:0; padding:0 0 0 40px; |
| cursor:pointer; |
| line-height:32px; |
| min-height:32px; |
| display:inline-block; |
| z-index:0; |
| font-weight:bold; |
| } |
| |
| .build-monitor nav input[type='checkbox']#settings-toggle+label { background-position:0 0} |
| .build-monitor nav input[type='checkbox']#settings-toggle:checked+label { } |
| .build-monitor nav input[type='checkbox']#settings-toggle:disabled+label { } |
| .build-monitor nav input[type='checkbox']#settings-toggle:disabled:checked+label{ } |
| |
| .build-monitor nav label { font-size: 1em; } |
| .build-monitor nav li input[type='checkbox'] { margin-right:0.5em; } |
| |
| |
| /* |
| * Animations |
| */ |
| .fade-hide, .fade-show { |
| -webkit-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.75s; |
| -moz-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.75s; |
| -o-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.75s; |
| transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.75s; |
| } |
| |
| .fade-hide { opacity:1; } |
| .fade-hide.fade-hide-active { opacity:0; } |
| |
| .fade-show { opacity:0; } |
| .fade-show.fade-show-active { opacity:1; } |