#typora-sidebar. As clicking "Files", the class named ".active-tab-files" is adding in the

#typora-sidebar while clicking "Outline" the the class named ".active-tab-outline" is adding in it, and clicking "Switch to tree view" the the class named ".use-file-tree-style" is adding in it. */ /*=======================================================================*/ /*初始设置，让sidebar占满整个屏幕并让content显示在上方，调节其他部分依旧在左侧*//*Firstly setting for making sidebar cover the whole view and let content show above the header, and remaining other part at right area*/ /*更新层叠顺序，让content显示在header上方，并且依然保留上方调节sidebar大小的能力*//*Renew the z-index and width*/ header{ z-index: -1; } /*设置【侧边栏】满宽度 *//*Set sidebar's width*/ .typora-node.pin-outline:not(.megamenu-opened):not(.typora-sourceview-on) #typora-sidebar{ width: 100% } /*设置【信息侧边栏】宽度 *//*Set other parts' width*/ .info-panel-tab-wrapper{ width: var(--sidebar-width); } .sidebar-footer{ width: var(--sidebar-width); } #file-library-search{ width: var(--sidebar-width); } #file-library-tree{ width: var(--sidebar-width); } #outline-content { width: var(--sidebar-width); min-width: 0%; } /*=======================================================================*/ /*设置TagBar的样式*//*Set the view of tag bar*/ /*【文件侧边栏-文件列表】*//*Files bar's files list*/ .pin-outline #file-library-list{ left: var(--sidebar-width); position: fixed; top: 0; height:8.5%; min-height: 0%; width: 100%; min-width: 0%; overflow-x: hidden; overflow-y: visible; background-color: var(--bg-color); /*transform: scaleY(-1);让scroll显示在上面*//*Upside down the scroll to show on the up part*/ } .pin-outline #file-library-list:hover{ overflow-x:scroll; } /*-----------------------------------------------------------------------*/ /*让竖向列表转成横向*//*Let the list show in a line*/ #file-library-list-children { display: inline-flex; background-color: var(--side-bar-bg-color); /*transform: scaleY(-1);*//*让scroll显示在上面*//*Upside down the scroll to show on the up part*/ } .pin-outline #typora-sidebar:not(.use-file-tree-style) #file-library{ background-color: var(--bg-color); } /*-----------------------------------------------------------------------*/ /*设置Tag的显示样式并绘制分隔符*//*Set every tag and draw the separator*/ .show-folder-name .file-list-item{ padding-top: 12px; } .file-list-item{ padding-top: 12px; padding-bottom: 8px; padding-left: 0; padding-right: 8px; width: 144px; height: 54px; } .file-list-item.active{ padding-left: 24px; padding-right: 8px; border-top-left-radius: 15%; border-top-right-radius: 15%; background-color: var(--bg-color); } .file-list-item:first-child{ padding-left: 24px; } .file-list-item:not(.active) + .file-list-item:not(.active) .file-list-item-file-name-part::before{ content: "|"; padding-left: 0; padding-right: 24px; } .file-list-item.active + .file-list-item:not(.active){ padding-left: 24px; } /*-----------------------------------------------------------------------*/ /*设置预览*//*Set the summary*/ .file-list-item-summary{ display: none; } .show-folder-name .file-list-item-parent-loc, .show-folder-name .file-list-item-time{ display: none; } #typora-sidebar:not(.use-file-tree-style):not(.active-tab-outline) .file-list-item:hover .file-list-item-summary, #typora-sidebar:not(.use-file-tree-style):not(.active-tab-outline) .show-folder-name .file-list-item:hover .file-list-item-parent-loc, #typora-sidebar:not(.use-file-tree-style):not(.active-tab-outline) .show-folder-name .file-list-item:hover .file-list-item-time{ position: fixed; left: 1%; height: 100%; width: calc(var(--sidebar-width) - 1%); display: block; } #typora-sidebar:not(.use-file-tree-style):not(.active-tab-outline).ty-show-search .file-list-item:hover .file-list-item-summary, #typora-sidebar:not(.use-file-tree-style):not(.active-tab-outline).ty-show-search .show-folder-name .file-list-item:hover .file-list-item-parent-loc, #typora-sidebar:not(.use-file-tree-style):not(.active-tab-outline).ty-show-search .show-folder-name .file-list-item:hover .file-list-item-time{ transform: translateY(10%); } #typora-sidebar:not(.use-file-tree-style):not(.active-tab-outline) .file-list-item:hover .file-list-item-summary{ top: 17%; } #typora-sidebar:not(.use-file-tree-style):not(.active-tab-outline) .show-folder-name .file-list-item:hover .file-list-item-parent-loc{ top: 10%; } #typora-sidebar:not(.use-file-tree-style):not(.active-tab-outline) .show-folder-name .file-list-item:hover .file-list-item-time{ top: 13%; } /*=======================================================================*/ /*逻辑设置*//*Logical setting*/ /*-----------------------------------------------------------------------*/ /*当点击显示侧边栏时【内容】*//*When toggling sidebar, move the content down and remain the top area for tag bar*/ .pin-outline content { min-height: 0%;top:8.5%; } /*-----------------------------------------------------------------------*/ /*点击“树状图”时【文件侧边栏-文件列表】*//*When click "Switch Tree View", show files list together*/ .pin-outline .use-file-tree-style #file-library-list{ display: block !important; } /*-----------------------------------------------------------------------*/ /*当点击“大纲”时，仍然显示【文件列表】*//*When clicking "Outline", show files list together*/ .pin-outline .active-tab-outline #file-library { display: block !important; } /*=======================================================================*/