89 lines
2.0 KiB
SCSS
89 lines
2.0 KiB
SCSS
|
// ===========================
|
||
|
|
// TITLE BAR
|
||
|
|
// ===========================
|
||
|
|
|
||
|
|
|
||
|
|
[class*="bar-"] {
|
||
|
|
position: fixed;
|
||
|
|
right: 0;
|
||
|
|
left: 0;
|
||
|
|
z-index: 10;
|
||
|
|
height: $bar-title-height;
|
||
|
|
padding: $bar-title-padding;
|
||
|
|
box-sizing: border-box;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Title bar
|
||
|
|
-------------------------------------------------- */
|
||
|
|
|
||
|
|
/* Bar docked to top of viewport for showing page title and actions */
|
||
|
|
.bar-title {
|
||
|
|
top: 0;
|
||
|
|
//display: -webkit-box;
|
||
|
|
//display: box;
|
||
|
|
line-height: $bar-title-height;
|
||
|
|
background: $bar-title-color;
|
||
|
|
line-height: $bar-title-height - ($bar-title-padding * 2);
|
||
|
|
//box-shadow: inset 0 1px 1px -1px rgba(255, 255, 255, .8);
|
||
|
|
//-webkit-box-orient: horizontal;
|
||
|
|
//box-orient: horizontal;
|
||
|
|
.info {
|
||
|
|
float: right;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Centered text in the .bar-title */
|
||
|
|
.bar-title .title {
|
||
|
|
position: absolute;
|
||
|
|
line-height: $bar-title-height;
|
||
|
|
top: 0;
|
||
|
|
left: 0;
|
||
|
|
display: block;
|
||
|
|
width: 100%;
|
||
|
|
font-size: 17px;
|
||
|
|
//font-weight: bold;
|
||
|
|
text-transform: uppercase;
|
||
|
|
color: $bar-title-font-color;
|
||
|
|
text-align: center;
|
||
|
|
//text-shadow: 0 -1px rgba(0, 0, 0, .5);
|
||
|
|
white-space: nowrap;
|
||
|
|
margin: 0;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Retain specified title color */
|
||
|
|
.bar-title .title a {
|
||
|
|
color: inherit;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Generic style for all buttons in .bar-title */
|
||
|
|
.bar-title [class*="button"] {
|
||
|
|
position: relative;
|
||
|
|
text-decoration: none;
|
||
|
|
z-index: 10; /* Places buttons over full width title */
|
||
|
|
font-size: 16px;
|
||
|
|
line-height: $bar-title-height - ($bar-title-padding * 2);
|
||
|
|
color: #fff;
|
||
|
|
// -webkit-box-flex: 0;
|
||
|
|
// box-flex: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
/* Hacky way to right align buttons outside of flex-box system
|
||
|
|
Note: is only absolutely positioned button, would be better if flex-box had an "align right" option */
|
||
|
|
.bar-title .title + [class*="button"]:last-child,
|
||
|
|
.bar-title .button + [class*="button"]:last-child,
|
||
|
|
.bar-title [class*="button"].pull-right {
|
||
|
|
position: absolute;
|
||
|
|
top: 5px;
|
||
|
|
right: $bar-title-padding;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Override standard button active states */
|
||
|
|
.bar-title .button:active {
|
||
|
|
color: #fff;
|
||
|
|
background-color: #0876b1;
|
||
|
|
}
|