jellyfin-web/dashboard-ui/css/librarymenu.css

356 lines
7.2 KiB
CSS
Raw Normal View History

2014-05-02 21:20:04 -07:00
.libraryPage {
2014-05-10 22:11:53 -07:00
padding-top: 50px !important;
2014-05-02 21:20:04 -07:00
}
.libraryPage:not(.metadataEditorPage):not(.noSecondaryNavPage) {
2014-05-10 22:11:53 -07:00
padding-top: 100px !important;
2014-05-02 21:20:04 -07:00
}
2014-05-09 12:43:06 -07:00
.libraryMenuDivider {
2014-05-03 16:38:23 -07:00
height: 1px;
background: #333;
margin: .5em 0;
}
2014-05-02 21:20:04 -07:00
2014-06-23 09:05:19 -07:00
.viewMenuBar, .barsMenuButton, .libraryMenuButtonText, .btnCast {
2014-05-10 22:11:53 -07:00
height: 50px;
}
2014-06-23 09:05:19 -07:00
.barsMenuButton, .libraryMenuButtonText, .btnCast {
2014-05-10 22:11:53 -07:00
line-height: 50px;
}
.headerButton {
margin: 0;
padding: 0;
background-color: transparent;
top: 0;
bottom: 0;
vertical-align: middle;
text-align: center;
2014-07-26 10:30:15 -07:00
border: 0 !important;
2014-05-10 22:11:53 -07:00
outline: none;
padding: 0 20px;
2014-05-21 20:35:18 -07:00
cursor: pointer;
2014-05-10 22:11:53 -07:00
}
.headerButton img {
2014-06-23 09:05:19 -07:00
height: 19px;
2014-05-10 22:11:53 -07:00
vertical-align: middle;
}
.headerSearchButton img {
2014-06-23 09:05:19 -07:00
height: 18px;
2014-05-10 22:11:53 -07:00
}
.headerButtonLeft {
float: left;
padding: 0 15px;
}
.headerButtonLeft:first-child {
padding-left: 10px;
}
2014-07-27 15:01:29 -07:00
.menuArrow {
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAbklEQyGDxkLaBtENI9kPMk0gaoW0Dyj0aWowFLYNYzWB6MWMAAAq1H3+Mhu2hQAAAAASUVORK5CYII=);
height: 24px;
width: 24px;
display: inline-block;
}
2014-05-10 22:11:53 -07:00
.headerButtonRight {
border-width: 0 !important;
padding: 0 15px;
2014-06-23 09:05:19 -07:00
display: inline-block;
2014-05-10 22:11:53 -07:00
}
.headerButtonRight:first-child {
border-width: 0 !important;
}
2014-07-27 15:01:29 -07:00
.libraryMenuButton, .dashboardMenuButton {
padding-left: 10px !important;
}
.barMenuInner {
padding: 7px 10px;
border: 1px solid #000;
border-radius: 4px;
box-shadow: rgba(255, 255, 255, 0.0980392) 0px 1px 0px 0px inset, rgba(255, 255, 255, 0.0745098) 0px 1px 0px 0px;
background-color: rgb(14, 14, 14);
background-image: linear-gradient(rgb(21, 21, 21), rgb(4, 4, 4));
background-repeat: repeat-x;
border-bottom-color: rgba(0, 0, 0, 0.247059);
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
border-bottom-style: solid;
border-bottom-width: 1px;
border-image-outset: 0px;
border-image-repeat: stretch;
border-image-slice: 100%;
border-image-source: none;
border-image-width: 1;
border-left-color: rgba(0, 0, 0, 0.0980392);
border-left-style: solid;
border-left-width: 1px;
border-right-color: rgba(0, 0, 0, 0.0980392);
border-right-style: solid;
border-right-width: 1px;
border-top-color: rgba(0, 0, 0, 0.0980392);
border-top-left-radius: 4px;
border-top-right-radius: 4px;
border-top-style: solid;
border-top-width: 1px;
2014-05-21 20:35:18 -07:00
}
2014-06-21 22:52:31 -07:00
.barsMenuButton:hover {
2014-07-27 15:01:29 -07:00
opacity: .5 !important;
2014-05-31 07:30:59 -07:00
}
2014-07-27 15:01:29 -07:00
.icon-bar {
display: block;
width: 18px;
height: 2px;
background-color: #f5f5f5;
-webkit-border-radius: 1px;
-moz-border-radius: 1px;
border-radius: 1px;
-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
}
.icon-bar + .icon-bar {
margin-top: 3px;
2014-05-28 07:21:07 -07:00
}
2014-05-21 20:35:18 -07:00
.libraryMenuButtonText {
color: #fff !important;
2014-05-10 22:11:53 -07:00
text-decoration: none;
2014-07-27 15:01:29 -07:00
font-weight: 300 !important;
2014-05-10 22:11:53 -07:00
font-size: 15px;
2014-05-21 20:35:18 -07:00
display: inline-block;
vertical-align: middle;
2014-05-28 07:21:07 -07:00
padding-left: 0 !important;
2014-05-31 07:30:59 -07:00
margin-left: -8px;
2014-05-29 12:34:20 -07:00
cursor: default;
2014-05-10 22:11:53 -07:00
}
2014-05-02 21:20:04 -07:00
.viewMenuBar {
font-weight: bold;
position: fixed;
right: 0;
left: 0;
z-index: 1000;
top: 0;
2014-06-23 09:05:19 -07:00
background-image: linear-gradient(#262626,#111);
border-bottom: 1px solid #111;
2014-05-07 11:38:50 -07:00
border-top: 0;
border-left: 0;
border-right: 0;
2014-05-02 21:20:04 -07:00
}
2014-05-10 22:11:53 -07:00
.libraryViewNav {
height: 48px;
overflow: hidden;
position: fixed;
right: 0;
left: 0;
top: 51px;
z-index: 1000;
2014-06-23 09:05:19 -07:00
background-image: linear-gradient(#1a1a1a,#1a1a1a);
border-bottom: 1px solid #111;
2014-05-10 22:11:53 -07:00
}
2014-05-02 21:20:04 -07:00
.viewMenuLink {
text-decoration: none;
2014-07-26 10:30:15 -07:00
color: #ccc !important;
2014-05-02 21:20:04 -07:00
padding: 7px .5em 6px;
display: inline-block;
vertical-align: middle;
}
2014-05-21 20:35:18 -07:00
.viewMenuTextLink:hover {
2014-05-10 22:11:53 -07:00
background-color: #38c;
2014-07-26 10:30:15 -07:00
color: #fff !important;
2014-05-10 22:11:53 -07:00
opacity: 1;
}
2014-05-03 16:38:23 -07:00
2014-05-10 22:11:53 -07:00
.headerButtonRight:hover {
opacity: .5;
2014-05-02 21:20:04 -07:00
}
.viewMenuLink:hover {
color: #fff;
}
.viewMenuLink:hover img {
opacity: .5;
}
.viewMenuLink img {
height: 24px;
vertical-align: top;
}
2014-05-03 16:38:23 -07:00
.viewMenuTextLink {
display: block;
2014-07-26 10:30:15 -07:00
padding: .6em .5em .6em 38px !important;
2014-05-03 16:38:23 -07:00
font-size: 15px;
2014-07-26 10:30:15 -07:00
font-weight: 300 !important;
2014-05-03 16:38:23 -07:00
font-family: Roboto;
2014-05-09 12:43:06 -07:00
background-repeat: no-repeat;
2014-06-01 12:41:35 -07:00
background-size: 14px 14px;
2014-06-02 12:32:41 -07:00
background-position: 13px center;
2014-05-02 21:20:04 -07:00
}
2014-05-03 16:38:23 -07:00
.musicViewMenu {
background-image: url(images/items/folders/music.png);
2014-05-02 21:20:04 -07:00
}
2014-05-21 20:35:18 -07:00
.homeViewMenu {
background-image: url(images/items/folders/home.png);
}
2014-06-07 12:46:24 -07:00
.tvshowsViewMenu, .livetvViewMenu {
2014-05-03 16:38:23 -07:00
background-image: url(images/items/folders/tv.png);
2014-05-02 21:20:04 -07:00
}
2014-05-31 07:30:59 -07:00
.moviesViewMenu, .trailersViewMenu {
2014-05-03 16:38:23 -07:00
background-image: url(images/items/folders/movies.png);
2014-05-02 21:20:04 -07:00
}
2014-05-03 16:38:23 -07:00
.gamesViewMenu {
background-image: url(images/items/folders/games.png);
2014-05-02 21:20:04 -07:00
}
2014-05-03 16:38:23 -07:00
.channelsViewMenu {
background-image: url(images/items/folders/channels.png);
}
.booksViewMenu {
background-image: url(images/items/folders/books.png);
}
2014-05-04 07:19:46 -07:00
.musicvideosViewMenu {
background-image: url(images/items/folders/musicvideos.png);
}
.photosViewMenu {
background-image: url(images/items/folders/photos.png);
}
2014-05-06 19:28:19 -07:00
.homeVideosViewMenu {
2014-05-03 16:38:23 -07:00
background-image: url(images/items/folders/homevideos.png);
2014-05-06 19:28:19 -07:00
}
.generalViewMenu, .boxsetsViewMenu {
background-image: url(images/items/folders/folder.png);
2014-05-02 21:20:04 -07:00
}
2014-05-10 22:11:53 -07:00
.editorViewMenu {
background-image: url(images/items/folders/edit.png);
}
.dashboardViewMenu {
background-image: url(images/items/folders/settings.png);
}
2014-05-16 10:11:07 -07:00
2014-05-12 11:04:25 -07:00
.reportsViewMenu {
background-image: url(images/items/folders/report.png);
}
2014-05-10 22:11:53 -07:00
2014-05-31 07:30:59 -07:00
.homevideosViewMenu, .adultvideosViewMenu {
background-image: url(images/items/folders/homevideos.png);
}
2014-05-03 16:38:23 -07:00
.viewMenuSecondary {
2014-05-10 22:11:53 -07:00
position: absolute;
top: 0;
bottom: 0;
right: 0;
2014-05-03 16:38:23 -07:00
}
.selectedMediaFolder {
2014-07-26 10:30:15 -07:00
background-color: #52B54B !important;
color: #fff !important;
2014-05-02 21:20:04 -07:00
}
2014-05-03 16:38:23 -07:00
.itemDetailPage .selectedMediaFolder {
2014-07-26 10:30:15 -07:00
background-color: rgba(51,136,204,.8) !important;
2014-05-03 16:38:23 -07:00
}
2014-05-02 21:20:04 -07:00
2014-05-10 10:28:03 -07:00
.ui-panel.ui-body-b {
2014-07-26 10:30:15 -07:00
background-color: #222;
2014-05-10 10:28:03 -07:00
}
2014-05-02 21:20:04 -07:00
.libraryViewNavInner {
2014-05-06 19:28:19 -07:00
text-align: center;
2014-05-02 21:20:04 -07:00
font-size: 14px;
white-space: nowrap;
padding: 0 0 0;
overflow-x: auto;
2014-05-07 11:38:50 -07:00
height: 61px;
2014-05-02 21:20:04 -07:00
}
2014-07-26 10:30:15 -07:00
.libraryViewNav .ui-btn-active {
2014-05-02 21:20:04 -07:00
border-bottom-color: #38c;
2014-07-26 10:30:15 -07:00
color: #fff !important;
2014-05-02 21:20:04 -07:00
}
.libraryViewNav a {
display: inline-block;
2014-07-26 10:30:15 -07:00
padding: 12px 0 9px;
color: #ddd !important;
2014-05-02 21:20:04 -07:00
text-decoration: none;
margin: 0 0;
position: relative;
font-weight: normal;
2014-07-26 10:30:15 -07:00
border-bottom: 5px solid transparent;
2014-05-02 21:20:04 -07:00
}
2014-07-27 15:01:29 -07:00
.libraryViewNav a:not(.ui-btn-active):hover {
2014-07-26 10:30:15 -07:00
color: #2ad !important;
2014-05-02 21:20:04 -07:00
}
.libraryViewNavLinkContent {
display: inline-block;
2014-07-27 15:01:29 -07:00
padding: 2px 15px 2px 15px;
}
.libraryViewNav a + a .libraryViewNavLinkContent {
padding-left: 17px;
2014-07-26 10:30:15 -07:00
}
2014-07-27 15:01:29 -07:00
.libraryViewNav a + a .libraryViewNavLinkContent {
2014-07-26 10:30:15 -07:00
border-left: 1px solid #333;
position: relative;
left: -2px;
2014-05-02 21:20:04 -07:00
}
@media all and (max-width: 500px) {
.libraryMenuButtonText {
2014-05-10 22:11:53 -07:00
display: none;
2014-05-02 21:20:04 -07:00
}
}
2014-06-21 22:52:31 -07:00
@media all and (min-width: 750px) {
.dashboardDocument .dashboardMenuButton {
display: none;
}
}
@media all and (max-width: 750px) {
.dashboardDocument .libraryMenuButton {
display: none;
}
}
.libraryDocument .dashboardMenuButton {
display: none;
}