orbit-basic/app/assets/stylesheets/basic/global.css

769 lines
16 KiB
CSS
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

a:focus {
outline: thin dotted;
}
a:active,
a:hover {
outline: 0;
}
/**:link,
*:visited,
*:hover,
*:active,
*:focus,
.transition {
-webkit-transition: all .2s linear;
-moz-transition: all .2s linear;
-o-transition: all .2s linear;
transition: all .2s linear;
}
.dont-move, #sidebar, #main-wrap, #sidebar-menu .scroller, .sub-nav-block-list {
-webkit-transition: none;
-moz-transition: none;
-o-transition: none;
transition: none;
}*/
::selection {
color: white;
background: black;
text-shadow: none !important;
}
/*::-webkit-scrollbar {
width: 10px;
}
::-webkit-scrollbar-track {
background: #FFF;
-webkit-box-shadow: inset 1px 1px 2px rgba(0,0,0,0.1);
}
::-webkit-scrollbar-thumb {
background: #CCC;
-webkit-box-shadow: inset 1px 1px 2px rgba(0,0,0,0.2);
}
::-webkit-scrollbar-thumb:hover {
background: #AAA;
}
::-webkit-scrollbar-thumb:active {
background: #888;
-webkit-box-shadow: inset 1px 1px 2px rgba(0,0,0,0.3);
}*/
input:focus::-webkit-input-placeholder {
color: transparent;
}
body {
background-color: #F3F3F3;
font-family: 'Chivo';
}
body.modalBlur > nav,
body.modalBlur > section {
-webkit-filter: blur(5px);
}
.label {
font-family: 'Open Sans';
}
.btn {
font-family: 'Varela Round';
letter-spacing: -.4px;
}
h1,
h2,
h3,
h4,
h5,
h6,
label,
legend {
font-family: 'Raleway';
}
/* Sidebar */
#sidebar {
top: 0;
left: 0;
bottom: 0;
min-width: 61px;
z-index: 1030;
position: fixed;
padding-top: 40px;
background-color: #171717;
-webkit-box-shadow: inset -1px 0px 10px #000000;
-moz-box-shadow: inset -1px 0px 10px #000000;
-o-box-shadow: inset -1px 0px 10px #000000;
box-shadow: inset -1px 0px 10px #000000;
}
#sidebar #sidebar-menu {
position: absolute;
top: 85px;
bottom: 0;
z-index: 0;
display: block;
width: 61px;
}
#sidebar #sidebar-menu.nano {
top: 0;
}
#sidebar .scroller {
position: absolute;
z-index:1;
/*-webkit-touch-callout:none;*/
-webkit-tap-highlight-color:rgba(0,0,0,0);
width:100%;
padding:0;
}
#sidebar-menu .content,
#sidebar-menu .pane {
margin-top: 88px;
}
#sidebar .sidebar-nav {
margin: 0;
padding: 0;
height: 100%;
font-size: 1em;
width: 61px;
text-align: center;
list-style: none;
}
#sidebar > h2.position {
margin: 0;
width: 61px;
color: #FFFFFF;
font-weight: normal;
text-align: center;
position: relative;
background-color: #08c;
background-image: -moz-linear-gradient(top, #08c, #006091);
background-image: -ms-linear-gradient(top, #08c, #006091);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#08c), to(#006091));
background-image: -webkit-linear-gradient(top, #08c, #006091);
background-image: -o-linear-gradient(top, #08c, #006091);
background-image: linear-gradient(top, #08c, #006091);
-webkit-box-shadow: 0px 1px 0px #333333;
-moz-box-shadow: 0px 1px 0px #333333;
-o-box-shadow: 0px 1px 0px #333333;
box-shadow: 0px 1px 0px #333333;
}
#sidebar > h2.position:after {
left: 50%;
bottom: 0;
width: 0px;
height: 0px;
content: " ";
display: block;
margin-left: -6px;
position: absolute;
margin-bottom: -1px;
border-style: solid;
border-width: 0 6px 6px 6px;
border-color: transparent transparent #171717 transparent;
}
#sidebar > h2.position a {
color: #FFFFFF;
text-decoration: none;
display: inline-block;
-webkit-text-shadow: 0px -1px 0px #333333;
-moz-text-shadow: 0px -1px 0px #333333;
-o-text-shadow: 0px -1px 0px #333333;
text-shadow: 0px -1px 0px #333333;
}
#sidebar > h2.position a i {
line-height: 45px;
}
#sidebar .sidebar-nav > li {
min-width: 61px;
}
#sidebar .sidebar-nav > li.active span {
color: #FFFFFF;
cursor: pointer;
-webkit-text-shadow: 0px -1px 0px #636363;
-moz-text-shadow: 0px -1px 0px #636363;
-o-text-shadow: 0px -1px 0px #636363;
text-shadow: 0px -1px 0px #636363;
}
#sidebar .sidebar-nav > li span {
color: #B0B0B0;
display: block;
-webkit-text-shadow: 0px 1px 0px #000000;
-moz-text-shadow: 0px 1px 0px #000000;
-o-text-shadow: 0px 1px 0px #000000;
text-shadow: 0px 1px 0px #000000;
}
#sidebar .sidebar-nav > li a {
display: block;
}
#sidebar .sidebar-nav > li i {
font-size: 1.6em;
line-height: 60px;
}
#sidebar .sidebar-nav > li.active i {
font-size: 2.2em;
}
#sidebar .sub-nav-block-list {
top: 40px;
bottom: 0;
left: 61px;
position: fixed;
text-align: left;
/*overflow: hidden;*/
-webkit-box-shadow: -1px 0px 10px rgba(33, 33, 33, .8);
-moz-box-shadow: -1px 0px 10px rgba(33, 33, 33, .8);
-o-box-shadow: -1px 0px 10px rgba(33, 33, 33, .8);
box-shadow: -1px 0px 10px rgba(33, 33, 33, .8);
}
#sidebar .sub-nav-block-list .sub-nav-block {
top: 0;
left: 0;
right: 0;
bottom: 0;
display: none;
position: absolute;
background-color: #0088CC;
}
#sidebar .sub-nav-block-list .sub-nav-block.show {
display: block;
overflow: hidden;
}
#sidebar .sub-nav-block-list .sub-nav-block:before {
bottom: 0px;
right: -20px;
opacity: .1;
color: #FFFFFF;
font-size: 14em;
line-height: 150px;
position: absolute;
display: none\9; /* 用IE的去死 */
}
#sidebar .sub-nav-block-list .sub-nav-block h4 {
color: #FFFFFF;
margin-top: 15px;
font-weight: normal;
padding: 0 15px 10px;
border-bottom: 1px solid #1C9BCC;
}
#sidebar .sub-nav-block-list .sub-nav-block > ul {
position: relative;
z-index: 2;
}
#sidebar .sub-nav-block-list .sub-nav-block a {
line-height: 25px;
color: #90D0FA;
-webkit-text-shadow: none;
-moz-text-shadow: none;
-o-text-shadow: none;
text-shadow: none;
}
#sidebar .sub-nav-block-list .sub-nav-block li.active a {
background-color: #EEEEEE;
color: #0081c2;
position: relative;
}
#sidebar .sub-nav-block-list .sub-nav-block li.active a:after {
top: 50%;
right: 10px;
width: auto;
height: auto;
display: inline;
content: "\e0d4";
font-size: 1.3em;
position: absolute;
font-style: normal;
font-weight: normal;
margin-top: -0.75em;
font-family: 'entypo';
text-decoration: inherit;
}
#sidebar .sub-nav-block-list .sub-nav-block a:hover {
color: #0081c2;
}
#sidebar .sub-nav-arrow {
left: 53px;
top: -16px;
width: 0px;
height: 0px;
z-index: -1;
position: absolute;
border-style: solid;
border-width: 8px 8px 8px 0;
border-color: transparent #0088CC transparent transparent;
}
/* Vertical Scrollbar */
#sidebar .myScrollbarV {
position: absolute;
z-index: 100;
width: 2px;
bottom: 2px;
top: 2px;
left: 1px
}
#sidebar .myScrollbarV > div {
position: absolute;
z-index: 100;
width: 100%;
border-radius: 50%/1px;
background-color: rgba(0, 136, 204, .6);
}
/* Main Wrap */
#main-wrap {
padding-top: 40px;
position: relative;
}
#main-wrap .wrap-inner {
padding: 60px 20px 20px;
}
#main-wrap .wrap-inner.initial {
padding: 20px 20px 20px;
}
/* Member Filter */
#member-filter.modal {
width: 80%;
margin-left: -40%;
}
#member-filter.modal.fade.in {
top: 50px;
}
#member-filter .modal-body {
max-height: 425px;
}
#member-filter .modal-body form {
margin-bottom: 0px;
}
#member-filter .modal-body form fieldset {
min-height: 360px;
}
#member-filter .modal-body .radio.inline,
#member-filter .modal-body .checkbox.inline {
display: inline-block;
padding-top: 5px;
margin-bottom: 0;
vertical-align: middle;
min-width: 100px;
margin-left: 0;
}
#member-filter .modal-body .form-actions {
margin: 20px 0 0;
padding: 10px 0 0;
background-color: transparent;
text-align: right;
}
#member-filter .modal-body .form-actions.condition {
margin: 10px 0 0 195px;
}
#member-filter .modal-body .tabs-left > .nano {
width: 160px;
min-height: 425px;
float: left;
margin-right: 10px;
padding-right: 20px;
}
#member-filter .modal-body .tabs-left > .nano .content {
right: 20px;
outline: none;
}
#member-filter .modal-body .tabs-left > .nano .pane {
right: 0px;
}
#member-filter .modal-body .tabs-left > .nano > .content > .nav-tabs {
width: 140px;
float: left;
margin-bottom: 0;
margin-right: 0;
border-right: 1px solid #ddd;
border-bottom: none;
}
#member-filter .modal-body .tabs-left > .nano > .content > .nav-tabs > li {
float: none;
}
#member-filter .modal-body .tabs-left > .nano > .content > .nav-tabs > li > a {
min-width: 74px;
margin-right: 0;
margin-bottom: 3px;
}
#member-filter .modal-body .tabs-left > .nano > .content > .nav-tabs > li > a {
margin-right: -1px;
-webkit-border-radius: 4px 0 0 4px;
-moz-border-radius: 4px 0 0 4px;
border-radius: 4px 0 0 4px;
}
#member-filter .modal-body .tabs-left > .nano > .content > .nav-tabs > li > a:hover {
border-color: #eeeeee #dddddd #eeeeee #eeeeee;
}
#member-filter .modal-body .tabs-left > .nano > .content > .nav-tabs .active > a,
#member-filter .modal-body .tabs-left > .nano > .content > .nav-tabs .active > a:hover {
border-color: #ddd transparent #ddd #ddd;
*border-right-color: #ffffff;
}
#member-filter .member-filter-options {
float: left;
display: inline-block;
width: 175px;
min-height: 425px;
margin-right: 10px;
padding: 0 10px 0 0;
}
#member-filter .member-filter-options select {
width: 165px;
}
#member-filter .member-filter-options .btn {
display: block;
}
#member-filter .member-filter-result {
padding-left: 15px;
min-height: 370px;
width: auto;
}
/* Search Clear */
.searchClear {
position: relative;
display: inline-block;
}
.searchClear .icon-search {
position: absolute;
color: #A3A3A3;
top: 10px;
left: 18px;
font-size: 1.2em;
}
.searchClear #filter-input {
padding-left: 25px;
padding-right: 25px;
}
.searchClear .search-clear {
position: absolute;
color: #A3A3A3;
right: 8px;
top: 10px;
font-size: 1.2em;
}
/* Edit link in structure */
.page_content {
width: 100%;
height: 100%;
}
.editable {
position: relative;
width: 100%;
height: 100%;
min-height: 50px;
}
.edit_link {
position: absolute;
top: 2px;
right: 2px;
bottom: 2px;
left: 2px;
outline: 1px dashed #0090D5;
z-index: 1000;
}
.edit_link:hover {
outline: 2px dashed #E47E6B;
}
.edit_link:hover > a:before {
display: block;
}
.edit_link > a {
text-indent: -99999px;
margin: 0!important;
padding: 0!important;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
.edit_link > a:before {
display: none;
text-indent: 0;
color: #FFF;
content: attr(title);
padding: 5px;
font-size: 12px;
line-height: 10px;
position: absolute;
top: -2px;
left: -2px;
height: 10px;
background-color: #E47E6B;
}
.edit_link > a:after {
content: "\f044";
color: #0090D5;
font-family: FontAwesome;
position: absolute;
font-style: normal;
top: 50%;
left: 50%;
display: block;
font-size: 1em;
width: 24px;
height: 24px;
margin: -8px 0 0 -12px;
text-indent: 0px;
}
.edit_link:hover > a:after {
color: #E47E6B;
}
/* Page Parts */
.page-parts {
background-color: #E7E7E7;
}
.page-parts body {
background-color: transparent;
}
.page-parts #main-wrap {
padding-top: 0;
}
.page-parts #main-wrap .wrap-inner {
padding: 30px 10px 10px;
}
.page-parts .main-forms {
text-align: center;
}
.page-parts .main-forms fieldset {
text-align: left;
}
.page-parts .main-forms > .btn-group {
margin-bottom: 20px;
}
.page-parts .display-mode td {
padding-bottom: 10px;
}
.page-parts .display-mode td i {
font-size: 2em;
}
.page-parts .radio.inline + .radio.inline,
.page-parts .checkbox.inline + .checkbox.inline {
margin-left: 0;
}
/* Show Preview */
#show_preview .modal {
width: 90%;
margin-left: -45%;
}
#show_preview .modal-body {
padding: 0;
max-height: none;
height: 100%;
overflow: hidden;
}
#show_preview iframe {
border: 0;
outline: none;
width: 100%;
height: 100%;
}
#show_preview form {
text-align: left;
margin-bottom: 0px;
}
#show_preview form .control-group {
margin-bottom: 0;
}
#show_preview form .pull-right + .pull-left {
margin-right: 10px;
}
#show_preview form .control-label {
width: 70px;
}
#show_preview form .controls {
margin-left: 80px;
}
/* tooltip */
#sideset .ui-tooltip.sidebar-tooltip {
color: #FFFFFF;
padding: 0px 5px;
position: absolute;
z-index: 9999;
max-width: 300px;
border-radius: 3px;
background-color: #0088CC;
}
#sideset .ui-tooltip.sidebar-tooltip:after {
display: none;
}
.ui-tooltip {
color: #FFFFFF;
padding: 0px 5px;
position: absolute;
z-index: 9999;
max-width: 300px;
border-radius: 3px;
background-color: #000000;
}
.ui-tooltip:after {
content: '';
position: absolute;
left: 50%;
bottom: -3px;
margin-left: -4px;
width: 0px;
height: 0px;
border-style: solid;
border-width: 4px 4px 0 4px;
border-color: #000000 transparent transparent transparent;
}
/* Sign In */
#sign-in {
background-color: #F3F3F3;
background-repeat: no-repeat;
background : -webkit-radial-gradient(center center,circle cover, #F3F3F3 10%, #DBDBDB 100%);
background : -moz-radial-gradient(center center,circle cover, #F3F3F3 10%, #DBDBDB 100%);
background : -o-radial-gradient(center center,circle cover, #F3F3F3 10%, #DBDBDB 100%);
background : -ms-radial-gradient(center center,circle cover, #F3F3F3 10%, #DBDBDB 100%);
background : -radial-gradient(center center,circle cover, #F3F3F3 10%, #DBDBDB 100%);
}
.sign-in {
text-align: center;
position: relative;
width: 300px;
margin: 150px auto 0;
}
.sign-in .other-sign-in {
display: none;
}
.sign-in .login-logo {
margin: 0;
padding-bottom: 15px;
border-bottom: 1px solid #ededed;
}
.sign-in .alert {
box-shadow: 0 3px 10px #CBCBCB;
text-align: left;
}
.sign-in .form {
background-color: #FFF;
box-shadow: 0 10px 20px #CBCBCB;
padding: 15px;
margin-bottom: 20px;
}
.sign-in .form-block {
overflow: hidden;
}
.sign-in .form-list {
width: 555px;
}
.sign-in .content {
float: left;
margin-bottom: 0;
position: relative;
}
.sign-in .content + .content {
margin-left: 15px;
}
.sign-in .control-group {
position: relative;
width: 270px;
margin: 0;
}
.sign-in .control-group label {
position: absolute;
top: 0;
left: 0;
width: 39px;
height: 40px;
line-height: 40px;
margin: 0;
color: #5C5C5C;
}
.sign-in .control-group input {
width: 222px;
height: 30px;
padding: 4px 6px 4px 40px;
margin-bottom: 25px;
}
.sign-in .btn {
padding: 4px 0;
display: block;
width: 100%;
margin-bottom: 10px;
}
.sign-in .other-sign-in {
position: relative;
margin-top: 20px;
margin-bottom: 30px;
padding-bottom: 20px;
border-bottom: 1px solid #ededed;
}
.sign-in .other-sign-in p {
position: absolute;
width: 30px;
height: 30px;
background-color: #FFF;
padding: 0 10px;
margin-bottom: 0;
margin-left: -25px;
line-height: 30px;
left: 50%;
bottom: -15px;
font-size: 1.3em;
color: #b1b1b1;
}
.sign-in .checkbox {
position: absolute;
text-align: left;
bottom: 37px;
}
.sign-in .switchboard {
color: #08C;
cursor: pointer;
}
.sign-in .switchboard span,
.sign-in .switchboard.active i {
display: inline;
}
.sign-in .switchboard.active span,
.sign-in .switchboard i {
display: none;
}
.register {
box-shadow: inset 0 5px 5px #E0E0E0;
background-color: #eee;
padding: 15px;
margin: 15px -15px -15px;
}
.register .btn {
margin: 0;
}
.have-other-sign-in {
margin: 80px auto 0;
}
.have-other-sign-in .other-sign-in {
display: block;
}
/* IE go die */
:root #sidebar .sub-nav-block:before {
display: block\9;
}
/* Responsive */
@media (max-width: 767px) {
body {
padding: 0;
}
#member-filter.modal {
width: auto;
margin-left: auto;
}
#show_preview .modal {
  margin-left: 0 auto;
}
}
@media (max-width: 480px) {
/* Main Wrap */
#main-wrap .wrap-inner {
padding: 20px 0;
}
}