初始化提交
This commit is contained in:
王立帮
36
common/templates/html/sidebar/left-sidebars-manager.html
Normal file
36
common/templates/html/sidebar/left-sidebars-manager.html
Normal file
@@ -0,0 +1,36 @@
|
||||
<style>
|
||||
div[m-id="{{d.mId}}"] {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] > .tabs {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 23px;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] > .body {
|
||||
position: absolute;
|
||||
left: 23px;
|
||||
right: 0px;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
html[data-bs-theme=light] div[m-id="{{d.mId}}"] > .body {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
html[data-bs-theme=dark] div[m-id="{{d.mId}}"] > .body {
|
||||
background-color: #1e1e1e;
|
||||
}
|
||||
</style>
|
||||
<div m-id="{{d.mId}}">
|
||||
<div class="tabs"></div>
|
||||
<div class="body"></div>
|
||||
</div>
|
||||
80
common/templates/html/sidebar/left-sidebars-tab.html
Normal file
80
common/templates/html/sidebar/left-sidebars-tab.html
Normal file
@@ -0,0 +1,80 @@
|
||||
<style>
|
||||
div[m-id="{{d.mId}}"] {
|
||||
width: 23px;
|
||||
z-index: 3;
|
||||
padding: 0px;
|
||||
border-width: 0px 1px 0px 0px;
|
||||
border-style: solid;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
html[data-bs-theme=light] div[m-id="{{d.mId}}"] {
|
||||
background-color: #f8f8f8;
|
||||
border-color: #c9c9c9;
|
||||
}
|
||||
|
||||
html[data-bs-theme=dark] div[m-id="{{d.mId}}"] {
|
||||
background-color: #252526;
|
||||
border-color: rgba(128, 128, 128, 0.35);
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] .x-scrollbar__content {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] .chrome-tab {
|
||||
display: inline-flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
height: unset;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] .chrome-tab > .chrome-tab-background {
|
||||
top: 1px;
|
||||
bottom: 1px;
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] .chrome-tab[active] > .chrome-tab-background {
|
||||
border-width: 0 0 0 2px;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] .chrome-tab > .chrome-tab-content {
|
||||
padding: 2px 0;
|
||||
height: fit-content;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] .chrome-tab > .chrome-tab-content > .chrome-tab-title {
|
||||
writing-mode: tb-rl;
|
||||
overflow: visible;
|
||||
margin: 4px 0;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] .chrome-tab > .chrome-tab-dividers {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
bottom: 0px;
|
||||
left: 8px;
|
||||
right: 8px;
|
||||
}
|
||||
div[m-id="{{d.mId}}"] .chrome-tab > .chrome-tab-dividers::before,
|
||||
div[m-id="{{d.mId}}"] .chrome-tab > .chrome-tab-dividers::after {
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 0.5px;
|
||||
width: 100%;
|
||||
background: #a9adb0;
|
||||
opacity: 1;
|
||||
}
|
||||
</style>
|
||||
<div m-id="{{d.mId}}" class="chrome-tabs">
|
||||
<div class="chrome-tabs-content">
|
||||
</div>
|
||||
</div>
|
||||
36
common/templates/html/sidebar/right-sidebars-manager.html
Normal file
36
common/templates/html/sidebar/right-sidebars-manager.html
Normal file
@@ -0,0 +1,36 @@
|
||||
<style>
|
||||
div[m-id="{{d.mId}}"] {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] > .body {
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
right: 23px;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
html[data-bs-theme=light] div[m-id="{{d.mId}}"] > .body {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
html[data-bs-theme=dark] div[m-id="{{d.mId}}"] > .body {
|
||||
background-color: #1e1e1e;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] > .tabs {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
right: 0px;
|
||||
width: 23px;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
<div m-id="{{d.mId}}">
|
||||
<div class="body"></div>
|
||||
<div class="tabs"></div>
|
||||
</div>
|
||||
80
common/templates/html/sidebar/right-sidebars-tab.html
Normal file
80
common/templates/html/sidebar/right-sidebars-tab.html
Normal file
@@ -0,0 +1,80 @@
|
||||
<style>
|
||||
div[m-id="{{d.mId}}"] {
|
||||
width: 23px;
|
||||
z-index: 3;
|
||||
padding: 0px;
|
||||
border-width: 0px 0px 0px 1px;
|
||||
border-style: solid;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
html[data-bs-theme=light] div[m-id="{{d.mId}}"] {
|
||||
background-color: #f8f8f8;
|
||||
border-color: #c9c9c9;
|
||||
}
|
||||
|
||||
html[data-bs-theme=dark] div[m-id="{{d.mId}}"] {
|
||||
background-color: #252526;
|
||||
border-color: rgba(128, 128, 128, 0.35);
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] .x-scrollbar__content {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] .chrome-tab {
|
||||
display: inline-flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
height: unset;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] .chrome-tab > .chrome-tab-background {
|
||||
top: 1px;
|
||||
bottom: 1px;
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] .chrome-tab[active] > .chrome-tab-background {
|
||||
border-width: 0 2px 0 0;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] .chrome-tab > .chrome-tab-content {
|
||||
padding: 2px 0;
|
||||
height: fit-content;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] .chrome-tab > .chrome-tab-content > .chrome-tab-title {
|
||||
writing-mode: tb-rl;
|
||||
overflow: visible;
|
||||
margin: 4px 0;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] .chrome-tab > .chrome-tab-dividers {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
bottom: 0px;
|
||||
left: 8px;
|
||||
right: 8px;
|
||||
}
|
||||
div[m-id="{{d.mId}}"] .chrome-tab > .chrome-tab-dividers::before,
|
||||
div[m-id="{{d.mId}}"] .chrome-tab > .chrome-tab-dividers::after {
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 0.5px;
|
||||
width: 100%;
|
||||
background: #a9adb0;
|
||||
opacity: 1;
|
||||
}
|
||||
</style>
|
||||
<div m-id="{{d.mId}}" class="chrome-tabs">
|
||||
<div class="chrome-tabs-content">
|
||||
</div>
|
||||
</div>
|
||||
75
common/templates/html/sidebar/sidebar-libs.html
Normal file
75
common/templates/html/sidebar/sidebar-libs.html
Normal file
@@ -0,0 +1,75 @@
|
||||
<style>
|
||||
div[m-id="{{d.mId}}"] {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] .layui-panel {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] .layui-panel > .background {
|
||||
width: 100%;
|
||||
padding: 32px;
|
||||
border: 1px solid;
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
html[data-bs-theme=light] div[m-id="{{d.mId}}"] .layui-panel > .background {
|
||||
background-color: #1e1e1e;
|
||||
}
|
||||
|
||||
html[data-bs-theme=dark] div[m-id="{{d.mId}}"] .layui-panel > .background {
|
||||
background-color: #1e1e1e;
|
||||
}
|
||||
|
||||
html[data-bs-theme=light] div[m-id="{{d.mId}}"] .layui-panel > .background:focus {
|
||||
border-color: var(--app-light-color);
|
||||
}
|
||||
|
||||
html[data-bs-theme=dark] div[m-id="{{d.mId}}"] .layui-panel > .background:focus {
|
||||
border-color: var(--app-dark-color);
|
||||
}
|
||||
|
||||
html[data-bs-theme=light] div[m-id="{{d.mId}}"] .layui-panel > .background:hover {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
html[data-bs-theme=dark] div[m-id="{{d.mId}}"] .layui-panel > .background:hover {
|
||||
background-color: #333;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] .layui-panel > .content {
|
||||
padding: 32px;
|
||||
border: 1px solid;
|
||||
border-color: transparent;
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
bottom: 0px;
|
||||
}
|
||||
</style>
|
||||
<div m-id={{d.mId}}>
|
||||
<div class="layui-panel panel-item">
|
||||
<button class="background">面板任意内容</button>
|
||||
</div>
|
||||
<div class="layui-panel panel-item">
|
||||
<button class="background">面板任意内容</button>
|
||||
</div>
|
||||
<div class="layui-panel panel-item">
|
||||
<button class="background">面板任意内容</button>
|
||||
</div>
|
||||
<div class="layui-panel panel-item">
|
||||
<button class="background">面板任意内容</button>
|
||||
</div>
|
||||
<div class="layui-panel panel-item">
|
||||
<button class="background">面板任意内容</button>
|
||||
</div>
|
||||
<div class="layui-panel panel-item">
|
||||
<button class="background">面板任意内容</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,25 @@
|
||||
<style>
|
||||
div[m-id="{{d.mId}}"] {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] > button {
|
||||
margin: 15px;
|
||||
max-width: 200px;
|
||||
width: 100%;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
color: #fff !important;
|
||||
height: 25px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
</style>
|
||||
<div m-id="{{d.mId}}">
|
||||
<button class="layui-btn layui-btn-xs m-btn self-adaption-btn">打开文件夹</button>
|
||||
</div>
|
||||
122
common/templates/html/sidebar/sidebar-local-storage.html
Normal file
122
common/templates/html/sidebar/sidebar-local-storage.html
Normal file
@@ -0,0 +1,122 @@
|
||||
<style>
|
||||
div[m-id="{{d.mId}}"] {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] > .progress {
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
top: 0px;
|
||||
width: 100%;
|
||||
height: 3px;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
html[data-bs-theme=light] div[m-id="{{d.mId}}"] > .progress,
|
||||
html[data-bs-theme=light] div[m-id="{{d.mId}}"] > .progress .bar-bg {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
html[data-bs-theme=dark] div[m-id="{{d.mId}}"] > .progress,
|
||||
html[data-bs-theme=dark] div[m-id="{{d.mId}}"] > .progress .bar-bg {
|
||||
background-color: #1e1e1e;
|
||||
}
|
||||
|
||||
html[data-bs-theme=light] div[m-id="{{d.mId}}"] > .progress > .ui-mprogress > .indeter-bar {
|
||||
background-color: var(--app-light-color);
|
||||
}
|
||||
|
||||
html[data-bs-theme=dark] div[m-id="{{d.mId}}"] > .progress > .ui-mprogress > .indeter-bar {
|
||||
background-color: var(--app-dark-color);
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] > .folder-title {
|
||||
position: absolute;
|
||||
top: 3px;
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
height: 24px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
text-align: left;
|
||||
border: 1px solid;
|
||||
border-color: transparent;
|
||||
padding: 0 1px;
|
||||
}
|
||||
|
||||
html[data-bs-theme=light] div[m-id="{{d.mId}}"] > .folder-title:focus {
|
||||
background: #d7daeb;
|
||||
}
|
||||
|
||||
html[data-bs-theme=dark] div[m-id="{{d.mId}}"] > .folder-title:focus {
|
||||
background: #5a5959;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] > .folder-title > * {
|
||||
line-height: 24px;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] > .folder-title > .mixly-icon.triangle {
|
||||
font-size: 15px !important;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] > .folder-title > .mixly-icon.folder:before {
|
||||
margin: 0 0.2em;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] > .folder-title > .name {
|
||||
font-family: Segoe WPC,Segoe UI,Microsoft YaHei,sans-serif;
|
||||
font-size: 12px !important;
|
||||
padding-left: 2px;
|
||||
font-weight: bold;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] > .children {
|
||||
position: absolute;
|
||||
top: 27px;
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
bottom: 0px;
|
||||
display: none;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] > .children .jstree,
|
||||
div[m-id="{{d.mId}}"] > .children .jstree-container-ul {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] .jstree-container-ul > .jstree-node {
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
div[m-id="{{d.mId}}"] .jstree-node > .jstree-wholerow {
|
||||
border: 1px solid;
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
html[data-bs-theme=light] div[m-id="{{d.mId}}"] > .folder-title.active,
|
||||
html[data-bs-theme=light] div[m-id="{{d.mId}}"] .jstree-node.active > .jstree-wholerow {
|
||||
border-color: var(--app-light-color) !important;
|
||||
}
|
||||
|
||||
html[data-bs-theme=dark] div[m-id="{{d.mId}}"] > .folder-title.active,
|
||||
html[data-bs-theme=dark] div[m-id="{{d.mId}}"] .jstree-node.active > .jstree-wholerow {
|
||||
border-color: var(--app-dark-color) !important;
|
||||
}
|
||||
</style>
|
||||
<div m-id="{{d.mId}}">
|
||||
<div class="progress"></div>
|
||||
<button type="root" class="folder-title layui-btn layui-btn-xs layui-btn-primary">
|
||||
<i class="mixly-icon triangle codicon-chevron-right"></i>
|
||||
<i class="mixly-icon folder foldericon-root-default"></i>
|
||||
<p class="name"></p>
|
||||
</button>
|
||||
<div class="children"></div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user