.book { .book-summary { font-family: @font-family-sans; position: absolute; top: @header-height; left: -@sidebar-width; bottom: 0px; z-index: 1; width: @sidebar-width; color: @sidebar-color; background: @sidebar-background; border-right: 1px solid @sidebar-border; .transition(all 0.5s ease); .book-search { padding: @sidebar-search-padding; background: @sidebar-search-background; position: absolute; top: -@header-height; left: 0px; right: 0px; .transition(top 0.5s ease); input, input:focus { width: 100%; border: 1px solid @sidebar-search-input-border-color; .box-shadow(none); } } ul.summary { position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; overflow-y: auto; list-style: none; margin: 0px; padding: 0px; .transition(top 0.5s ease); li { list-style: none; &.divider { height: 1px; margin: 7px 0; overflow: hidden; background: @sidebar-divider-color; } i.fa-check { display: none; position: absolute; right: 9px; top: 16px; font-size: 9px; color: @sidebar-icon-color; } &.done { > a { color: @sidebar-link-completed; font-weight: @sidebar-link-completed-weight; i { display: inline; } } } a, span { display: block; padding: 10px 15px; border-bottom: none; color: @sidebar-link-color; background: @sidebar-link-background; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; position: relative; } span { cursor: not-allowed; .opacity(0.3); } &.active > a, a:hover { color: @sidebar-link-hover-color; background: @sidebar-link-hover-background; text-decoration: none; } ul { padding-left: @sidebar-nested-padding; } } } @media (max-width: @sidebar-breakpoint) { width: 100%; bottom: 0px; left: -100%; } } &.with-summary { .book-summary { left: 0px; } } &.without-animation { .book-summary { .transition(none) !important; } } &.with-search { .book-summary { .book-search { top: 0px; } ul.summary { top: @header-height; } } } } /* * Theme 1 */ .book.color-theme-1 { .book-summary { color: @sidebar-color-1; background: @sidebar-background-1; .book-search { background: @sidebar-search-background-1; input, input:focus { border: 1px solid @sidebar-search-input-border-color-1; } } ul.summary { li { &.divider { background: @sidebar-divider-color-1; box-shadow: none; } i.fa-check { color: @sidebar-icon-color-1; } &.done > a { color: @sidebar-link-completed-1; } a, span { color: @sidebar-link-color-1; background: @sidebar-link-background-1; } &.active > a, a:hover { color: @sidebar-link-hover-color-1; background: @sidebar-link-hover-background-1; } } } } } /* * Theme 2 */ .book.color-theme-2{ .book-summary { color: @sidebar-color-2; background: @sidebar-background-2; .book-search { background: @sidebar-search-background-2; input, input:focus { border: 1px solid @sidebar-search-input-border-color-2; } } ul.summary { li { &.divider { background: @sidebar-divider-color-2; box-shadow: none; } i.fa-check { color: @sidebar-icon-color-2; } &.done > a { color: @sidebar-link-completed-2; } a, span { color: @sidebar-link-color-2; background: @sidebar-link-background-2; } &.active > a, a:hover { color: @sidebar-link-hover-color-2; background: @sidebar-link-hover-background-2; } } } } }