diff --git a/CHANGELOG.md b/CHANGELOG.md index e195b6c..7355ffc 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -6,6 +6,8 @@ - Added support for `:disabled` pseudo-class for elements with disabled styles (issue #8). - Added support for `:active` and `:focus` for the close utility class (issue #9). - New module: Spinners (component comes in two styles) - part of the extra modules. +- Removed the `flavor.scss` file from the `/scss` directory. Default flavor base will be `/flavors/mini-default.scss`. +- Added hover styling and pointer cursor to the thumbnail styling (issue #10). ## v1.0.2 diff --git a/flavors/mini-default.css b/flavors/mini-default.css index 4cd7563..5e4affb 100644 --- a/flavors/mini-default.css +++ b/flavors/mini-default.css @@ -889,6 +889,7 @@ textarea { - $thumb-padding : The padding between the image and the border. - $thumb-border : The style of the thumbnail's border. - $thumb-border-radius : The border radius of the thumbnail. + - $thumb-hover-color : The color of the thumbnail's border when hovering over it. Notes: - [1] : This style only applies to `img` elements with the class specified in `$thumb-name`. @@ -982,7 +983,10 @@ textarea { img.thumb { padding: 0.25em; border: 1px solid #ccc; - border-radius: 4px; } + border-radius: 4px; + cursor: pointer; } + img.thumb:hover, img.thumb:focus, img.thumbactive { + border-color: #2678b3; } .bordered { border: 1px solid rgba(0, 0, 0, 0.25) !important; } diff --git a/flavors/mini-default.min.css b/flavors/mini-default.min.css index 77499be..73f0541 100644 --- a/flavors/mini-default.min.css +++ b/flavors/mini-default.min.css @@ -1 +1 @@ -html{font-family:"Helvetica Neue",Helvetica,sans-serif;font-size:1em;line-height:1.5;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0;color:#222;background-color:#f5f5f5}article,aside,details,figcaption,figure,footer,header,img,main,menu,nav,section{display:block}figure{margin:1em 40px}h1,h2,h3,h4,h5,h6{line-height:1.2;margin:.7em 0;font-weight:500}h1 small,h2 small,h3 small,h4 small,h5 small,h6 small{color:#555;font-weight:200}h1{font-size:2em}h2{font-size:1.5em}h3{font-size:1.15em}h4{font-size:1em}h5{font-size:.8em}h6{font-size:.7em}hr{box-sizing:content-box;line-height:1.2;margin:.7em 0;height:0;border:0;border-top:1px solid #cfcfcf}small,sub,sup{font-size:75%}p,pre{margin:0 0 .6em}ol,ul{margin-top:0;margin-bottom:.6em}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}code,kbd,pre{padding:2px 4px;border-radius:4px}code,pre{background-color:#dcdcdc}kbd{color:#fefefe;background-color:#222}pre{display:block;word-break:break-all;word-wrap:break-word}pre code{padding:0;font-size:inherit;color:inherit;white-space:pre-wrap;background-color:transparent;border-radius:0}a{background-color:transparent;text-decoration:none;color:#2678b3}a:active,a:hover{outline-width:0;color:#3793d5}a:visited{color:#1d5c89}a:visited:active,a:visited:hover{color:#2678b3}b,strong{font-weight:bolder}dfn{font-style:italic}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}mark{background-color:#ff3;color:#222}.hidden,[hidden],audio:not([controls]),template{display:none}audio:not([controls]){height:0}audio,progress,video{display:inline-block}progress,sub,sup{vertical-align:baseline}sub,sup{line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none;max-width:100%}svg:not(:root){overflow:hidden}button,hr,input{overflow:visible}button,input,optgroup,select,textarea{font-family:"Helvetica Neue",Helvetica,sans-serif;font-size:100%;line-height:1.2;margin:0}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner,html [type=button]::-moz-focus-inner{border-style:none;padding:0}[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring,html [type=button]:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid #cfcfcf;border-radius:4px;margin:0 2px;padding:.35em .65em .75em}[type=checkbox],[type=radio],legend{box-sizing:border-box;padding:0}legend{color:inherit;display:table;max-width:100%;white-space:normal}textarea{overflow:auto}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button,img{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}.btn,a.btn,a.btn:visited{display:inline-block;border:0;border-radius:4px;margin:2px 0;padding:6px 12px;color:#2a2a2a;background:#eaeaea;cursor:pointer}.btn:active,.btn:focus,.btn:hover,a.btn:active,a.btn:focus,a.btn:hover,a.btn:visited:active,a.btn:visited:focus,a.btn:visited:hover{background:#fdfdfd}.btn.disabled,.btn:disabled,.btn[disabled],a.btn.disabled,a.btn:disabled,a.btn:visited.disabled,a.btn:visited:disabled,a.btn:visited[disabled],a.btn[disabled]{cursor:not-allowed;opacity:.65}.btn.blue,a.btn.blue,a.btn.blue:visited{color:#eee;background:#3f84b3}.btn.blue:active,.btn.blue:focus,.btn.blue:hover,a.btn.blue:active,a.btn.blue:focus,a.btn.blue:hover,a.btn.blue:visited:active,a.btn.blue:visited:focus,a.btn.blue:visited:hover{background:#5597c3}.btn.green,a.btn.green,a.btn.green:visited{color:#eee;background:#2db747}.btn.green:active,.btn.green:focus,.btn.green:hover,a.btn.green:active,a.btn.green:focus,a.btn.green:hover,a.btn.green:visited:active,a.btn.green:visited:focus,a.btn.green:visited:hover{background:#3bcf57}.btn.red,a.btn.red,a.btn.red:visited{color:#eee;background:#ea4848}.btn.red:active,.btn.red:focus,.btn.red:hover,a.btn.red:active,a.btn.red:focus,a.btn.red:hover,a.btn.red:visited:active,a.btn.red:visited:focus,a.btn.red:visited:hover{background:#ee6a6a}.btn.lg{padding:9px 15px;font-size:135%}.btn.sm{padding:4px 8px;font-size:80%}.grid-container{padding-right:0;padding-left:0;margin-right:auto;margin-left:auto;width:100%}.grid-container *{box-sizing:border-box}.row:after,.row:before{content:"";display:table;clear:both}.col{float:left;padding:12px}.xs-1{width:8.33333%}.xs-2{width:16.66667%}.xs-3{width:25%}.xs-4{width:33.33333%}.xs-5{width:41.66667%}.xs-6{width:50%}.xs-7{width:58.33333%}.xs-8{width:66.66667%}.xs-9{width:75%}.xs-10{width:83.33333%}.xs-11{width:91.66667%}.xs-12{width:100%}.lg-no,.md-no,.sm-no{display:block}.xs-no{display:none}@media (min-width:768px){.sm-1{width:8.33333%}.sm-2{width:16.66667%}.sm-3{width:25%}.sm-4{width:33.33333%}.sm-5{width:41.66667%}.sm-6{width:50%}.sm-7{width:58.33333%}.sm-8{width:66.66667%}.sm-9{width:75%}.sm-10{width:83.33333%}.sm-11{width:91.66667%}.sm-12{width:100%}.lg-no,.md-no,.xs-no{display:block}.sm-no{display:none}}@media (min-width:1024px){.md-1{width:8.33333%}.md-2{width:16.66667%}.md-3{width:25%}.md-4{width:33.33333%}.md-5{width:41.66667%}.md-6{width:50%}.md-7{width:58.33333%}.md-8{width:66.66667%}.md-9{width:75%}.md-10{width:83.33333%}.md-11{width:91.66667%}.md-12{width:100%}.lg-no,.sm-no,.xs-no{display:block}.md-no{display:none}}@media (min-width:1280px){.lg-1{width:8.33333%}.lg-2{width:16.66667%}.lg-3{width:25%}.lg-4{width:33.33333%}.lg-5{width:41.66667%}.lg-6{width:50%}.lg-7{width:58.33333%}.lg-8{width:66.66667%}.lg-9{width:75%}.lg-10{width:83.33333%}.lg-11{width:91.66667%}.lg-12{width:100%}.md-no,.sm-no,.xs-no{display:block}.lg-no{display:none}}.frm input:not([type]),.frm input[type$=time],.frm input[type=color],.frm input[type=email],.frm input[type=month],.frm input[type=number],.frm input[type=password],.frm input[type=search],.frm input[type=tel],.frm input[type=text],.frm input[type=url],.frm input[type=week],.frm input[type^=date],.frm select,.frm textarea{box-sizing:border-box;border:1px solid #ccc;border-radius:4px;box-shadow:none}.frm input,.frm select,.frm textarea{display:block;margin:.2em;padding:.3em}.frm input:focus,.frm select:focus,.frm textarea:focus{border-color:#2678b3}.frm input[disabled],.frm select[disabled],.frm textarea[disabled]{cursor:not-allowed;opacity:.65}.frm input:focus:invalid,.frm input:focus:invalid:focus,.frm input:invalid,.frm select:focus:invalid,.frm select:focus:invalid:focus,.frm select:invalid,.frm textarea:focus:invalid,.frm textarea:focus:invalid:focus,.frm textarea:invalid{border-color:#e9322d}.frm input[readonly],.frm select[readonly],.frm textarea[readonly]{background-color:#dcdcdc;border-color:#b5b5b5}.frm input[type=checkbox],.frm input[type=radio]{display:inline-block}.frm select{height:1.9em}.frm select[multiple]{height:auto}.frm label{margin:.5em 0 0 .2em}.frm.aligned input,.frm.aligned label,.frm.aligned select,.frm.aligned textarea,.frm.inline .ctrl-group,.frm.inline input,.frm.inline label,.frm.inline select,.frm.inline textarea{display:inline-block}.frm.aligned .ctrl-group label{text-align:right;vertical-align:middle;width:15em;margin-top:0}.frm .ctrl-group{margin:0 0 .3em}.tbl{border-collapse:collapse;border-spacing:0;empty-cells:show;border:1px solid #bdbdbd}.tbl td,.tbl th{overflow:visible;border-left:1px solid #bdbdbd;border-bottom:none;margin:0;padding:.5em}.tbl thead{background-color:#d9d9d9;color:#111;text-align:left}.tbl tbody{background-color:#f5f5f5;color:#111}.tbl tbody tr:nth-child(2n-1){background-color:#ececec}.tbl.hor td,.tbl.hor th{border-left:none;border-bottom:1px solid #bdbdbd}.tbl.bor td,.tbl.bor th{border-bottom:1px solid #bdbdbd}.nav{box-sizing:border-box;background-color:#272727}.nav .logo{font-size:135%;color:#ddd}.nav ul{display:inline-block;list-style:none;margin:0;padding:0}.nav ul li{display:inline-block;margin:0;white-space:nowrap}.nav ul li>*{display:inline-block;padding:8px;color:#ddd;margin:0}.nav ul li .link:active,.nav ul li .link:focus,.nav ul li .link:hover{color:#ddd;background:#141414}.nav ul li .link.disabled,.nav ul li .link:disabled,.nav ul li .link[disabled]{cursor:not-allowed;opacity:.65}.nav.vertical ul,.nav.vertical ul li{display:block}.nav.vertical ul li>*{width:100%;padding:8px 0}.nav.fixed{position:fixed;left:0;top:0;z-index:999;width:100%}.nav.fixed.vertical{height:100%;width:16.66667%}.nav.fixed.vertical ul{width:100%}.nav.fixed.vertical ul li{display:block}.nav+label{display:none;font-weight:700;margin:10px;font-size:1.75em;padding:8px;color:#ddd;background-color:#272727;width:auto;position:fixed;z-index:1000;top:0;right:0}.nav+label:before{position:relative;content:'\2630'}.nav+label:active,.nav+label:focus,.nav+label:hover{background:#141414}@media (max-width:768px){.nav{overflow:auto}.nav.fixed{display:none}.nav.fixed+label{display:block}input[type=checkbox]:checked+.nav.fixed{display:block;width:100%;height:100%}input[type=checkbox]:checked+.nav.fixed ul,input[type=checkbox]:checked+.nav.fixed ul li{display:block}input[type=checkbox]:checked+.nav.fixed ul li *{width:100%;padding:8px 0}input[type=checkbox]:checked+.nav.fixed+label:before{content:'\00d7'}}img.thumb{padding:.25em;border:1px solid #ccc;border-radius:4px}.bordered{border:1px solid rgba(0,0,0,.25)!important}.rounded{border-radius:4px!important}.circle{border-radius:50%!important}.txt-blue{color:#3f84b3!important}.txt-green{color:#2db747!important}.txt-red{color:#ea4848!important}.bg-blue{background-color:#3f84b3!important}.bg-green{background-color:#2db747!important}.bg-red{background-color:#ea4848!important}.caret{display:inline-block;vertical-align:middle;line-height:1;width:0;height:0;border-left:.35em solid transparent;border-right:.35em solid transparent;border-top:.35em solid #222}.close{display:inline-block;vertical-align:middle;line-height:1;color:#aaa;font-size:1.3em;font-weight:700;cursor:pointer}.close:before{content:'\00d7'}.close:active,.close:focus,.close:hover{color:#777}.drg-left{float:left!important}.drg-right{float:right!important}.ct-block{display:block;margin-left:auto;margin-right:auto}.cf:after,.cf:before{content:"";display:table;clear:both}.hidden{display:none!important}.lbl{display:inline-block;padding:6px 10px;color:#eee;background-color:#777;border-radius:4px}.lbl:empty{display:none}.lbl.blue{color:#eee;background:#3f84b3}.lbl.green{color:#eee;background:#2db747}.lbl.red{color:#eee;background:#ea4848}.bdg{display:inline-block;padding:3px 8px;color:#eee;background-color:#777;border-radius:8px}.bdg:empty{display:none}.bdg.blue{color:#eee;background:#3f84b3}.bdg.green{color:#eee;background:#2db747}.bdg.red{color:#eee;background:#ea4848}.tabs{position:relative;min-height:250px;width:100%}.tabs input[type=radio]{display:none}.tabs input[type=radio]+div{display:inline}.tabs input[type=radio]+div>label{position:reative;float:left;margin-right:3px;left:1px;height:40px;padding:8px 14px;color:#2678b3;background-color:#f5f5f5;border:1px solid #ccc;border-radius:4px 4px 0 0;cursor:pointer}.tabs input[type=radio]+div>label:active,.tabs input[type=radio]+div>label:focus,.tabs input[type=radio]+div>label:hover{background:#dcdcdc}.tabs input[type=radio]+div>label+div{position:absolute;z-index:-2;left:0;top:39px;bottom:0;right:0;padding:20px;background:#fff;border:1px solid #ccc}.tabs input[type=radio]:checked+div>label{color:#222;background:#fff;border-top:3px solid #2678b3;border-bottom:1px solid #fff}.tabs input[type=radio]:checked+div>label+div{position:absolute;z-index:-1}.modal{display:none}.modal+div{z-index:997;position:fixed;width:100%;height:0;opacity:0;display:none;transition:opacity .3s ease-out}.modal+div>div{z-index:998;position:relative;width:45%;color:#222;background-color:#f5f5f5;margin:8.5% auto 0;padding:18px;border:1px solid #ccc;border-radius:4px;box-shadow:0 5px 15px rgba(0,0,0,.5)}.modal:checked+div{height:100%;opacity:1;display:block}.modal:checked+div>label{background-color:rgba(0,0,0,.35);position:fixed;width:100%;height:100%;top:0}.modal+div>div .close{position:absolute;top:20px;right:20px}.nav .link.dropdown{cursor:pointer}.nav input[type=checkbox],.nav input[type=checkbox].dropdown+div,.nav input[type=radio],.nav input[type=radio].dropdown+div{display:none}.nav input[type=checkbox]:checked.dropdown+div,.nav input[type=radio]:checked.dropdown+div{display:block;font-size:.8em;margin-left:20px}input[type=checkbox].clps{display:none}input[type=checkbox].clps+div{display:none;color:#222;background-color:#eee;padding:10px;margin-top:5px;border:1px solid #ccc;border-radius:4px}input[type=checkbox]:checked.clps+div{display:block}input[type=radio].acrd{display:none}input[type=radio].acrd+label{width:100%;display:block;color:#222;background-color:#eee;padding:8px;margin-bottom:5px;border:1px solid #ccc;border-radius:4px;cursor:pointer}input[type=radio].acrd+label:active,input[type=radio].acrd+label:focus,input[type=radio].acrd+label:hover{background:#dbdbdb}input[type=radio].acrd+label+div{display:none;color:#222;background-color:#f5f5f5;padding:10px;margin-top:-1px;margin-bottom:5px;border:1px solid #ccc;border-radius:0 0 4px 4px}input[type=radio]:checked.acrd+label{border-radius:4px 4px 0 0;margin-bottom:0}input[type=radio]:checked.acrd+label+div{display:block}.prg{position:relative;overflow:hidden;height:20px;background-color:#d7d7d7;border-radius:4px}.prg>span{float:left;width:0;height:100%;background-color:#3f84b3;text-align:center;font-size:.8em;color:#eee}.prg>span.green{background-color:#2db747;color:#eee}.prg>span.red{background-color:#ea4848;color:#eee}.spinner-dots{display:inline-block;overflow:hidden;height:1.5em;vertical-align:bottom}.spinner-dots:after{display:inline-table;white-space:pre;content:"\A.\A..\A...";animation:spin-dots 1.5s steps(4) infinite}@keyframes spin-dots{to{transform:translateY(-6em)}}.spinner-round{display:inline-block;border:.4em solid rgba(34,34,34,.2);border-left:.4em solid #222;transform:translateZ(0);animation:spin-round 1.5s infinite linear}.spinner-round,.spinner-round:after{border-radius:50%;width:1.5em;height:1.5em}@keyframes spin-round{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.carousel{position:relative;width:80%;height:500px;overflow:hidden;text-align:center;margin:auto;border:1px solid #ccc;border-radius:4px}.carousel input[type=radio]{display:none}.carousel input[type=radio]+div{display:none;position:absolute;width:100%;height:100%;left:0;top:0;padding:10px;background-color:#e7e7e7}.carousel input[type=radio]+div>img{max-width:100%;max-height:100%;margin:auto}.carousel input[type=radio]+div>div{position:absolute;width:100%;height:160px;overflow:auto;left:0;top:340px;background-color:#222;color:#f5f5f5;opacity:.1}.carousel input[type=radio]+div>div:active,.carousel input[type=radio]+div>div:focus,.carousel input[type=radio]+div>div:hover{opacity:.8}.carousel input[type=radio]+div+label{position:relative;z-index:998;cursor:pointer;top:450px;color:#fafafa;font-size:1.8em}.carousel input[type=radio]+div+label:before{content:'\25cb'}.carousel input[type=radio]:checked+div{display:block}.carousel input[type=radio]:checked+div+label:before{content:'\25cf'}.brdcrmb{list-style:none}.brdcrmb>li{display:inline-block}.brdcrmb>li+li:before{content:'\27e9\00a0'}.well{border:1px solid #ccc;border-radius:4px;background-color:#e7e7e7;color:#222;padding:20px}.alert-blue+div{border:1px solid #32688d;border-radius:4px;background-color:#5e9cc7;color:#244c68;padding:20px}input[type=checkbox].alert-blue{display:none}input[type=checkbox].alert-blue+div{display:none;position:relative}input[type=checkbox].alert-blue+div a{font-weight:700;text-decoration:none;color:#173142}input[type=checkbox].alert-blue+div a:active,input[type=checkbox].alert-blue+div a:focus,input[type=checkbox].alert-blue+div a:hover{text-decoration:underline}input[type=checkbox].alert-blue+div .close{position:absolute;top:20px;right:20px;color:#244c68}input[type=checkbox].alert-blue+div .close:active,input[type=checkbox].alert-blue+div .close:focus,input[type=checkbox].alert-blue+div .close:hover{color:#173142}input[type=checkbox]:checked.alert-blue+div{display:block}.alert-green+div{border:1px solid #238e37;border-radius:4px;background-color:#46d160;color:#196527;padding:20px}input[type=checkbox].alert-green{display:none}input[type=checkbox].alert-green+div{display:none;position:relative}input[type=checkbox].alert-green+div a{font-weight:700;text-decoration:none;color:#0f3c17}input[type=checkbox].alert-green+div a:active,input[type=checkbox].alert-green+div a:focus,input[type=checkbox].alert-green+div a:hover{text-decoration:underline}input[type=checkbox].alert-green+div .close{position:absolute;top:20px;right:20px;color:#196527}input[type=checkbox].alert-green+div .close:active,input[type=checkbox].alert-green+div .close:focus,input[type=checkbox].alert-green+div .close:hover{color:#0f3c17}input[type=checkbox]:checked.alert-green+div{display:block}.alert-red+div{border:1px solid #e51a1a;border-radius:4px;background-color:#ef7676;color:#b71515;padding:20px}input[type=checkbox].alert-red{display:none}input[type=checkbox].alert-red+div{display:none;position:relative}input[type=checkbox].alert-red+div a{font-weight:700;text-decoration:none;color:#891010}input[type=checkbox].alert-red+div a:active,input[type=checkbox].alert-red+div a:focus,input[type=checkbox].alert-red+div a:hover{text-decoration:underline}input[type=checkbox].alert-red+div .close{position:absolute;top:20px;right:20px;color:#b71515}input[type=checkbox].alert-red+div .close:active,input[type=checkbox].alert-red+div .close:focus,input[type=checkbox].alert-red+div .close:hover{color:#891010}input[type=checkbox]:checked.alert-red+div{display:block}.panel{border:1px solid #ccc;border-radius:4px;background-color:#f5f5f5;color:#222;padding:0}.panel>*{padding:10px}.panel .head{border-top:0;border-left:0;border-right:0;border-bottom:1px solid #ccc;color:#222;background-color:#e7e7e7;padding:10px;margin:0}input[type=checkbox].popover-top{display:none}input[type=checkbox].popover-top+label{position:relative}input[type=checkbox].popover-top+label>.popover-top{position:absolute;display:none;background-color:#222;color:#f5f5f5;border-radius:5px;padding:7px 10px;z-index:998;width:auto;bottom:49px}input[type=checkbox].popover-top+label>.popover-top:before{position:absolute;display:block;border-top:7px solid #222;border-right:7px solid transparent;border-left:7px solid transparent;bottom:-7px;content:'';left:50%;margin-left:-7px}input[type=checkbox]:checked.popover-top+label>.popover-top{display:block}input[type=checkbox].popover-bottom{display:none}input[type=checkbox].popover-bottom+label{position:relative}input[type=checkbox].popover-bottom+label>.popover-bottom{position:absolute;display:none;background-color:#222;color:#f5f5f5;border-radius:4px;padding:7px 10px;z-index:998;width:auto;top:49px}input[type=checkbox].popover-bottom+label>.popover-bottom:before{position:absolute;display:block;border-bottom:7px solid #222;border-right:7px solid transparent;border-left:7px solid transparent;top:-7px;content:'';left:50%;margin-left:-7px}input[type=checkbox]:checked.popover-bottom+label>.popover-bottom{display:block}.btn-grp .btn{border:1px solid #ccc;margin:0}.btn-grp .btn:not(:first-child):not(:last-child){border-radius:0;border-right:0}.btn-grp .btn:first-child{border-radius:4px 0 0 4px;border-right:0}.btn-grp .btn:last-child{border-radius:0 4px 4px 0}.btn-grp .btn.blue{border:1px solid #32688d;margin:0}.btn-grp .btn.blue:not(:first-child):not(:last-child){border-radius:0;border-right:0}.btn-grp .btn.blue:first-child{border-radius:4px 0 0 4px;border-right:0}.btn-grp .btn.blue:last-child{border-radius:0 4px 4px 0}.btn-grp .btn.green{border:1px solid #238e37;margin:0}.btn-grp .btn.green:not(:first-child):not(:last-child){border-radius:0;border-right:0}.btn-grp .btn.green:first-child{border-radius:4px 0 0 4px;border-right:0}.btn-grp .btn.green:last-child{border-radius:0 4px 4px 0}.btn-grp .btn.red{border:1px solid 1px solid #e51a1a;margin:0}.btn-grp .btn.red:not(:first-child):not(:last-child){border-radius:0;border-right:0}.btn-grp .btn.red:first-child{border-radius:4px 0 0 4px;border-right:0}.btn-grp .btn.red:last-child{border-radius:0 4px 4px 0} \ No newline at end of file +html{font-family:"Helvetica Neue",Helvetica,sans-serif;font-size:1em;line-height:1.5;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0;color:#222;background-color:#f5f5f5}article,aside,details,figcaption,figure,footer,header,img,main,menu,nav,section{display:block}figure{margin:1em 40px}h1,h2,h3,h4,h5,h6{line-height:1.2;margin:.7em 0;font-weight:500}h1 small,h2 small,h3 small,h4 small,h5 small,h6 small{color:#555;font-weight:200}h1{font-size:2em}h2{font-size:1.5em}h3{font-size:1.15em}h4{font-size:1em}h5{font-size:.8em}h6{font-size:.7em}hr{box-sizing:content-box;line-height:1.2;margin:.7em 0;height:0;border:0;border-top:1px solid #cfcfcf}small,sub,sup{font-size:75%}p,pre{margin:0 0 .6em}ol,ul{margin-top:0;margin-bottom:.6em}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}code,kbd,pre{padding:2px 4px;border-radius:4px}code,pre{background-color:#dcdcdc}kbd{color:#fefefe;background-color:#222}pre{display:block;word-break:break-all;word-wrap:break-word}pre code{padding:0;font-size:inherit;color:inherit;white-space:pre-wrap;background-color:transparent;border-radius:0}a{background-color:transparent;text-decoration:none;color:#2678b3}a:active,a:hover{outline-width:0;color:#3793d5}a:visited{color:#1d5c89}a:visited:active,a:visited:hover{color:#2678b3}b,strong{font-weight:bolder}dfn{font-style:italic}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}mark{background-color:#ff3;color:#222}.hidden,[hidden],audio:not([controls]),template{display:none}audio:not([controls]){height:0}audio,progress,video{display:inline-block}progress,sub,sup{vertical-align:baseline}sub,sup{line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none;max-width:100%}svg:not(:root){overflow:hidden}button,hr,input{overflow:visible}button,input,optgroup,select,textarea{font-family:"Helvetica Neue",Helvetica,sans-serif;font-size:100%;line-height:1.2;margin:0}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner,html [type=button]::-moz-focus-inner{border-style:none;padding:0}[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring,html [type=button]:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid #cfcfcf;border-radius:4px;margin:0 2px;padding:.35em .65em .75em}[type=checkbox],[type=radio],legend{box-sizing:border-box;padding:0}legend{color:inherit;display:table;max-width:100%;white-space:normal}textarea{overflow:auto}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button,img{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}.btn,a.btn,a.btn:visited{display:inline-block;border:0;border-radius:4px;margin:2px 0;padding:6px 12px;color:#2a2a2a;background:#eaeaea;cursor:pointer}.btn:active,.btn:focus,.btn:hover,a.btn:active,a.btn:focus,a.btn:hover,a.btn:visited:active,a.btn:visited:focus,a.btn:visited:hover{background:#fdfdfd}.btn.disabled,.btn:disabled,.btn[disabled],a.btn.disabled,a.btn:disabled,a.btn:visited.disabled,a.btn:visited:disabled,a.btn:visited[disabled],a.btn[disabled]{cursor:not-allowed;opacity:.65}.btn.blue,a.btn.blue,a.btn.blue:visited{color:#eee;background:#3f84b3}.btn.blue:active,.btn.blue:focus,.btn.blue:hover,a.btn.blue:active,a.btn.blue:focus,a.btn.blue:hover,a.btn.blue:visited:active,a.btn.blue:visited:focus,a.btn.blue:visited:hover{background:#5597c3}.btn.green,a.btn.green,a.btn.green:visited{color:#eee;background:#2db747}.btn.green:active,.btn.green:focus,.btn.green:hover,a.btn.green:active,a.btn.green:focus,a.btn.green:hover,a.btn.green:visited:active,a.btn.green:visited:focus,a.btn.green:visited:hover{background:#3bcf57}.btn.red,a.btn.red,a.btn.red:visited{color:#eee;background:#ea4848}.btn.red:active,.btn.red:focus,.btn.red:hover,a.btn.red:active,a.btn.red:focus,a.btn.red:hover,a.btn.red:visited:active,a.btn.red:visited:focus,a.btn.red:visited:hover{background:#ee6a6a}.btn.lg{padding:9px 15px;font-size:135%}.btn.sm{padding:4px 8px;font-size:80%}.grid-container{padding-right:0;padding-left:0;margin-right:auto;margin-left:auto;width:100%}.grid-container *{box-sizing:border-box}.row:after,.row:before{content:"";display:table;clear:both}.col{float:left;padding:12px}.xs-1{width:8.33333%}.xs-2{width:16.66667%}.xs-3{width:25%}.xs-4{width:33.33333%}.xs-5{width:41.66667%}.xs-6{width:50%}.xs-7{width:58.33333%}.xs-8{width:66.66667%}.xs-9{width:75%}.xs-10{width:83.33333%}.xs-11{width:91.66667%}.xs-12{width:100%}.lg-no,.md-no,.sm-no{display:block}.xs-no{display:none}@media (min-width:768px){.sm-1{width:8.33333%}.sm-2{width:16.66667%}.sm-3{width:25%}.sm-4{width:33.33333%}.sm-5{width:41.66667%}.sm-6{width:50%}.sm-7{width:58.33333%}.sm-8{width:66.66667%}.sm-9{width:75%}.sm-10{width:83.33333%}.sm-11{width:91.66667%}.sm-12{width:100%}.lg-no,.md-no,.xs-no{display:block}.sm-no{display:none}}@media (min-width:1024px){.md-1{width:8.33333%}.md-2{width:16.66667%}.md-3{width:25%}.md-4{width:33.33333%}.md-5{width:41.66667%}.md-6{width:50%}.md-7{width:58.33333%}.md-8{width:66.66667%}.md-9{width:75%}.md-10{width:83.33333%}.md-11{width:91.66667%}.md-12{width:100%}.lg-no,.sm-no,.xs-no{display:block}.md-no{display:none}}@media (min-width:1280px){.lg-1{width:8.33333%}.lg-2{width:16.66667%}.lg-3{width:25%}.lg-4{width:33.33333%}.lg-5{width:41.66667%}.lg-6{width:50%}.lg-7{width:58.33333%}.lg-8{width:66.66667%}.lg-9{width:75%}.lg-10{width:83.33333%}.lg-11{width:91.66667%}.lg-12{width:100%}.md-no,.sm-no,.xs-no{display:block}.lg-no{display:none}}.frm input:not([type]),.frm input[type$=time],.frm input[type=color],.frm input[type=email],.frm input[type=month],.frm input[type=number],.frm input[type=password],.frm input[type=search],.frm input[type=tel],.frm input[type=text],.frm input[type=url],.frm input[type=week],.frm input[type^=date],.frm select,.frm textarea{box-sizing:border-box;border:1px solid #ccc;border-radius:4px;box-shadow:none}.frm input,.frm select,.frm textarea{display:block;margin:.2em;padding:.3em}.frm input:focus,.frm select:focus,.frm textarea:focus{border-color:#2678b3}.frm input[disabled],.frm select[disabled],.frm textarea[disabled]{cursor:not-allowed;opacity:.65}.frm input:focus:invalid,.frm input:focus:invalid:focus,.frm input:invalid,.frm select:focus:invalid,.frm select:focus:invalid:focus,.frm select:invalid,.frm textarea:focus:invalid,.frm textarea:focus:invalid:focus,.frm textarea:invalid{border-color:#e9322d}.frm input[readonly],.frm select[readonly],.frm textarea[readonly]{background-color:#dcdcdc;border-color:#b5b5b5}.frm input[type=checkbox],.frm input[type=radio]{display:inline-block}.frm select{height:1.9em}.frm select[multiple]{height:auto}.frm label{margin:.5em 0 0 .2em}.frm.aligned input,.frm.aligned label,.frm.aligned select,.frm.aligned textarea,.frm.inline .ctrl-group,.frm.inline input,.frm.inline label,.frm.inline select,.frm.inline textarea{display:inline-block}.frm.aligned .ctrl-group label{text-align:right;vertical-align:middle;width:15em;margin-top:0}.frm .ctrl-group{margin:0 0 .3em}.tbl{border-collapse:collapse;border-spacing:0;empty-cells:show;border:1px solid #bdbdbd}.tbl td,.tbl th{overflow:visible;border-left:1px solid #bdbdbd;border-bottom:none;margin:0;padding:.5em}.tbl thead{background-color:#d9d9d9;color:#111;text-align:left}.tbl tbody{background-color:#f5f5f5;color:#111}.tbl tbody tr:nth-child(2n-1){background-color:#ececec}.tbl.hor td,.tbl.hor th{border-left:none;border-bottom:1px solid #bdbdbd}.tbl.bor td,.tbl.bor th{border-bottom:1px solid #bdbdbd}.nav{box-sizing:border-box;background-color:#272727}.nav .logo{font-size:135%;color:#ddd}.nav ul{display:inline-block;list-style:none;margin:0;padding:0}.nav ul li{display:inline-block;margin:0;white-space:nowrap}.nav ul li>*{display:inline-block;padding:8px;color:#ddd;margin:0}.nav ul li .link:active,.nav ul li .link:focus,.nav ul li .link:hover{color:#ddd;background:#141414}.nav ul li .link.disabled,.nav ul li .link:disabled,.nav ul li .link[disabled]{cursor:not-allowed;opacity:.65}.nav.vertical ul,.nav.vertical ul li{display:block}.nav.vertical ul li>*{width:100%;padding:8px 0}.nav.fixed{position:fixed;left:0;top:0;z-index:999;width:100%}.nav.fixed.vertical{height:100%;width:16.66667%}.nav.fixed.vertical ul{width:100%}.nav.fixed.vertical ul li{display:block}.nav+label{display:none;font-weight:700;margin:10px;font-size:1.75em;padding:8px;color:#ddd;background-color:#272727;width:auto;position:fixed;z-index:1000;top:0;right:0}.nav+label:before{position:relative;content:'\2630'}.nav+label:active,.nav+label:focus,.nav+label:hover{background:#141414}@media (max-width:768px){.nav{overflow:auto}.nav.fixed{display:none}.nav.fixed+label{display:block}input[type=checkbox]:checked+.nav.fixed{display:block;width:100%;height:100%}input[type=checkbox]:checked+.nav.fixed ul,input[type=checkbox]:checked+.nav.fixed ul li{display:block}input[type=checkbox]:checked+.nav.fixed ul li *{width:100%;padding:8px 0}input[type=checkbox]:checked+.nav.fixed+label:before{content:'\00d7'}}img.thumb{padding:.25em;border:1px solid #ccc;border-radius:4px;cursor:pointer}img.thumb:focus,img.thumb:hover,img.thumbactive{border-color:#2678b3}.bordered{border:1px solid rgba(0,0,0,.25)!important}.rounded{border-radius:4px!important}.circle{border-radius:50%!important}.txt-blue{color:#3f84b3!important}.txt-green{color:#2db747!important}.txt-red{color:#ea4848!important}.bg-blue{background-color:#3f84b3!important}.bg-green{background-color:#2db747!important}.bg-red{background-color:#ea4848!important}.caret{display:inline-block;vertical-align:middle;line-height:1;width:0;height:0;border-left:.35em solid transparent;border-right:.35em solid transparent;border-top:.35em solid #222}.close{display:inline-block;vertical-align:middle;line-height:1;color:#aaa;font-size:1.3em;font-weight:700;cursor:pointer}.close:before{content:'\00d7'}.close:active,.close:focus,.close:hover{color:#777}.drg-left{float:left!important}.drg-right{float:right!important}.ct-block{display:block;margin-left:auto;margin-right:auto}.cf:after,.cf:before{content:"";display:table;clear:both}.hidden{display:none!important}.lbl{display:inline-block;padding:6px 10px;color:#eee;background-color:#777;border-radius:4px}.lbl:empty{display:none}.lbl.blue{color:#eee;background:#3f84b3}.lbl.green{color:#eee;background:#2db747}.lbl.red{color:#eee;background:#ea4848}.bdg{display:inline-block;padding:3px 8px;color:#eee;background-color:#777;border-radius:8px}.bdg:empty{display:none}.bdg.blue{color:#eee;background:#3f84b3}.bdg.green{color:#eee;background:#2db747}.bdg.red{color:#eee;background:#ea4848}.tabs{position:relative;min-height:250px;width:100%}.tabs input[type=radio]{display:none}.tabs input[type=radio]+div{display:inline}.tabs input[type=radio]+div>label{position:reative;float:left;margin-right:3px;left:1px;height:40px;padding:8px 14px;color:#2678b3;background-color:#f5f5f5;border:1px solid #ccc;border-radius:4px 4px 0 0;cursor:pointer}.tabs input[type=radio]+div>label:active,.tabs input[type=radio]+div>label:focus,.tabs input[type=radio]+div>label:hover{background:#dcdcdc}.tabs input[type=radio]+div>label+div{position:absolute;z-index:-2;left:0;top:39px;bottom:0;right:0;padding:20px;background:#fff;border:1px solid #ccc}.tabs input[type=radio]:checked+div>label{color:#222;background:#fff;border-top:3px solid #2678b3;border-bottom:1px solid #fff}.tabs input[type=radio]:checked+div>label+div{position:absolute;z-index:-1}.modal{display:none}.modal+div{z-index:997;position:fixed;width:100%;height:0;opacity:0;display:none;transition:opacity .3s ease-out}.modal+div>div{z-index:998;position:relative;width:45%;color:#222;background-color:#f5f5f5;margin:8.5% auto 0;padding:18px;border:1px solid #ccc;border-radius:4px;box-shadow:0 5px 15px rgba(0,0,0,.5)}.modal:checked+div{height:100%;opacity:1;display:block}.modal:checked+div>label{background-color:rgba(0,0,0,.35);position:fixed;width:100%;height:100%;top:0}.modal+div>div .close{position:absolute;top:20px;right:20px}.nav .link.dropdown{cursor:pointer}.nav input[type=checkbox],.nav input[type=checkbox].dropdown+div,.nav input[type=radio],.nav input[type=radio].dropdown+div{display:none}.nav input[type=checkbox]:checked.dropdown+div,.nav input[type=radio]:checked.dropdown+div{display:block;font-size:.8em;margin-left:20px}input[type=checkbox].clps{display:none}input[type=checkbox].clps+div{display:none;color:#222;background-color:#eee;padding:10px;margin-top:5px;border:1px solid #ccc;border-radius:4px}input[type=checkbox]:checked.clps+div{display:block}input[type=radio].acrd{display:none}input[type=radio].acrd+label{width:100%;display:block;color:#222;background-color:#eee;padding:8px;margin-bottom:5px;border:1px solid #ccc;border-radius:4px;cursor:pointer}input[type=radio].acrd+label:active,input[type=radio].acrd+label:focus,input[type=radio].acrd+label:hover{background:#dbdbdb}input[type=radio].acrd+label+div{display:none;color:#222;background-color:#f5f5f5;padding:10px;margin-top:-1px;margin-bottom:5px;border:1px solid #ccc;border-radius:0 0 4px 4px}input[type=radio]:checked.acrd+label{border-radius:4px 4px 0 0;margin-bottom:0}input[type=radio]:checked.acrd+label+div{display:block}.prg{position:relative;overflow:hidden;height:20px;background-color:#d7d7d7;border-radius:4px}.prg>span{float:left;width:0;height:100%;background-color:#3f84b3;text-align:center;font-size:.8em;color:#eee}.prg>span.green{background-color:#2db747;color:#eee}.prg>span.red{background-color:#ea4848;color:#eee}.spinner-dots{display:inline-block;overflow:hidden;height:1.5em;vertical-align:bottom}.spinner-dots:after{display:inline-table;white-space:pre;content:"\A.\A..\A...";animation:spin-dots 1.5s steps(4) infinite}@keyframes spin-dots{to{transform:translateY(-6em)}}.spinner-round{display:inline-block;border:.4em solid rgba(34,34,34,.2);border-left:.4em solid #222;transform:translateZ(0);animation:spin-round 1.5s infinite linear}.spinner-round,.spinner-round:after{border-radius:50%;width:1.5em;height:1.5em}@keyframes spin-round{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.carousel{position:relative;width:80%;height:500px;overflow:hidden;text-align:center;margin:auto;border:1px solid #ccc;border-radius:4px}.carousel input[type=radio]{display:none}.carousel input[type=radio]+div{display:none;position:absolute;width:100%;height:100%;left:0;top:0;padding:10px;background-color:#e7e7e7}.carousel input[type=radio]+div>img{max-width:100%;max-height:100%;margin:auto}.carousel input[type=radio]+div>div{position:absolute;width:100%;height:160px;overflow:auto;left:0;top:340px;background-color:#222;color:#f5f5f5;opacity:.1}.carousel input[type=radio]+div>div:active,.carousel input[type=radio]+div>div:focus,.carousel input[type=radio]+div>div:hover{opacity:.8}.carousel input[type=radio]+div+label{position:relative;z-index:998;cursor:pointer;top:450px;color:#fafafa;font-size:1.8em}.carousel input[type=radio]+div+label:before{content:'\25cb'}.carousel input[type=radio]:checked+div{display:block}.carousel input[type=radio]:checked+div+label:before{content:'\25cf'}.brdcrmb{list-style:none}.brdcrmb>li{display:inline-block}.brdcrmb>li+li:before{content:'\27e9\00a0'}.well{border:1px solid #ccc;border-radius:4px;background-color:#e7e7e7;color:#222;padding:20px}.alert-blue+div{border:1px solid #32688d;border-radius:4px;background-color:#5e9cc7;color:#244c68;padding:20px}input[type=checkbox].alert-blue{display:none}input[type=checkbox].alert-blue+div{display:none;position:relative}input[type=checkbox].alert-blue+div a{font-weight:700;text-decoration:none;color:#173142}input[type=checkbox].alert-blue+div a:active,input[type=checkbox].alert-blue+div a:focus,input[type=checkbox].alert-blue+div a:hover{text-decoration:underline}input[type=checkbox].alert-blue+div .close{position:absolute;top:20px;right:20px;color:#244c68}input[type=checkbox].alert-blue+div .close:active,input[type=checkbox].alert-blue+div .close:focus,input[type=checkbox].alert-blue+div .close:hover{color:#173142}input[type=checkbox]:checked.alert-blue+div{display:block}.alert-green+div{border:1px solid #238e37;border-radius:4px;background-color:#46d160;color:#196527;padding:20px}input[type=checkbox].alert-green{display:none}input[type=checkbox].alert-green+div{display:none;position:relative}input[type=checkbox].alert-green+div a{font-weight:700;text-decoration:none;color:#0f3c17}input[type=checkbox].alert-green+div a:active,input[type=checkbox].alert-green+div a:focus,input[type=checkbox].alert-green+div a:hover{text-decoration:underline}input[type=checkbox].alert-green+div .close{position:absolute;top:20px;right:20px;color:#196527}input[type=checkbox].alert-green+div .close:active,input[type=checkbox].alert-green+div .close:focus,input[type=checkbox].alert-green+div .close:hover{color:#0f3c17}input[type=checkbox]:checked.alert-green+div{display:block}.alert-red+div{border:1px solid #e51a1a;border-radius:4px;background-color:#ef7676;color:#b71515;padding:20px}input[type=checkbox].alert-red{display:none}input[type=checkbox].alert-red+div{display:none;position:relative}input[type=checkbox].alert-red+div a{font-weight:700;text-decoration:none;color:#891010}input[type=checkbox].alert-red+div a:active,input[type=checkbox].alert-red+div a:focus,input[type=checkbox].alert-red+div a:hover{text-decoration:underline}input[type=checkbox].alert-red+div .close{position:absolute;top:20px;right:20px;color:#b71515}input[type=checkbox].alert-red+div .close:active,input[type=checkbox].alert-red+div .close:focus,input[type=checkbox].alert-red+div .close:hover{color:#891010}input[type=checkbox]:checked.alert-red+div{display:block}.panel{border:1px solid #ccc;border-radius:4px;background-color:#f5f5f5;color:#222;padding:0}.panel>*{padding:10px}.panel .head{border-top:0;border-left:0;border-right:0;border-bottom:1px solid #ccc;color:#222;background-color:#e7e7e7;padding:10px;margin:0}input[type=checkbox].popover-top{display:none}input[type=checkbox].popover-top+label{position:relative}input[type=checkbox].popover-top+label>.popover-top{position:absolute;display:none;background-color:#222;color:#f5f5f5;border-radius:5px;padding:7px 10px;z-index:998;width:auto;bottom:49px}input[type=checkbox].popover-top+label>.popover-top:before{position:absolute;display:block;border-top:7px solid #222;border-right:7px solid transparent;border-left:7px solid transparent;bottom:-7px;content:'';left:50%;margin-left:-7px}input[type=checkbox]:checked.popover-top+label>.popover-top{display:block}input[type=checkbox].popover-bottom{display:none}input[type=checkbox].popover-bottom+label{position:relative}input[type=checkbox].popover-bottom+label>.popover-bottom{position:absolute;display:none;background-color:#222;color:#f5f5f5;border-radius:4px;padding:7px 10px;z-index:998;width:auto;top:49px}input[type=checkbox].popover-bottom+label>.popover-bottom:before{position:absolute;display:block;border-bottom:7px solid #222;border-right:7px solid transparent;border-left:7px solid transparent;top:-7px;content:'';left:50%;margin-left:-7px}input[type=checkbox]:checked.popover-bottom+label>.popover-bottom{display:block}.btn-grp .btn{border:1px solid #ccc;margin:0}.btn-grp .btn:not(:first-child):not(:last-child){border-radius:0;border-right:0}.btn-grp .btn:first-child{border-radius:4px 0 0 4px;border-right:0}.btn-grp .btn:last-child{border-radius:0 4px 4px 0}.btn-grp .btn.blue{border:1px solid #32688d;margin:0}.btn-grp .btn.blue:not(:first-child):not(:last-child){border-radius:0;border-right:0}.btn-grp .btn.blue:first-child{border-radius:4px 0 0 4px;border-right:0}.btn-grp .btn.blue:last-child{border-radius:0 4px 4px 0}.btn-grp .btn.green{border:1px solid #238e37;margin:0}.btn-grp .btn.green:not(:first-child):not(:last-child){border-radius:0;border-right:0}.btn-grp .btn.green:first-child{border-radius:4px 0 0 4px;border-right:0}.btn-grp .btn.green:last-child{border-radius:0 4px 4px 0}.btn-grp .btn.red{border:1px solid 1px solid #e51a1a;margin:0}.btn-grp .btn.red:not(:first-child):not(:last-child){border-radius:0;border-right:0}.btn-grp .btn.red:first-child{border-radius:4px 0 0 4px;border-right:0}.btn-grp .btn.red:last-child{border-radius:0 4px 4px 0} \ No newline at end of file diff --git a/flavors/mini-default.scss b/flavors/mini-default.scss index 24c1f23..0c393a1 100644 --- a/flavors/mini-default.scss +++ b/flavors/mini-default.scss @@ -202,6 +202,7 @@ $clearfix-class-name: cf; // Name for the clearfix class $hidden-class-name: hidden; // Name for the hidden class // Colors for the utility and helper classes (you can remove things you // don't need or define more colors if you need them). +$thumbnail-hover-color: $a-color; // Border color of the thumbnail when hovering over it $bordered-radial-radius: 4px; // Border radius of rounded borders $bordered-radial2-radius: 50%; // Border radius of the alternative rounded borders $colored-text1-color: $btn-b-bg-color; // Text color for the colored text style 1 class @@ -214,7 +215,7 @@ $colored-bg-text3-bg-color: $btn-r-bg-color; // Background color for the @import '../scss/mini/utility'; // Use utility mixins to create utility classes with given specs. For more information // refer to the _utility.scss file to check the definitions. -@include make-thumb($thumbnail-class-name, 0.25em, 1px solid #ccc, 4px); +@include make-thumb($thumbnail-class-name, 0.25em, 1px solid #ccc, 4px, $thumbnail-hover-color); @include make-border-generic($bordered-class-name); @include make-border-radial-style($bordered-radial-name, $bordered-radial-radius); @include make-border-radial-style($bordered-radial2-name, $bordered-radial2-radius); diff --git a/flavors/mini-niteowl.css b/flavors/mini-niteowl.css index f880c19..804f984 100644 --- a/flavors/mini-niteowl.css +++ b/flavors/mini-niteowl.css @@ -889,6 +889,7 @@ textarea { - $thumb-padding : The padding between the image and the border. - $thumb-border : The style of the thumbnail's border. - $thumb-border-radius : The border radius of the thumbnail. + - $thumb-hover-color : The color of the thumbnail's border when hovering over it. Notes: - [1] : This style only applies to `img` elements with the class specified in `$thumb-name`. @@ -982,7 +983,10 @@ textarea { img.thumb { padding: 0.25em; border: 1px solid #304251; - border-radius: 4px; } + border-radius: 4px; + cursor: pointer; } + img.thumb:hover, img.thumb:focus, img.thumbactive { + border-color: #6493cd; } .bordered { border: 1px solid rgba(0, 0, 0, 0.25) !important; } diff --git a/flavors/mini-niteowl.min.css b/flavors/mini-niteowl.min.css index 8a67d05..dbcf34e 100644 --- a/flavors/mini-niteowl.min.css +++ b/flavors/mini-niteowl.min.css @@ -1 +1 @@ -html{font-family:"Helvetica Neue",Helvetica,sans-serif;font-size:1em;line-height:1.5;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0;color:#f5f5f5;background-color:#151f29}article,aside,details,figcaption,figure,footer,header,img,main,menu,nav,section{display:block}figure{margin:1em 40px}h1,h2,h3,h4,h5,h6{line-height:1.2;margin:.7em 0;font-weight:500}h1 small,h2 small,h3 small,h4 small,h5 small,h6 small{color:#b5b5b5;font-weight:200}h1{font-size:2em}h2{font-size:1.5em}h3{font-size:1.15em}h4{font-size:1em}h5{font-size:.8em}h6{font-size:.7em}hr{box-sizing:content-box;line-height:1.2;margin:.7em 0;height:0;border:0;border-top:1px solid #304251}small,sub,sup{font-size:75%}p,pre{margin:0 0 .6em}ol,ul{margin-top:0;margin-bottom:.6em}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}code,kbd,pre{padding:2px 4px;border-radius:4px}code,pre{background-color:#040607}kbd{color:#1b2835;background-color:#f5f5f5}pre{display:block;word-break:break-all;word-wrap:break-word}pre code{padding:0;font-size:inherit;color:inherit;white-space:pre-wrap;background-color:transparent;border-radius:0}a{background-color:transparent;text-decoration:none;color:#6493cd}a:active,a:hover{outline-width:0;color:#8baed9}a:visited{color:#3e78c0}a:visited:active,a:visited:hover{color:#6493cd}b,strong{font-weight:bolder}dfn{font-style:italic}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}mark{background-color:#e44b23;color:#f5f5f5}.hidden,[hidden],audio:not([controls]),template{display:none}audio:not([controls]){height:0}audio,progress,video{display:inline-block}progress,sub,sup{vertical-align:baseline}sub,sup{line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none;max-width:100%}svg:not(:root){overflow:hidden}button,hr,input{overflow:visible}button,input,optgroup,select,textarea{font-family:"Helvetica Neue",Helvetica,sans-serif;font-size:100%;line-height:1.2;margin:0}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner,html [type=button]::-moz-focus-inner{border-style:none;padding:0}[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring,html [type=button]:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid #304251;border-radius:4px;margin:0 2px;padding:.35em .65em .75em}[type=checkbox],[type=radio],legend{box-sizing:border-box;padding:0}legend{color:inherit;display:table;max-width:100%;white-space:normal}textarea{overflow:auto}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button,img{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}.btn,a.btn,a.btn:visited{display:inline-block;border:0;border-radius:4px;margin:2px 0;padding:6px 12px;color:#f5f5f5;background:#454545;cursor:pointer}.btn:active,.btn:focus,.btn:hover,a.btn:active,a.btn:focus,a.btn:hover,a.btn:visited:active,a.btn:visited:focus,a.btn:visited:hover{background:#585858}.btn.disabled,.btn:disabled,.btn[disabled],a.btn.disabled,a.btn:disabled,a.btn:visited.disabled,a.btn:visited:disabled,a.btn:visited[disabled],a.btn[disabled]{cursor:not-allowed;opacity:.65}.btn.blue,a.btn.blue,a.btn.blue:visited{color:#f5f5f5;background:#364952}.btn.blue:active,.btn.blue:focus,.btn.blue:hover,a.btn.blue:active,a.btn.blue:focus,a.btn.blue:hover,a.btn.blue:visited:active,a.btn.blue:visited:focus,a.btn.blue:visited:hover{background:#455e69}.btn.green,a.btn.green,a.btn.green:visited{color:#f5f5f5;background:#409f45}.btn.green:active,.btn.green:focus,.btn.green:hover,a.btn.green:active,a.btn.green:focus,a.btn.green:hover,a.btn.green:visited:active,a.btn.green:visited:focus,a.btn.green:visited:hover{background:#398d3d}.btn.red,a.btn.red,a.btn.red:visited{color:#f5f5f5;background:#e72a2a}.btn.red:active,.btn.red:focus,.btn.red:hover,a.btn.red:active,a.btn.red:focus,a.btn.red:hover,a.btn.red:visited:active,a.btn.red:visited:focus,a.btn.red:visited:hover{background:#d31818}.btn.lg{padding:9px 15px;font-size:135%}.btn.sm{padding:4px 8px;font-size:80%}.grid-container{padding-right:0;padding-left:0;margin-right:auto;margin-left:auto;width:100%}.grid-container *{box-sizing:border-box}.row:after,.row:before{content:"";display:table;clear:both}.col{float:left;padding:12px}.xs-1{width:8.33333%}.xs-2{width:16.66667%}.xs-3{width:25%}.xs-4{width:33.33333%}.xs-5{width:41.66667%}.xs-6{width:50%}.xs-7{width:58.33333%}.xs-8{width:66.66667%}.xs-9{width:75%}.xs-10{width:83.33333%}.xs-11{width:91.66667%}.xs-12{width:100%}.lg-no,.md-no,.sm-no{display:block}.xs-no{display:none}@media (min-width:768px){.sm-1{width:8.33333%}.sm-2{width:16.66667%}.sm-3{width:25%}.sm-4{width:33.33333%}.sm-5{width:41.66667%}.sm-6{width:50%}.sm-7{width:58.33333%}.sm-8{width:66.66667%}.sm-9{width:75%}.sm-10{width:83.33333%}.sm-11{width:91.66667%}.sm-12{width:100%}.lg-no,.md-no,.xs-no{display:block}.sm-no{display:none}}@media (min-width:1024px){.md-1{width:8.33333%}.md-2{width:16.66667%}.md-3{width:25%}.md-4{width:33.33333%}.md-5{width:41.66667%}.md-6{width:50%}.md-7{width:58.33333%}.md-8{width:66.66667%}.md-9{width:75%}.md-10{width:83.33333%}.md-11{width:91.66667%}.md-12{width:100%}.lg-no,.sm-no,.xs-no{display:block}.md-no{display:none}}@media (min-width:1280px){.lg-1{width:8.33333%}.lg-2{width:16.66667%}.lg-3{width:25%}.lg-4{width:33.33333%}.lg-5{width:41.66667%}.lg-6{width:50%}.lg-7{width:58.33333%}.lg-8{width:66.66667%}.lg-9{width:75%}.lg-10{width:83.33333%}.lg-11{width:91.66667%}.lg-12{width:100%}.md-no,.sm-no,.xs-no{display:block}.lg-no{display:none}}.frm input:not([type]),.frm input[type$=time],.frm input[type=color],.frm input[type=email],.frm input[type=month],.frm input[type=number],.frm input[type=password],.frm input[type=search],.frm input[type=tel],.frm input[type=text],.frm input[type=url],.frm input[type=week],.frm input[type^=date],.frm select,.frm textarea{box-sizing:border-box;border:1px solid #304251;border-radius:4px;box-shadow:none}.frm input,.frm select,.frm textarea{display:block;margin:.2em;padding:.3em}.frm input:focus,.frm select:focus,.frm textarea:focus{border-color:#f1e05a}.frm input[disabled],.frm select[disabled],.frm textarea[disabled]{cursor:not-allowed;opacity:.65}.frm input:focus:invalid,.frm input:focus:invalid:focus,.frm input:invalid,.frm select:focus:invalid,.frm select:focus:invalid:focus,.frm select:invalid,.frm textarea:focus:invalid,.frm textarea:focus:invalid:focus,.frm textarea:invalid{border-color:#e44b23}.frm input[readonly],.frm select[readonly],.frm textarea[readonly]{background-color:#040607;border-color:#000}.frm input[type=checkbox],.frm input[type=radio]{display:inline-block}.frm select{height:1.9em}.frm select[multiple]{height:auto}.frm label{margin:.5em 0 0 .2em}.frm.aligned input,.frm.aligned label,.frm.aligned select,.frm.aligned textarea,.frm.inline .ctrl-group,.frm.inline input,.frm.inline label,.frm.inline select,.frm.inline textarea{display:inline-block}.frm.aligned .ctrl-group label{text-align:right;vertical-align:middle;width:15em;margin-top:0}.frm .ctrl-group{margin:0 0 .3em}.tbl{border-collapse:collapse;border-spacing:0;empty-cells:show;border:1px solid #304251}.tbl td,.tbl th{overflow:visible;border-left:1px solid #304251;border-bottom:none;margin:0;padding:.5em}.tbl thead{background-color:#3b5773;color:#f5f5f5;text-align:left}.tbl tbody{background-color:#1e2c3a;color:#e1e1e1}.tbl tbody tr:nth-child(2n-1){background-color:#26384b}.tbl.hor td,.tbl.hor th{border-left:none;border-bottom:1px solid #304251}.tbl.bor td,.tbl.bor th{border-bottom:1px solid #304251}.nav{box-sizing:border-box;background-color:#243447}.nav .logo{font-size:135%;color:#f5f5f5}.nav ul{display:inline-block;list-style:none;margin:0;padding:0}.nav ul li{display:inline-block;margin:0;white-space:nowrap}.nav ul li>*{display:inline-block;padding:8px;color:#f5f5f5;margin:0}.nav ul li .link:active,.nav ul li .link:focus,.nav ul li .link:hover{color:#f5f5f5;background:#17212e}.nav ul li .link.disabled,.nav ul li .link:disabled,.nav ul li .link[disabled]{cursor:not-allowed;opacity:.65}.nav.vertical ul,.nav.vertical ul li{display:block}.nav.vertical ul li>*{width:100%;padding:8px 0}.nav.fixed{position:fixed;left:0;top:0;z-index:999;width:100%}.nav.fixed.vertical{height:100%;width:16.66667%}.nav.fixed.vertical ul{width:100%}.nav.fixed.vertical ul li{display:block}.nav+label{display:none;font-weight:700;margin:10px;font-size:1.75em;padding:8px;color:#f5f5f5;background-color:#243447;width:auto;position:fixed;z-index:1000;top:0;right:0}.nav+label:before{position:relative;content:'\2630'}.nav+label:active,.nav+label:focus,.nav+label:hover{background:#17212e}@media (max-width:768px){.nav{overflow:auto}.nav.fixed{display:none}.nav.fixed+label{display:block}input[type=checkbox]:checked+.nav.fixed{display:block;width:100%;height:100%}input[type=checkbox]:checked+.nav.fixed ul,input[type=checkbox]:checked+.nav.fixed ul li{display:block}input[type=checkbox]:checked+.nav.fixed ul li *{width:100%;padding:8px 0}input[type=checkbox]:checked+.nav.fixed+label:before{content:'\00d7'}}img.thumb{padding:.25em;border:1px solid #304251;border-radius:4px}.bordered{border:1px solid rgba(0,0,0,.25)!important}.rounded{border-radius:4px!important}.circle{border-radius:50%!important}.txt-blue{color:#364952!important}.txt-green{color:#409f45!important}.txt-red{color:#e72a2a!important}.bg-blue{background-color:#364952!important}.bg-green{background-color:#409f45!important}.bg-red{background-color:#e72a2a!important}.caret{display:inline-block;vertical-align:middle;line-height:1;width:0;height:0;border-left:.35em solid transparent;border-right:.35em solid transparent;border-top:.35em solid #aaa}.close{display:inline-block;vertical-align:middle;line-height:1;color:#aaa;font-size:1.3em;font-weight:700;cursor:pointer}.close:before{content:'\00d7'}.close:active,.close:focus,.close:hover{color:#777}.drg-left{float:left!important}.drg-right{float:right!important}.ct-block{display:block;margin-left:auto;margin-right:auto}.cf:after,.cf:before{content:"";display:table;clear:both}.hidden{display:none!important}.lbl{display:inline-block;padding:6px 10px;color:#f5f5f5;background-color:#525252;border-radius:4px}.lbl:empty{display:none}.lbl.blue{color:#f5f5f5;background:#364952}.lbl.green{color:#f5f5f5;background:#409f45}.lbl.red{color:#f5f5f5;background:#e72a2a}.bdg{display:inline-block;padding:3px 8px;color:#f5f5f5;background-color:#525252;border-radius:8px}.bdg:empty{display:none}.bdg.blue{color:#f5f5f5;background:#364952}.bdg.green{color:#f5f5f5;background:#409f45}.bdg.red{color:#f5f5f5;background:#e72a2a}.tabs{position:relative;min-height:250px;width:100%}.tabs input[type=radio]{display:none}.tabs input[type=radio]+div{display:inline}.tabs input[type=radio]+div>label{position:reative;float:left;margin-right:3px;left:1px;height:40px;padding:8px 14px;color:#6493cd;background-color:#151f29;border:1px solid #304251;border-radius:4px 4px 0 0;cursor:pointer}.tabs input[type=radio]+div>label:active,.tabs input[type=radio]+div>label:focus,.tabs input[type=radio]+div>label:hover{background:#040607}.tabs input[type=radio]+div>label+div{position:absolute;z-index:-2;left:0;top:39px;bottom:0;right:0;padding:20px;background:#1e2c3a;border:1px solid #304251}.tabs input[type=radio]:checked+div>label{color:#f5f5f5;background:#1e2c3a;border-top:3px solid #6493cd;border-bottom:1px solid #1e2c3a}.tabs input[type=radio]:checked+div>label+div{position:absolute;z-index:-1}.modal{display:none}.modal+div{z-index:997;position:fixed;width:100%;height:0;opacity:0;display:none;transition:opacity .3s ease-out}.modal+div>div{z-index:998;position:relative;width:45%;color:#f5f5f5;background-color:#151f29;margin:8.5% auto 0;padding:18px;border:1px solid #304251;border-radius:4px;box-shadow:0 5px 15px rgba(0,0,0,.5)}.modal:checked+div{height:100%;opacity:1;display:block}.modal:checked+div>label{background-color:rgba(0,0,0,.35);position:fixed;width:100%;height:100%;top:0}.modal+div>div .close{position:absolute;top:20px;right:20px}.nav .link.dropdown{cursor:pointer}.nav input[type=checkbox],.nav input[type=checkbox].dropdown+div,.nav input[type=radio],.nav input[type=radio].dropdown+div{display:none}.nav input[type=checkbox]:checked.dropdown+div,.nav input[type=radio]:checked.dropdown+div{display:block;font-size:.8em;margin-left:20px}input[type=checkbox].clps{display:none}input[type=checkbox].clps+div{display:none;color:#f5f5f5;background-color:#26384b;padding:10px;margin-top:5px;border:1px solid #304251;border-radius:4px}input[type=checkbox]:checked.clps+div{display:block}input[type=radio].acrd{display:none}input[type=radio].acrd+label{width:100%;display:block;color:#f5f5f5;background-color:#26384b;padding:8px;margin-bottom:5px;border:1px solid #304251;border-radius:4px;cursor:pointer}input[type=radio].acrd+label:active,input[type=radio].acrd+label:focus,input[type=radio].acrd+label:hover{background:#192531}input[type=radio].acrd+label+div{display:none;color:#f5f5f5;background-color:#151f29;padding:10px;margin-top:-1px;margin-bottom:5px;border:1px solid #304251;border-radius:0 0 4px 4px}input[type=radio]:checked.acrd+label{border-radius:4px 4px 0 0;margin-bottom:0}input[type=radio]:checked.acrd+label+div{display:block}.prg{position:relative;overflow:hidden;height:20px;background-color:#d7d7d7;border-radius:4px}.prg>span{float:left;width:0;height:100%;background-color:#364952;text-align:center;font-size:.8em;color:#f5f5f5}.prg>span.green{background-color:#409f45;color:#f5f5f5}.prg>span.red{background-color:#e72a2a;color:#f5f5f5}.spinner-dots{display:inline-block;overflow:hidden;height:1.5em;vertical-align:bottom}.spinner-dots:after{display:inline-table;white-space:pre;content:"\A.\A..\A...";animation:spin-dots 1.5s steps(4) infinite}@keyframes spin-dots{to{transform:translateY(-6em)}}.spinner-round{display:inline-block;border:.4em solid rgba(245,245,245,.2);border-left:.4em solid #f5f5f5;transform:translateZ(0);animation:spin-round 1.5s infinite linear}.spinner-round,.spinner-round:after{border-radius:50%;width:1.5em;height:1.5em}@keyframes spin-round{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.carousel{position:relative;width:80%;height:500px;overflow:hidden;text-align:center;margin:auto;border:1px solid #304251;border-radius:4px}.carousel input[type=radio]{display:none}.carousel input[type=radio]+div{display:none;position:absolute;width:100%;height:100%;left:0;top:0;padding:10px;background-color:#e5ebf1}.carousel input[type=radio]+div>img{max-width:100%;max-height:100%;margin:auto}.carousel input[type=radio]+div>div{position:absolute;width:100%;height:160px;overflow:auto;left:0;top:340px;background-color:#151f29;color:#f5f5f5;opacity:.1}.carousel input[type=radio]+div>div:active,.carousel input[type=radio]+div>div:focus,.carousel input[type=radio]+div>div:hover{opacity:.8}.carousel input[type=radio]+div+label{position:relative;z-index:998;cursor:pointer;top:450px;color:#f5f5f5;font-size:1.8em}.carousel input[type=radio]+div+label:before{content:'\25cb'}.carousel input[type=radio]:checked+div{display:block}.carousel input[type=radio]:checked+div+label:before{content:'\25cf'}.brdcrmb{list-style:none}.brdcrmb>li{display:inline-block}.brdcrmb>li+li:before{content:'\27e9\00a0'}.well{border:1px solid #304251;border-radius:4px;background-color:#26384b;color:#f5f5f5;padding:20px}.alert-blue+div{border:1px solid #222e33;border-radius:4px;background-color:#4a6471;color:#0e1215;padding:20px}input[type=checkbox].alert-blue{display:none}input[type=checkbox].alert-blue+div{display:none;position:relative}input[type=checkbox].alert-blue+div a{font-weight:700;text-decoration:none;color:#000}input[type=checkbox].alert-blue+div a:active,input[type=checkbox].alert-blue+div a:focus,input[type=checkbox].alert-blue+div a:hover{text-decoration:underline}input[type=checkbox].alert-blue+div .close{position:absolute;top:20px;right:20px;color:#0e1215}input[type=checkbox].alert-blue+div .close:active,input[type=checkbox].alert-blue+div .close:focus,input[type=checkbox].alert-blue+div .close:hover{color:#000}input[type=checkbox]:checked.alert-blue+div{display:block}.alert-green+div{border:1px solid #317b35;border-radius:4px;background-color:#57bb5c;color:#235625;padding:20px}input[type=checkbox].alert-green{display:none}input[type=checkbox].alert-green+div{display:none;position:relative}input[type=checkbox].alert-green+div a{font-weight:700;text-decoration:none;color:#143216}input[type=checkbox].alert-green+div a:active,input[type=checkbox].alert-green+div a:focus,input[type=checkbox].alert-green+div a:hover{text-decoration:underline}input[type=checkbox].alert-green+div .close{position:absolute;top:20px;right:20px;color:#235625}input[type=checkbox].alert-green+div .close:active,input[type=checkbox].alert-green+div .close:focus,input[type=checkbox].alert-green+div .close:hover{color:#143216}input[type=checkbox]:checked.alert-green+div{display:block}.alert-red+div{border:1px solid #c81616;border-radius:4px;background-color:#ec5858;color:#9a1111;padding:20px}input[type=checkbox].alert-red{display:none}input[type=checkbox].alert-red+div{display:none;position:relative}input[type=checkbox].alert-red+div a{font-weight:700;text-decoration:none;color:#6c0c0c}input[type=checkbox].alert-red+div a:active,input[type=checkbox].alert-red+div a:focus,input[type=checkbox].alert-red+div a:hover{text-decoration:underline}input[type=checkbox].alert-red+div .close{position:absolute;top:20px;right:20px;color:#9a1111}input[type=checkbox].alert-red+div .close:active,input[type=checkbox].alert-red+div .close:focus,input[type=checkbox].alert-red+div .close:hover{color:#6c0c0c}input[type=checkbox]:checked.alert-red+div{display:block}.panel{border:1px solid #304251;border-radius:4px;background-color:#151f29;color:#f5f5f5;padding:0}.panel>*{padding:10px}.panel .head{border-top:0;border-left:0;border-right:0;border-bottom:1px solid #304251;color:#f5f5f5;background-color:#26384b;padding:10px;margin:0}input[type=checkbox].popover-top{display:none}input[type=checkbox].popover-top+label{position:relative}input[type=checkbox].popover-top+label>.popover-top{position:absolute;display:none;background-color:#f5f5f5;color:#151f29;border-radius:5px;padding:7px 10px;z-index:998;width:auto;bottom:49px}input[type=checkbox].popover-top+label>.popover-top:before{position:absolute;display:block;border-top:7px solid #f5f5f5;border-right:7px solid transparent;border-left:7px solid transparent;bottom:-7px;content:'';left:50%;margin-left:-7px}input[type=checkbox]:checked.popover-top+label>.popover-top{display:block}input[type=checkbox].popover-bottom{display:none}input[type=checkbox].popover-bottom+label{position:relative}input[type=checkbox].popover-bottom+label>.popover-bottom{position:absolute;display:none;background-color:#f5f5f5;color:#151f29;border-radius:4px;padding:7px 10px;z-index:998;width:auto;top:49px}input[type=checkbox].popover-bottom+label>.popover-bottom:before{position:absolute;display:block;border-bottom:7px solid #f5f5f5;border-right:7px solid transparent;border-left:7px solid transparent;top:-7px;content:'';left:50%;margin-left:-7px}input[type=checkbox]:checked.popover-bottom+label>.popover-bottom{display:block}.btn-grp .btn{border:1px solid #304251;margin:0}.btn-grp .btn:not(:first-child):not(:last-child){border-radius:0;border-right:0}.btn-grp .btn:first-child{border-radius:4px 0 0 4px;border-right:0}.btn-grp .btn:last-child{border-radius:0 4px 4px 0}.btn-grp .btn.blue{border:1px solid #222e33;margin:0}.btn-grp .btn.blue:not(:first-child):not(:last-child){border-radius:0;border-right:0}.btn-grp .btn.blue:first-child{border-radius:4px 0 0 4px;border-right:0}.btn-grp .btn.blue:last-child{border-radius:0 4px 4px 0}.btn-grp .btn.green{border:1px solid #317b35;margin:0}.btn-grp .btn.green:not(:first-child):not(:last-child){border-radius:0;border-right:0}.btn-grp .btn.green:first-child{border-radius:4px 0 0 4px;border-right:0}.btn-grp .btn.green:last-child{border-radius:0 4px 4px 0}.btn-grp .btn.red{border:1px solid 1px solid #c81616;margin:0}.btn-grp .btn.red:not(:first-child):not(:last-child){border-radius:0;border-right:0}.btn-grp .btn.red:first-child{border-radius:4px 0 0 4px;border-right:0}.btn-grp .btn.red:last-child{border-radius:0 4px 4px 0} \ No newline at end of file +html{font-family:"Helvetica Neue",Helvetica,sans-serif;font-size:1em;line-height:1.5;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0;color:#f5f5f5;background-color:#151f29}article,aside,details,figcaption,figure,footer,header,img,main,menu,nav,section{display:block}figure{margin:1em 40px}h1,h2,h3,h4,h5,h6{line-height:1.2;margin:.7em 0;font-weight:500}h1 small,h2 small,h3 small,h4 small,h5 small,h6 small{color:#b5b5b5;font-weight:200}h1{font-size:2em}h2{font-size:1.5em}h3{font-size:1.15em}h4{font-size:1em}h5{font-size:.8em}h6{font-size:.7em}hr{box-sizing:content-box;line-height:1.2;margin:.7em 0;height:0;border:0;border-top:1px solid #304251}small,sub,sup{font-size:75%}p,pre{margin:0 0 .6em}ol,ul{margin-top:0;margin-bottom:.6em}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}code,kbd,pre{padding:2px 4px;border-radius:4px}code,pre{background-color:#040607}kbd{color:#1b2835;background-color:#f5f5f5}pre{display:block;word-break:break-all;word-wrap:break-word}pre code{padding:0;font-size:inherit;color:inherit;white-space:pre-wrap;background-color:transparent;border-radius:0}a{background-color:transparent;text-decoration:none;color:#6493cd}a:active,a:hover{outline-width:0;color:#8baed9}a:visited{color:#3e78c0}a:visited:active,a:visited:hover{color:#6493cd}b,strong{font-weight:bolder}dfn{font-style:italic}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}mark{background-color:#e44b23;color:#f5f5f5}.hidden,[hidden],audio:not([controls]),template{display:none}audio:not([controls]){height:0}audio,progress,video{display:inline-block}progress,sub,sup{vertical-align:baseline}sub,sup{line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none;max-width:100%}svg:not(:root){overflow:hidden}button,hr,input{overflow:visible}button,input,optgroup,select,textarea{font-family:"Helvetica Neue",Helvetica,sans-serif;font-size:100%;line-height:1.2;margin:0}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner,html [type=button]::-moz-focus-inner{border-style:none;padding:0}[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring,html [type=button]:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid #304251;border-radius:4px;margin:0 2px;padding:.35em .65em .75em}[type=checkbox],[type=radio],legend{box-sizing:border-box;padding:0}legend{color:inherit;display:table;max-width:100%;white-space:normal}textarea{overflow:auto}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button,img{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}.btn,a.btn,a.btn:visited{display:inline-block;border:0;border-radius:4px;margin:2px 0;padding:6px 12px;color:#f5f5f5;background:#454545;cursor:pointer}.btn:active,.btn:focus,.btn:hover,a.btn:active,a.btn:focus,a.btn:hover,a.btn:visited:active,a.btn:visited:focus,a.btn:visited:hover{background:#585858}.btn.disabled,.btn:disabled,.btn[disabled],a.btn.disabled,a.btn:disabled,a.btn:visited.disabled,a.btn:visited:disabled,a.btn:visited[disabled],a.btn[disabled]{cursor:not-allowed;opacity:.65}.btn.blue,a.btn.blue,a.btn.blue:visited{color:#f5f5f5;background:#364952}.btn.blue:active,.btn.blue:focus,.btn.blue:hover,a.btn.blue:active,a.btn.blue:focus,a.btn.blue:hover,a.btn.blue:visited:active,a.btn.blue:visited:focus,a.btn.blue:visited:hover{background:#455e69}.btn.green,a.btn.green,a.btn.green:visited{color:#f5f5f5;background:#409f45}.btn.green:active,.btn.green:focus,.btn.green:hover,a.btn.green:active,a.btn.green:focus,a.btn.green:hover,a.btn.green:visited:active,a.btn.green:visited:focus,a.btn.green:visited:hover{background:#398d3d}.btn.red,a.btn.red,a.btn.red:visited{color:#f5f5f5;background:#e72a2a}.btn.red:active,.btn.red:focus,.btn.red:hover,a.btn.red:active,a.btn.red:focus,a.btn.red:hover,a.btn.red:visited:active,a.btn.red:visited:focus,a.btn.red:visited:hover{background:#d31818}.btn.lg{padding:9px 15px;font-size:135%}.btn.sm{padding:4px 8px;font-size:80%}.grid-container{padding-right:0;padding-left:0;margin-right:auto;margin-left:auto;width:100%}.grid-container *{box-sizing:border-box}.row:after,.row:before{content:"";display:table;clear:both}.col{float:left;padding:12px}.xs-1{width:8.33333%}.xs-2{width:16.66667%}.xs-3{width:25%}.xs-4{width:33.33333%}.xs-5{width:41.66667%}.xs-6{width:50%}.xs-7{width:58.33333%}.xs-8{width:66.66667%}.xs-9{width:75%}.xs-10{width:83.33333%}.xs-11{width:91.66667%}.xs-12{width:100%}.lg-no,.md-no,.sm-no{display:block}.xs-no{display:none}@media (min-width:768px){.sm-1{width:8.33333%}.sm-2{width:16.66667%}.sm-3{width:25%}.sm-4{width:33.33333%}.sm-5{width:41.66667%}.sm-6{width:50%}.sm-7{width:58.33333%}.sm-8{width:66.66667%}.sm-9{width:75%}.sm-10{width:83.33333%}.sm-11{width:91.66667%}.sm-12{width:100%}.lg-no,.md-no,.xs-no{display:block}.sm-no{display:none}}@media (min-width:1024px){.md-1{width:8.33333%}.md-2{width:16.66667%}.md-3{width:25%}.md-4{width:33.33333%}.md-5{width:41.66667%}.md-6{width:50%}.md-7{width:58.33333%}.md-8{width:66.66667%}.md-9{width:75%}.md-10{width:83.33333%}.md-11{width:91.66667%}.md-12{width:100%}.lg-no,.sm-no,.xs-no{display:block}.md-no{display:none}}@media (min-width:1280px){.lg-1{width:8.33333%}.lg-2{width:16.66667%}.lg-3{width:25%}.lg-4{width:33.33333%}.lg-5{width:41.66667%}.lg-6{width:50%}.lg-7{width:58.33333%}.lg-8{width:66.66667%}.lg-9{width:75%}.lg-10{width:83.33333%}.lg-11{width:91.66667%}.lg-12{width:100%}.md-no,.sm-no,.xs-no{display:block}.lg-no{display:none}}.frm input:not([type]),.frm input[type$=time],.frm input[type=color],.frm input[type=email],.frm input[type=month],.frm input[type=number],.frm input[type=password],.frm input[type=search],.frm input[type=tel],.frm input[type=text],.frm input[type=url],.frm input[type=week],.frm input[type^=date],.frm select,.frm textarea{box-sizing:border-box;border:1px solid #304251;border-radius:4px;box-shadow:none}.frm input,.frm select,.frm textarea{display:block;margin:.2em;padding:.3em}.frm input:focus,.frm select:focus,.frm textarea:focus{border-color:#f1e05a}.frm input[disabled],.frm select[disabled],.frm textarea[disabled]{cursor:not-allowed;opacity:.65}.frm input:focus:invalid,.frm input:focus:invalid:focus,.frm input:invalid,.frm select:focus:invalid,.frm select:focus:invalid:focus,.frm select:invalid,.frm textarea:focus:invalid,.frm textarea:focus:invalid:focus,.frm textarea:invalid{border-color:#e44b23}.frm input[readonly],.frm select[readonly],.frm textarea[readonly]{background-color:#040607;border-color:#000}.frm input[type=checkbox],.frm input[type=radio]{display:inline-block}.frm select{height:1.9em}.frm select[multiple]{height:auto}.frm label{margin:.5em 0 0 .2em}.frm.aligned input,.frm.aligned label,.frm.aligned select,.frm.aligned textarea,.frm.inline .ctrl-group,.frm.inline input,.frm.inline label,.frm.inline select,.frm.inline textarea{display:inline-block}.frm.aligned .ctrl-group label{text-align:right;vertical-align:middle;width:15em;margin-top:0}.frm .ctrl-group{margin:0 0 .3em}.tbl{border-collapse:collapse;border-spacing:0;empty-cells:show;border:1px solid #304251}.tbl td,.tbl th{overflow:visible;border-left:1px solid #304251;border-bottom:none;margin:0;padding:.5em}.tbl thead{background-color:#3b5773;color:#f5f5f5;text-align:left}.tbl tbody{background-color:#1e2c3a;color:#e1e1e1}.tbl tbody tr:nth-child(2n-1){background-color:#26384b}.tbl.hor td,.tbl.hor th{border-left:none;border-bottom:1px solid #304251}.tbl.bor td,.tbl.bor th{border-bottom:1px solid #304251}.nav{box-sizing:border-box;background-color:#243447}.nav .logo{font-size:135%;color:#f5f5f5}.nav ul{display:inline-block;list-style:none;margin:0;padding:0}.nav ul li{display:inline-block;margin:0;white-space:nowrap}.nav ul li>*{display:inline-block;padding:8px;color:#f5f5f5;margin:0}.nav ul li .link:active,.nav ul li .link:focus,.nav ul li .link:hover{color:#f5f5f5;background:#17212e}.nav ul li .link.disabled,.nav ul li .link:disabled,.nav ul li .link[disabled]{cursor:not-allowed;opacity:.65}.nav.vertical ul,.nav.vertical ul li{display:block}.nav.vertical ul li>*{width:100%;padding:8px 0}.nav.fixed{position:fixed;left:0;top:0;z-index:999;width:100%}.nav.fixed.vertical{height:100%;width:16.66667%}.nav.fixed.vertical ul{width:100%}.nav.fixed.vertical ul li{display:block}.nav+label{display:none;font-weight:700;margin:10px;font-size:1.75em;padding:8px;color:#f5f5f5;background-color:#243447;width:auto;position:fixed;z-index:1000;top:0;right:0}.nav+label:before{position:relative;content:'\2630'}.nav+label:active,.nav+label:focus,.nav+label:hover{background:#17212e}@media (max-width:768px){.nav{overflow:auto}.nav.fixed{display:none}.nav.fixed+label{display:block}input[type=checkbox]:checked+.nav.fixed{display:block;width:100%;height:100%}input[type=checkbox]:checked+.nav.fixed ul,input[type=checkbox]:checked+.nav.fixed ul li{display:block}input[type=checkbox]:checked+.nav.fixed ul li *{width:100%;padding:8px 0}input[type=checkbox]:checked+.nav.fixed+label:before{content:'\00d7'}}img.thumb{padding:.25em;border:1px solid #304251;border-radius:4px;cursor:pointer}img.thumb:focus,img.thumb:hover,img.thumbactive{border-color:#6493cd}.bordered{border:1px solid rgba(0,0,0,.25)!important}.rounded{border-radius:4px!important}.circle{border-radius:50%!important}.txt-blue{color:#364952!important}.txt-green{color:#409f45!important}.txt-red{color:#e72a2a!important}.bg-blue{background-color:#364952!important}.bg-green{background-color:#409f45!important}.bg-red{background-color:#e72a2a!important}.caret{display:inline-block;vertical-align:middle;line-height:1;width:0;height:0;border-left:.35em solid transparent;border-right:.35em solid transparent;border-top:.35em solid #aaa}.close{display:inline-block;vertical-align:middle;line-height:1;color:#aaa;font-size:1.3em;font-weight:700;cursor:pointer}.close:before{content:'\00d7'}.close:active,.close:focus,.close:hover{color:#777}.drg-left{float:left!important}.drg-right{float:right!important}.ct-block{display:block;margin-left:auto;margin-right:auto}.cf:after,.cf:before{content:"";display:table;clear:both}.hidden{display:none!important}.lbl{display:inline-block;padding:6px 10px;color:#f5f5f5;background-color:#525252;border-radius:4px}.lbl:empty{display:none}.lbl.blue{color:#f5f5f5;background:#364952}.lbl.green{color:#f5f5f5;background:#409f45}.lbl.red{color:#f5f5f5;background:#e72a2a}.bdg{display:inline-block;padding:3px 8px;color:#f5f5f5;background-color:#525252;border-radius:8px}.bdg:empty{display:none}.bdg.blue{color:#f5f5f5;background:#364952}.bdg.green{color:#f5f5f5;background:#409f45}.bdg.red{color:#f5f5f5;background:#e72a2a}.tabs{position:relative;min-height:250px;width:100%}.tabs input[type=radio]{display:none}.tabs input[type=radio]+div{display:inline}.tabs input[type=radio]+div>label{position:reative;float:left;margin-right:3px;left:1px;height:40px;padding:8px 14px;color:#6493cd;background-color:#151f29;border:1px solid #304251;border-radius:4px 4px 0 0;cursor:pointer}.tabs input[type=radio]+div>label:active,.tabs input[type=radio]+div>label:focus,.tabs input[type=radio]+div>label:hover{background:#040607}.tabs input[type=radio]+div>label+div{position:absolute;z-index:-2;left:0;top:39px;bottom:0;right:0;padding:20px;background:#1e2c3a;border:1px solid #304251}.tabs input[type=radio]:checked+div>label{color:#f5f5f5;background:#1e2c3a;border-top:3px solid #6493cd;border-bottom:1px solid #1e2c3a}.tabs input[type=radio]:checked+div>label+div{position:absolute;z-index:-1}.modal{display:none}.modal+div{z-index:997;position:fixed;width:100%;height:0;opacity:0;display:none;transition:opacity .3s ease-out}.modal+div>div{z-index:998;position:relative;width:45%;color:#f5f5f5;background-color:#151f29;margin:8.5% auto 0;padding:18px;border:1px solid #304251;border-radius:4px;box-shadow:0 5px 15px rgba(0,0,0,.5)}.modal:checked+div{height:100%;opacity:1;display:block}.modal:checked+div>label{background-color:rgba(0,0,0,.35);position:fixed;width:100%;height:100%;top:0}.modal+div>div .close{position:absolute;top:20px;right:20px}.nav .link.dropdown{cursor:pointer}.nav input[type=checkbox],.nav input[type=checkbox].dropdown+div,.nav input[type=radio],.nav input[type=radio].dropdown+div{display:none}.nav input[type=checkbox]:checked.dropdown+div,.nav input[type=radio]:checked.dropdown+div{display:block;font-size:.8em;margin-left:20px}input[type=checkbox].clps{display:none}input[type=checkbox].clps+div{display:none;color:#f5f5f5;background-color:#26384b;padding:10px;margin-top:5px;border:1px solid #304251;border-radius:4px}input[type=checkbox]:checked.clps+div{display:block}input[type=radio].acrd{display:none}input[type=radio].acrd+label{width:100%;display:block;color:#f5f5f5;background-color:#26384b;padding:8px;margin-bottom:5px;border:1px solid #304251;border-radius:4px;cursor:pointer}input[type=radio].acrd+label:active,input[type=radio].acrd+label:focus,input[type=radio].acrd+label:hover{background:#192531}input[type=radio].acrd+label+div{display:none;color:#f5f5f5;background-color:#151f29;padding:10px;margin-top:-1px;margin-bottom:5px;border:1px solid #304251;border-radius:0 0 4px 4px}input[type=radio]:checked.acrd+label{border-radius:4px 4px 0 0;margin-bottom:0}input[type=radio]:checked.acrd+label+div{display:block}.prg{position:relative;overflow:hidden;height:20px;background-color:#d7d7d7;border-radius:4px}.prg>span{float:left;width:0;height:100%;background-color:#364952;text-align:center;font-size:.8em;color:#f5f5f5}.prg>span.green{background-color:#409f45;color:#f5f5f5}.prg>span.red{background-color:#e72a2a;color:#f5f5f5}.spinner-dots{display:inline-block;overflow:hidden;height:1.5em;vertical-align:bottom}.spinner-dots:after{display:inline-table;white-space:pre;content:"\A.\A..\A...";animation:spin-dots 1.5s steps(4) infinite}@keyframes spin-dots{to{transform:translateY(-6em)}}.spinner-round{display:inline-block;border:.4em solid rgba(245,245,245,.2);border-left:.4em solid #f5f5f5;transform:translateZ(0);animation:spin-round 1.5s infinite linear}.spinner-round,.spinner-round:after{border-radius:50%;width:1.5em;height:1.5em}@keyframes spin-round{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.carousel{position:relative;width:80%;height:500px;overflow:hidden;text-align:center;margin:auto;border:1px solid #304251;border-radius:4px}.carousel input[type=radio]{display:none}.carousel input[type=radio]+div{display:none;position:absolute;width:100%;height:100%;left:0;top:0;padding:10px;background-color:#e5ebf1}.carousel input[type=radio]+div>img{max-width:100%;max-height:100%;margin:auto}.carousel input[type=radio]+div>div{position:absolute;width:100%;height:160px;overflow:auto;left:0;top:340px;background-color:#151f29;color:#f5f5f5;opacity:.1}.carousel input[type=radio]+div>div:active,.carousel input[type=radio]+div>div:focus,.carousel input[type=radio]+div>div:hover{opacity:.8}.carousel input[type=radio]+div+label{position:relative;z-index:998;cursor:pointer;top:450px;color:#f5f5f5;font-size:1.8em}.carousel input[type=radio]+div+label:before{content:'\25cb'}.carousel input[type=radio]:checked+div{display:block}.carousel input[type=radio]:checked+div+label:before{content:'\25cf'}.brdcrmb{list-style:none}.brdcrmb>li{display:inline-block}.brdcrmb>li+li:before{content:'\27e9\00a0'}.well{border:1px solid #304251;border-radius:4px;background-color:#26384b;color:#f5f5f5;padding:20px}.alert-blue+div{border:1px solid #222e33;border-radius:4px;background-color:#4a6471;color:#0e1215;padding:20px}input[type=checkbox].alert-blue{display:none}input[type=checkbox].alert-blue+div{display:none;position:relative}input[type=checkbox].alert-blue+div a{font-weight:700;text-decoration:none;color:#000}input[type=checkbox].alert-blue+div a:active,input[type=checkbox].alert-blue+div a:focus,input[type=checkbox].alert-blue+div a:hover{text-decoration:underline}input[type=checkbox].alert-blue+div .close{position:absolute;top:20px;right:20px;color:#0e1215}input[type=checkbox].alert-blue+div .close:active,input[type=checkbox].alert-blue+div .close:focus,input[type=checkbox].alert-blue+div .close:hover{color:#000}input[type=checkbox]:checked.alert-blue+div{display:block}.alert-green+div{border:1px solid #317b35;border-radius:4px;background-color:#57bb5c;color:#235625;padding:20px}input[type=checkbox].alert-green{display:none}input[type=checkbox].alert-green+div{display:none;position:relative}input[type=checkbox].alert-green+div a{font-weight:700;text-decoration:none;color:#143216}input[type=checkbox].alert-green+div a:active,input[type=checkbox].alert-green+div a:focus,input[type=checkbox].alert-green+div a:hover{text-decoration:underline}input[type=checkbox].alert-green+div .close{position:absolute;top:20px;right:20px;color:#235625}input[type=checkbox].alert-green+div .close:active,input[type=checkbox].alert-green+div .close:focus,input[type=checkbox].alert-green+div .close:hover{color:#143216}input[type=checkbox]:checked.alert-green+div{display:block}.alert-red+div{border:1px solid #c81616;border-radius:4px;background-color:#ec5858;color:#9a1111;padding:20px}input[type=checkbox].alert-red{display:none}input[type=checkbox].alert-red+div{display:none;position:relative}input[type=checkbox].alert-red+div a{font-weight:700;text-decoration:none;color:#6c0c0c}input[type=checkbox].alert-red+div a:active,input[type=checkbox].alert-red+div a:focus,input[type=checkbox].alert-red+div a:hover{text-decoration:underline}input[type=checkbox].alert-red+div .close{position:absolute;top:20px;right:20px;color:#9a1111}input[type=checkbox].alert-red+div .close:active,input[type=checkbox].alert-red+div .close:focus,input[type=checkbox].alert-red+div .close:hover{color:#6c0c0c}input[type=checkbox]:checked.alert-red+div{display:block}.panel{border:1px solid #304251;border-radius:4px;background-color:#151f29;color:#f5f5f5;padding:0}.panel>*{padding:10px}.panel .head{border-top:0;border-left:0;border-right:0;border-bottom:1px solid #304251;color:#f5f5f5;background-color:#26384b;padding:10px;margin:0}input[type=checkbox].popover-top{display:none}input[type=checkbox].popover-top+label{position:relative}input[type=checkbox].popover-top+label>.popover-top{position:absolute;display:none;background-color:#f5f5f5;color:#151f29;border-radius:5px;padding:7px 10px;z-index:998;width:auto;bottom:49px}input[type=checkbox].popover-top+label>.popover-top:before{position:absolute;display:block;border-top:7px solid #f5f5f5;border-right:7px solid transparent;border-left:7px solid transparent;bottom:-7px;content:'';left:50%;margin-left:-7px}input[type=checkbox]:checked.popover-top+label>.popover-top{display:block}input[type=checkbox].popover-bottom{display:none}input[type=checkbox].popover-bottom+label{position:relative}input[type=checkbox].popover-bottom+label>.popover-bottom{position:absolute;display:none;background-color:#f5f5f5;color:#151f29;border-radius:4px;padding:7px 10px;z-index:998;width:auto;top:49px}input[type=checkbox].popover-bottom+label>.popover-bottom:before{position:absolute;display:block;border-bottom:7px solid #f5f5f5;border-right:7px solid transparent;border-left:7px solid transparent;top:-7px;content:'';left:50%;margin-left:-7px}input[type=checkbox]:checked.popover-bottom+label>.popover-bottom{display:block}.btn-grp .btn{border:1px solid #304251;margin:0}.btn-grp .btn:not(:first-child):not(:last-child){border-radius:0;border-right:0}.btn-grp .btn:first-child{border-radius:4px 0 0 4px;border-right:0}.btn-grp .btn:last-child{border-radius:0 4px 4px 0}.btn-grp .btn.blue{border:1px solid #222e33;margin:0}.btn-grp .btn.blue:not(:first-child):not(:last-child){border-radius:0;border-right:0}.btn-grp .btn.blue:first-child{border-radius:4px 0 0 4px;border-right:0}.btn-grp .btn.blue:last-child{border-radius:0 4px 4px 0}.btn-grp .btn.green{border:1px solid #317b35;margin:0}.btn-grp .btn.green:not(:first-child):not(:last-child){border-radius:0;border-right:0}.btn-grp .btn.green:first-child{border-radius:4px 0 0 4px;border-right:0}.btn-grp .btn.green:last-child{border-radius:0 4px 4px 0}.btn-grp .btn.red{border:1px solid 1px solid #c81616;margin:0}.btn-grp .btn.red:not(:first-child):not(:last-child){border-radius:0;border-right:0}.btn-grp .btn.red:first-child{border-radius:4px 0 0 4px;border-right:0}.btn-grp .btn.red:last-child{border-radius:0 4px 4px 0} \ No newline at end of file diff --git a/flavors/mini-niteowl.scss b/flavors/mini-niteowl.scss index 47fafdc..59f7fec 100644 --- a/flavors/mini-niteowl.scss +++ b/flavors/mini-niteowl.scss @@ -202,6 +202,7 @@ $clearfix-class-name: cf; // Name for the clearfix class $hidden-class-name: hidden; // Name for the hidden class // Colors for the utility and helper classes (you can remove things you // don't need or define more colors if you need them). +$thumbnail-hover-color: $a-color; // Border color of the thumbnail when hovering over it $bordered-radial-radius: 4px; // Border radius of rounded borders $bordered-radial2-radius: 50%; // Border radius of the alternative rounded borders $colored-text1-color: $btn-b-bg-color; // Text color for the colored text style 1 class @@ -214,7 +215,7 @@ $colored-bg-text3-bg-color: $btn-r-bg-color; // Background color for the @import '../scss/mini/utility'; // Use utility mixins to create utility classes with given specs. For more information // refer to the _utility.scss file to check the definitions. -@include make-thumb($thumbnail-class-name, 0.25em, 1px solid #304251, 4px); +@include make-thumb($thumbnail-class-name, 0.25em, 1px solid #304251, 4px, $thumbnail-hover-color); @include make-border-generic($bordered-class-name); @include make-border-radial-style($bordered-radial-name, $bordered-radial-radius); @include make-border-radial-style($bordered-radial2-name, $bordered-radial2-radius); diff --git a/scss/flavor.scss b/scss/flavor.scss deleted file mode 100644 index 38a2ab9..0000000 --- a/scss/flavor.scss +++ /dev/null @@ -1,420 +0,0 @@ -//==================================================================== -// This is the file you should edit to make the flavor you want. -// Please read the instructions carefully. -//==================================================================== -// !! IMPORTANT !! -// Please copy this file or rename it, if you want to keep the default -// flavor definitions file. -//==================================================================== -// Update the comment below to include it in your flavor, providing the information -// you want along with your customized flavor. You can also delete it if you don't -// want it in your final CSS file. -/* - Flavor name: Default (mini-default) - Author: Angelos Chalaris (chalarangelo@gmail.com) - mini.css version: v1.0 (September, 2016) -*/ -//==================================================================== -// -// CORE COMPONENTS (located in `mini`): -// -//==================================================================== -// Variable definitions for the Base module (_base.scss) -//==================================================================== -// Basic rules for body -$body-margin: 0; // Margin for body -$body-bg-color: #f5f5f5; // Body background color -$body-color: #222; // Body text color -// Basic typography rules -$base-fonts: "\"Helvetica Neue\", Helvetica, sans-serif"; // Font-family -$base-font-size: 1em; // Font-size -$base-line-height: 1.5; // Line-height -// Rules for headers (multipliers apply on top of the basic typography rules) -$h1-multiplier: 2; // Header 1 font-sze multiplier -$h2-multiplier: 1.5; // Header 2 font-sze multiplier -$h3-multiplier: 1.15; // Header 3 font-sze multiplier -$h4-multiplier: 1; // Header 4 font-sze multiplier -$h5-multiplier: 0.8; // Header 5 font-sze multiplier -$h6-multiplier: 0.7; // Header 6 font-sze multiplier -$header-line-height-multiplier: 0.8; // Multiplier for line height of headers -$header-margin: 0.7em 0; // Margin for headers -$header-font-weight: 500; // Font weight for headers -// Rules for small elements inside headers -$header-small-color: lighten($body-color, 20%); // Header small text color -$header-small-font-weight: 200; // Header small font weight -// Rules for horizontal rules -$hr-line-height-multiplier: 0.8; // Multiplier for line height of horizontal rule -$hr-margin: 0.7em 0; // Margin for horizontal rule -$hr-border-style: 1px solid darken($body-bg-color, 15%); // Color and style of horizontal rule -// Common content typography rules (paragraphs, lists etc.) -$p-margin: 0 0 0.6em; // Margin for paragraph and pre elements -$small-font-size: 75%; // Font size for small, sub and sup elements -$sub-bottom: -0.25em; // Sub bottom -$sup-top: -0.5em; // Sup top -$list-margin-top: 0; // Top margin for lists -$list-margin-bottom: 0.6em; // Bottom margin for lists -$mark-bg-color: #ffff33; // Mark background color -$mark-color: $body-color; // Mark text color -// Code, preformatted and keyboard rules -$code-fonts: monospace, monospace; // Font-family for code, pre, kbd, samp elements -$code-padding: 2px 4px; // Padding for code and pre elements -$code-bg-color: darken($body-bg-color, 10%); // Code and pre background color -$code-border-radius: 4px; // Border radius for code, pre and kbd elements -$kbd-bg-color: $body-color; // Kbd background color -$kbd-color: lighten($body-bg-color, 3.5%); // Kbd text color -// Hyperlink rules -$a-color: #2678b3; // Hyperlink text color -$a-hover-color: lighten($a-color, 10%); // Hyperlink hover text color -$a-visited-color: darken($a-color, 10%); // Hyperlink visited text color -$a-visited-hover-color: $a-color; // Hyperlink visited hover text color -// Button, input and form rules -$button-fonts: $base-fonts; // Font-family for buttons and inputs -$button-font-size: 100%; // Font size for buttons and inputs -$button-line-height-multiplier: 0.8; // Multiplier for line height of buttons and inputs -$button-margin: 0; // Margin for buttons and inputs -$fieldset-border: 1px solid darken($body-bg-color, 15%); // Border style for fieldset -$fieldset-border-radius: 4px; // Border radius for fieldset -$fieldset-margin: 0 2px; // Margin for fieldset -$fieldset-padding: 0.35em 0.65em 0.75em; // Padding for fieldset -// Enable base (_base.scss) and use the variables defined above. -@import 'mini/base'; -//==================================================================== -// Variable definitions for the Button module (_button.scss) -//==================================================================== -// Colors and styles (you can remove things you don't need or define more -// colors if you need them). -$btn-default-color: #2a2a2a; // Default text color for buttons -$btn-alt-color: #eeeeee; // Alternative text color for buttons -$btn-default-bg-color: #eaeaea; // Default background color for buttons -$btn-b-bg-color: #3f84b3; // Color for button style 1 -$btn-g-bg-color: #2db747; // Color for button style 2 -$btn-r-bg-color: #ea4848; // Color for button style 3 -// Button class names (you can remove things you don't need or define more -// classes if you need them). -$btn-class-name: btn; // Name for the base button class -$btn-style1-name: 'blue'; // Name for button style 1 class -$btn-style2-name: 'green'; // Name for button style 2 class -$btn-style3-name: 'red'; // Name for button style 3 class -$btn-size1-name: lg; // Name for the button size 1 class -$btn-size2-name: sm; // Name for the button size 2 class -// Enable buttons (_button.scss). (Use individual mixins below to use.) -@import 'mini/button'; -// Use button mixins to create buttons with given specs. For more information -// refer to the _button.scss file to check the definitions. -@include make-btn($btn-class-name, 0, 4px, 2px 0, 6px 12px, $btn-default-color, $btn-default-bg-color, lighten, 7.5%, pointer, not-allowed, .65); -@include make-btn-style($btn-class-name, $btn-style1-name, $btn-alt-color, $btn-b-bg-color); -@include make-btn-style($btn-class-name, $btn-style2-name, $btn-alt-color, $btn-g-bg-color); -@include make-btn-style($btn-class-name, $btn-style3-name, $btn-alt-color, $btn-r-bg-color); -@include make-btn-size($btn-class-name, $btn-size1-name, 9px 15px, 135%); -@include make-btn-size($btn-class-name, $btn-size2-name, 4px 8px, 80%); -//==================================================================== -// Variable definitions for the Grid module (_grid.scss) -//==================================================================== -// Class names for the grid system -$grid-container-name: grid-container; // Name for the grid container class -$grid-row-name: row; // Name for the grid's row class -$grid-column-name: col; // Name for the grid's column class -$grid-extra-small-device-name: xs; // Name for extra small devices -$grid-small-device-name: sm; // Name for small devices -$grid-medium-device-name: md; // Name for medium devices -$grid-large-device-name: lg; // Name for large devices -$grid-no-show-name: no; // Name for hidden grid elements class -// Grid breakpoints for different screens -$grid-small-breakpoint: 768px; // Breakpoint for extra small to small devices -$grid-medium-breakpoint: 1024px; // Breakpoint for small to medium devices -$grid-large-breakpong: 1280px; // Breakpoint for medium to large devices -// Enable grid(s) (_grid.scss). (Use individual mixins below to use.) -@import 'mini/grid'; -// Use grid mixin to create grid with given specs. For more information -// refer to the grid.scss file to check the definitions. -@include make-grid($grid-container-name, 0, $grid-row-name, $grid-column-name, 12, 12px, $grid-extra-small-device-name, $grid-small-device-name, $grid-medium-device-name, $grid-large-device-name, $grid-no-show-name, $grid-small-breakpoint, $grid-medium-breakpoint, $grid-large-breakpoint); -//==================================================================== -// Variable definitions for the Form module (_form.scss) -//==================================================================== -// Class names for the forms and components -$form-class-name: frm; // Name for the form class -$form-control-group-name: ctrl-group; // Name for the form's control group class -// Colors for form components -$form-focus-color: #2678b3; // Color for focused form element outline -$form-invalid-color: #e9322d; // Color for invalid form element outline -// Enable forms (_form.scss). (Use individual mixins below to use.) -@import 'mini/form'; -// Use form mixin to create form with given specs. For more information -// refer to the _form.scss file to check the definitions. -@include make-frm($form-class-name, 1px solid #ccc, 4px, 0.2em, 0.3em, $form-focus-color, $form-invalid-color, not-allowed, .65, darken($body-bg-color,10%), darken($body-bg-color,25%), 1.9em, 0.5em 0 0 0.2em, $form-control-group-name, 0 0 0.3em 0, inline, aligned,15em); -//==================================================================== -// Variable definitions for the Table module (_table.scss) -//==================================================================== -// Class names for the tables -$table-class-name: tbl; // Name for the table class -$table-horizontal-name: hor; // Name for the horizontal style tables -$table-bordered-name: bor; // Name for the bordered style tables -// Colors for the tables -$table-head-bg-color: #d9d9d9; // Table header background color -$table-head-color: #111; // Table header text color -$table-body-bg-color: #f5f5f5; // Table body bakground color -$table-body-alt-bg-color: #ececec; // Table body alternative background color -$table-body-color: #111; // Table body text color -// Enable tables (_table.scss). (Use individual mixins below to use.) -@import 'mini/table'; -// Use table mixin to create table with given specs. For more information -// refer to the _table.scss file to check the definitions. -@include make-tbl($table-class-name, 1px solid #bdbdbd, 0, 0.5em, $table-head-bg-color, $table-head-color, $table-body-bg-color,$table-body-alt-bg-color, $table-body-color, $table-horizontal-name, $table-bordered-name); -//==================================================================== -// Variable definitions for the Navigation module (_nav.scss) -//==================================================================== -// Class names for the navigation elements -$navigation-class-name: nav; // Name for the navigation bar class -$navigation-vertical-name: vertical; // Name for the vertical navigation class -$navigation-fixed-name: fixed; // Name for the fixed navigation class -$navigation-logo-name: logo; // Name for the navigation logo class -$navigation-link-name: link; // Name for the navigation link class -// Colors and breakpoint for the navigation -$navigation-bg-color: #272727; // Background color for the navigation bar -$navigation-color: #ddd; // Color for the navigation text -$navigation-fixed-collapse-breakpoint: 768px; // Breakpoint for fixed naviation collapse -// Enable navigation (_nav.scss). (Use individual mixins below to use.) -@import 'mini/nav'; -// Use nav mixin to create nav with default specs. For more information -// refer to the _nav.scss file to check the definitions. -@include make-nav($navigation-class-name, $navigation-vertical-name, $navigation-fixed-name, $navigation-logo-name, 135%, $navigation-link-name, 8px, $navigation-color, $navigation-bg-color, darken, 7.5%, not-allowed, .65, left, 12, 2, $navigation-fixed-collapse-breakpoint, top-right, 10px, 1.75em); -//==================================================================== -// Variable definitions for the Utilities and Helper Classes module (_utility.scss) -//==================================================================== -// Class names for the utility and helper classes (you can remove things you -// don't need or define more if you need them). -$thumbnail-class-name: thumb; // Name for the thumbnail class -$bordered-class-name: bordered; // Name for the bordered class -$bordered-radial-name: rounded; // Name for the rounded border class -$bordered-radial2-name: circle; // Name for the alternative rounded border class -$colored-text1-name: txt-blue; // Name for the colored text style 1 class -$colored-text2-name: txt-green; // Name for the colored text style 2 class -$colored-text3-name: txt-red; // Name for the colored text style 3 class -$colored-bg-text1-name: bg-blue; // Name for the colored background text style 1 class -$colored-bg-text2-name: bg-green; // Name for the colored background text style 2 class -$colored-bg-text3-name: bg-red; // Name for the colored background text style 3 class -$drag-left-name: drg-left; // Name for the drag-left class -$drag-right-name: drg-right; // Name for the drag-right class -$center-block-name: ct-block; // Name for the center block class -$caret-class-name: caret; // Name for the caret class -$close-class-name: close; // Name for the close class -$clearfix-class-name: cf; // Name for the clearfix class -$hidden-class-name: hidden; // Name for the hidden class -// Colors for the utility and helper classes (you can remove things you -// don't need or define more colors if you need them). -$bordered-radial-radius: 4px; // Border radius of rounded borders -$bordered-radial2-radius: 50%; // Border radius of the alternative rounded borders -$colored-text1-color: $btn-b-bg-color; // Text color for the colored text style 1 class -$colored-text2-color: $btn-g-bg-color; // Text color for the colored text style 2 class -$colored-text3-color: $btn-r-bg-color; // Text color for the colored text style 3 class -$colored-bg-text1-bg-color: $btn-b-bg-color; // Background color for the colored text style 1 class -$colored-bg-text2-bg-color: $btn-g-bg-color; // Background color for the colored text style 2 class -$colored-bg-text3-bg-color: $btn-r-bg-color; // Background color for the colored text style 3 class -// Enable utilities (_utility.scss). (Use individual mixins below to use.) -@import 'mini/utility'; -// Use utility mixins to create utility classes with given specs. For more information -// refer to the _utility.scss file to check the definitions. -@include make-thumb($thumbnail-class-name, 0.25em, 1px solid #ccc, 4px); -@include make-border-generic($bordered-class-name); -@include make-border-radial-style($bordered-radial-name, $bordered-radial-radius); -@include make-border-radial-style($bordered-radial2-name, $bordered-radial2-radius); -@include make-colored-text($colored-text1-name, $colored-text1-color); -@include make-colored-text($colored-text2-name, $colored-text2-color); -@include make-colored-text($colored-text3-name, $colored-text3-color); -@include make-colored-bg-text($colored-bg-text1-name, $colored-bg-text1-bg-color); -@include make-colored-bg-text($colored-bg-text2-name, $colored-bg-text2-bg-color); -@include make-colored-bg-text($colored-bg-text3-name, $colored-bg-text3-bg-color); -@include make-caret-down($caret-class-name, 0.35em, #222); -@include make-close($close-class-name, #aaa, pointer, 1.3em, 700, #777); -@include make-drags($drag-left-name, $drag-right-name); -@include make-center-block($center-block-name); -@include make-clearfix($clearfix-class-name); -@include make-hidden($hidden-class-name); -//==================================================================== -// -// EXTRA COMPONENTS (located in `mini-extra`): -// -//==================================================================== -// Variable definitions for the Label module (_label.scss) -//==================================================================== -// Colors and styles (you can remove things you don't need or define more -// colors if you need them). -$lbl-default-color: $btn-alt-color; // Default text color for labels/badges -$lbl-default-bg-color: #777; // Default background color for labels/badges -$lbl-b-bg-color: $btn-b-bg-color; // Color for labels/badges style 1 -$lbl-g-bg-color: $btn-g-bg-color; // Color for labels/badges style 2 -$lbl-r-bg-color: $btn-r-bg-color; // Color for labels/badges style 3 -// Label class names (you can remove things you don't need or define more -// classes if you need them). -$lbl-class-name: lbl; // Name for the base labels class -$lbl-style1-name: 'blue'; // Name for labels/badges style 1 class -$lbl-style2-name: 'green'; // Name for labels/badges style 2 class -$lbl-style3-name: 'red'; // Name for labels/badges style 3 class -$badge-class-name: bdg; // Name for the base badges class -// Enable labels (_label.scss). (Use individual mixins below to use.) -@import 'mini-extra/label'; -// Use label mixins to create labels with given specs. For more information -// refer to the _label.scss file to check the definitions. -@include make-lbl($lbl-class-name, $lbl-default-bg-color, $lbl-default-color, 4px, 6px 10px, hide); -@include make-lbl-style($lbl-class-name, $lbl-style1-name, $lbl-default-color, $lbl-b-bg-color); -@include make-lbl-style($lbl-class-name, $lbl-style2-name, $lbl-default-color, $lbl-g-bg-color); -@include make-lbl-style($lbl-class-name, $lbl-style3-name, $lbl-default-color, $lbl-r-bg-color); -@include make-lbl($badge-class-name, $lbl-default-bg-color, $lbl-default-color, 8px, 3px 8px, hide); -@include make-lbl-style($badge-class-name, $lbl-style1-name, $lbl-default-color, $lbl-b-bg-color); -@include make-lbl-style($badge-class-name, $lbl-style2-name, $lbl-default-color, $lbl-g-bg-color); -@include make-lbl-style($badge-class-name, $lbl-style3-name, $lbl-default-color, $lbl-r-bg-color); -//==================================================================== -// Variable definitions for the Tab module (_tab.scss) -//==================================================================== -// Tab class names. -$tabs-class-name: tabs; // Name for the tab system container class -// Colors and styles (you can remove things you don't need or define more -// colors if you need them). -$tabs-border-color: #ccc; // Border color for the tabs system -$tabs-content-bg-color: #fff; // Background for the active tab's content -$tabs-color: $a-color; // Color for the text in the tab labels -$tabs-bg-color: $body-bg-color; // Background color for the tab labels -$tabs-active-color: $body-color; // Color for the text in the active tab's label -$tabs-active-bg-color: $tabs-content-bg-color; // Background color for the active tab's label -$tabs-active-stripe-style: 3px solid $a-color; // Style for the active tab label's stripe -// Enable tabs (_tab.scss). (Use individual mixins below to use.) -@import 'mini-extra/tab'; -// Use tabs mixin to create tab system with given specs. For more information -// refer to the _tab.scss file to check the definitions. -@include make-tabs($tabs-class-name, 250px, 3px, 40px, 8px 14px, $tabs-color, $tabs-bg-color, $tabs-active-color, $tabs-active-bg-color, $tabs-border-color, 4px 4px 0 0, $tabs-active-stripe-style, 'darken', 10%, $tabs-content-bg-color, 20px); -//==================================================================== -// Variable definitions for the Modal module (_modal.scss) -//==================================================================== -// Modal class names. -$modal-class-name: modal; // Name for the modal class -// Colors and styles (you can remove things you don't need or define more -// colors if you need them). -$modal-bg-color: $body-bg-color; // Background color for the modal -$modal-color: $body-color; // Color for the text in the modal -$modal-border: 1px solid #ccc; // Border style for the modal -// Enable modal (_modal.scss). (Use individual mixins below to use.) -@import 'mini-extra/modal'; -// Use modal mixin to create modal with given specs. For more information -// refer to the _modal.scss file to check the definitions. -@include make-modal($modal-class-name, $modal-color, $modal-bg-color, 'enabled', 'enabled', $modal-border, 4px, 18px, 8.5%, 45%); -@include make-modal-close-support($modal-class-name, $close-class-name, 20px); -//==================================================================== -// Variable definitions for the Dropdown module (_dropdown.scss) -//==================================================================== -// Dropdown class names. -$dropdown-class-name: dropdown; // Name for the modal class -// Enable dropdown (_dropdown.scss). (Use individual mixins below to use.) -@import 'mini-extra/dropdown'; -// Use dropdown mixin to create dropdown with given specs. For more information -// refer to the _dropdown.scss file to check the definitions. -@include make-dropdown($navigation-class-name, $navigation-link-name,$dropdown-class-name, 20px, 0.8em); -//==================================================================== -// Variable definitions for the Collapse module (_collapse.scss) -//==================================================================== -// Collapse and accordion class names. -$collapse-class-name: clps; // Name for the collapse class -$accordion-class-name: acrd; // Name for the accordion class -// Collapse colors and styles (you can remove things you don't need or -// define more colors if you need them). -$collapse-border: 1px solid #ccc; // Border style for the collapse -$collapse-color: $body-color; // Color for the text in the collapse -$collapse-bg-color: #eeeeee; // Background color for the collapse -// Accordion colors and styles (you can remove things you don't need or -// define more colors if you need them). -$accordion-border: $collapse-border; // Border style for the accordion -$accordion-color: $collapse-color; // Color for the text in the accordion -$accordion-bg-color: $body-bg-color; // Background color for the accordion -$accordion-label-color: $collapse-color; // Color for the text in the accordion's label -$accordion-label-bg-color: $collapse-bg-color; // Background color for the accordion's label -// Enable collapse (_collapse.scss). (Use individual mixins below to use.) -@import 'mini-extra/collapse'; -// Use collapse and accordion mixins to create components wit the given specs. -// For more information refer to the _collapse.scss file to check the definitions. -@include make-collapse($collapse-class-name, $collapse-border, 4px, 10px, 5px, $collapse-color, $collapse-bg-color); -@include make-accordion($accordion-class-name, $accordion-border, 4px, 10px, 5px, $accordion-color, $accordion-bg-color, $accordion-label-color, $accordion-label-bg-color, 8px, 'darken', 7.5%); -//==================================================================== -// Variable definitions for the Progress module (_progress.scss) -//==================================================================== -// Progress and progress variants class names. -$progress-class-name: prg; // Name for the progress class -$progress-bar-style1-name: 'green'; // Name for the progress bar style 1 class -$progress-bar-style2-name: 'red'; // Name for the progress bar style 2 class -// Progress and p progress variants colors (you can remove things you -// don't need or define more colors if you need them). -$progress-bg-color: #d7d7d7; // Background color for the progress bar container -$progress-bar-color: $btn-alt-color; // Color for the text of the progress bar -$progress-bar-style1-color: $btn-alt-color; // Color for the text of the style 1 progress bar -$progress-bar-style2-color: $btn-alt-color; // Color for the text of the style 2 progress bar -$progress-bar-bg-color: $btn-b-bg-color; // Background color for the progress bar -$progress-bar-style1-bg-color: $btn-g-bg-color; // Background color for the style 1 progress bar -$progress-bar-style2-bg-color: $btn-r-bg-color; // Background color for the style 2 progress bar -// Enable progress (_progress.scss). (Use individual mixins below to use.) -@import 'mini-extra/progress'; -// Use progress mixins to create progress bars with given specs. For more -// information refer to the _progress.scss file to check the definitions. -@include make-progress($progress-class-name, 20px, 4px, $progress-bg-color, 0.8em, $progress-bar-color, $progress-bar-bg-color); -@include make-progress-bar-variant($progress-class-name, $progress-bar-style1-name, $progress-bar-style1-color, $progress-bar-style1-bg-color); -@include make-progress-bar-variant($progress-class-name, $progress-bar-style2-name, $progress-bar-style2-color, $progress-bar-style2-bg-color); -//==================================================================== -// Variable definitions for the Carousel module (_carousel.scss) -//==================================================================== -// Carousel class names. -$carousel-class-name: carousel; // Name for the carousel class -// Carousel colors and styles. -$carousel-border: 1px solid #ccc; // Border style for the carousel -$carousel-content-bg-color: #e7e7e7; // Background color for the carousel -$carousel-description-color: $body-bg-color; // Color for the text in the carousel's description -$carousel-description-bg-color: $body-color; // Background color for the carousel's description -$carousel-control-color: #fafafa; // Color for the carousel's control elements -// Enable carousel (_carousel.scss). (Use individual mixins below to use.) -@import 'mini-extra/carousel'; -// Use carousel mixin to create carousel with given specs. For more -// information refer to the _carousel.scss file to check the definitions. -@include make-carousel($carousel-class-name, 80%, 500px, $carousel-border, 4px, $carousel-content-bg-color, 10px, $carousel-description-color, $carousel-description-bg-color, 340px, 160px, 450px, 1.8em, $carousel-control-color); -//==================================================================== -// Variable definitions for the Utility module (_utility.scss) -//==================================================================== -// Utility class names. -$breadcrumbs-class-name: brdcrmb; // Name for the breadcrumbs class -$well-class-name: well; // Name for the well class -$alert-style1-class: alert-blue; // Name for the style 1 alert -$alert-style2-class: alert-green; // Name for the style 2 alert -$alert-style3-class: alert-red; // Name for the style 3 alert -$panel-class-name: panel; // Name for the panel class -$panel-header-name: head; // Name for the panel's header class -$button-states-class-name: stateful; // Name for the stateful button class -$button-group-class-name: btn-grp; // Name for the button group class -$popover-above-name: popover-top; // Name for the popover above class -$popover-below-name: popover-bottom; // Name for the popover below class -// Utility color variables and styles (you can remove things you -// don't need or define more colors if you need them). -$well-color: $body-color; // Text color for the well -$well-bg-color: #e7e7e7; // Background color for the well -$panel-color: $body-color; // Text color for the panel -$panel-bg-color: $body-bg-color; // Background color for the panel -$panel-header-color: $body-color; // Text color for the panel's header -$panel-header-bg-color: #e7e7e7; // Background color for the panel's header -$popover-color: $body-bg-color; // Text color for the popover -$popover-bg-color: $body-color; // Background color for the popover -// Enable utilities (_utility.scss). (Use individual mixins below to use.) -@import 'mini-extra/utility'; -// Use utilities mixins to create utilities with given specs. For more -// information refer to the _utility.scss file to check the definitions. -@include make-breadcrumbs($breadcrumbs-class-name); -@include make-generic-container($well-class-name, $well-color, $well-bg-color, 1px solid #ccc, 4px, 20px); -@include make-alert($alert-style1-class, darken($btn-b-bg-color,20%), lighten($btn-b-bg-color, 10%) , 1px solid darken($btn-b-bg-color, 10%), 4px, 20px, close); -@include make-alert($alert-style2-class, darken($btn-g-bg-color,20%), lighten($btn-g-bg-color, 10%) , 1px solid darken($btn-g-bg-color, 10%), 4px, 20px, close); -@include make-alert($alert-style3-class, darken($btn-r-bg-color,20%), lighten($btn-r-bg-color, 10%) , 1px solid darken($btn-r-bg-color, 10%), 4px, 20px, close); -@include make-panel(panel, $panel-color, $panel-bg-color, 1px solid #ccc, 4px, 10px, $panel-header-name, $panel-header-color, $panel-header-bg-color, 10px); -@include make-popover($popover-above-name, top, 5px, 45px, $popover-color, $popover-bg-color, 7px 10px); -@include make-popover($popover-below-name, bottom, 4px, 45px, $popover-color, $popover-bg-color, 7px 10px); -// Use experimental utilities mixins to create utilities with given -// specs. Please exercise caution when using these mixins. -//@include make-button-states($button-states-class-name); // This mixin is unstable and buggy, we suggest you disable it. -// The folowing mixin is considered stable, you can disable it if you need to. -@include make-btn-group($button-group-class-name, $btn-class-name, 1px solid #ccc, 4px); -@include make-btn-group(btn-grp, $btn-class-name+'.'+$btn-style1-name, 1px solid darken($btn-b-bg-color, 10%), 4px); -@include make-btn-group(btn-grp, $btn-class-name+'.'+$btn-style2-name, 1px solid darken($btn-g-bg-color, 10%), 4px); -@include make-btn-group(btn-grp, $btn-class-name+'.'+$btn-style3-name, 1px solid 1px solid darken($btn-r-bg-color, 10%), 4px); -//==================================================================== -//==================================================================== \ No newline at end of file diff --git a/scss/mini/_utility.scss b/scss/mini/_utility.scss index 6e598b7..9ed261c 100644 --- a/scss/mini/_utility.scss +++ b/scss/mini/_utility.scss @@ -5,15 +5,20 @@ - $thumb-padding : The padding between the image and the border. - $thumb-border : The style of the thumbnail's border. - $thumb-border-radius : The border radius of the thumbnail. + - $thumb-hover-color : The color of the thumbnail's border when hovering over it. Notes: - [1] : This style only applies to `img` elements with the class specified in `$thumb-name`. */ -@mixin make-thumb($thumb-name, $thumb-padding, $thumb-border, $thumb-border-radius){ +@mixin make-thumb($thumb-name, $thumb-padding, $thumb-border, $thumb-border-radius, $thumb-hover-color){ img.#{$thumb-name}{ padding: $thumb-padding; border: $thumb-border; border-radius: $thumb-border-radius; + cursor: pointer; + &:hover, &:focus, &active{ + border-color: $thumb-hover-color; + } } } /*