xuquan-nikkkki_FolderFile-S.../styles.css

273 lines
5.2 KiB
CSS

/*
This CSS file will be included with your plugin, and
available in the app when your plugin is enabled.
If your plugin does not need CSS, delete this file.
*/
.theme-light,
.theme-dark {
--asn-folder-pane-min-width: 140px;
--asn-files-pane-min-width: 200px;
--asn-folder-border-radius: 4px;
}
.theme-light {
--asn-pane-divider-color: #d3d4d6;
--asn-folder-hover-background-color: #e5e5e5;
--asn-files-count-color: #a6a6a7;
--asn-folder-toggle-icon-color: #585a5d;
--asn-folder-focused-color: #fdf8eb;
--asn-focused-folder-background-color: #ecc44c;
--asn-actions-background-color: #e5e5e5;
--asn-actions-icon-color: #898989;
--asn-file-content-preview-color: #999999;
--asn-file-created-time-color: #515151;
--asn-editing-mode-color: #000000;
--asn-editing-background-color: #ffffff;
}
.theme-dark {
--asn-pane-divider-color: #000000;
--asn-folder-hover-background-color: #2e2d2c;
--asn-files-count-color: #89898a;
--asn-folder-toggle-icon-color: #bfc2c2;
--asn-folder-focused-color: #ffffff;
--asn-focused-folder-background-color: #debe5b;
--asn-actions-background-color: #2e2d2c;
--asn-actions-icon-color: #a59982;
--asn-file-content-preview-color: #9b9d9f;
--asn-file-created-time-color: #dddede;
--asn-editing-mode-color: #ffffff;
--asn-editing-background-color: #000000;
}
.asn-plugin-view {
height: 100%;
min-width: calc(
var(--asn-folder-pane-min-width) + var(--asn-files-pane-min-width)
);
}
.asn-plugin-container {
display: flex;
height: 100%;
overflow-y: auto;
}
.asn-folder-pane {
min-width: var(--asn-folder-pane-min-width);
margin-right: 8px;
}
.asn-files-pane {
min-width: var(--asn-files-pane-min-width);
flex: 1;
}
.asn-pane-divider {
border: 1px solid var(--asn-pane-divider-color);
cursor: ew-resize;
}
.asn-folder {
height: 30px;
font-size: 13px;
display: flex;
align-items: center;
justify-content: space-between;
padding-left: 6px;
padding-right: 6px;
}
.asn-folder:hover {
background-color: var(--asn-folder-hover-background-color);
border-radius: var(--asn-folder-border-radius);
}
.asn-root-folder {
font-size: 14px;
font-weight: 450;
}
.asn-folder-pane-left-sectionn {
display: flex;
align-items: center;
flex: 1;
overflow: hidden;
}
.asn-folder-arrow-icon-wrapper {
width: 14px;
display: flex;
align-items: center;
margin-right: 2px;
padding: 2px;
}
.asn-folder-icon {
width: 14px;
height: 12px;
fill: #d19600;
margin-right: 8px;
}
.asn-root-folder .asn-folder-icon {
width: 16px;
height: 14px;
}
.asn-root-folder .asn-folder-arrow-icon-wrapper {
width: 4px;
}
.asn-root-folder .asn-root-folder-icon {
width: 16px;
height: 14px;
}
.asn-arrow-down-icon,
.asn-arrow-right-icon {
width: 8px;
height: 8px;
fill: #5a5d63;
}
.asn-files-count {
color: var(--asn-files-count-color);
font-size: 12px;
margin-left: 4px;
}
.asn-folder-pane .asn-focused-folder {
background-color: var(--asn-focused-folder-background-color);
border-radius: var(--asn-folder-border-radius);
}
.asn-folder-pane .asn-folder-name-edit-mode {
background-color: var(--asn-editing-background-color) !important;
color: var(--asn-editing-mode-color) !important;
}
.asn-files-pane .asn-file-name-edit-mode {
background-color: var(--asn-editing-background-color) !important;
color: var(--asn-editing-mode-color) !important;
}
.asn-focused-folder,
.asn-focused-folder .asn-files-count {
color: var(--asn-folder-focused-color);
font-weight: 450;
}
.asn-focused-folder .asn-arrow-down-icon,
.asn-focused-folder .asn-folder-icon {
fill: var(--asn-folder-focused-color);
}
.asn-folder-name {
flex: 1;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.asn-sub-folders-section {
margin-left: 6px;
}
.asn-none-files-tips {
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.asn-none-files-tips .asn-empty-folder-icon {
width: 60px;
height: 60px;
fill: #bdbdbd;
}
.asn-file {
height: 56px;
font-size: 12px;
margin-left: 12px;
display: flex;
flex-direction: column;
justify-content: center;
border-radius: var(--asn-folder-border-radius);
padding: 0 12px;
}
.asn-file:not(:last-child) {
border-bottom: 1px solid #e6e6e6;
}
.asn-file:hover {
background-color: #dcdcdc;
}
.asn-file .asn-file-name {
font-size: 13px;
font-weight: 600;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.asn-file .asn-file-created-time {
letter-spacing: -0.5px;
width: 60px;
color: var(--asn-file-created-time-color);
font-weight: 480;
}
.asn-file-details {
display: flex;
margin-top: 4px;
}
.asn-files-pane .asn-focused-file {
background-color: var(--asn-focused-folder-background-color);
}
.asn-file-content-preview {
flex: 1;
margin-left: 12px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-size: 12px;
color: var(--asn-file-content-preview-color);
}
.asn-actions {
margin: 0px auto 4px;
padding: 8px 16px 4px;
border-radius: var(--asn-folder-border-radius);
background-color: var(--asn-actions-background-color);
display: flex;
}
.asn-file-actions {
margin-left: 12px;
}
.asn-folder-actions-icon {
width: 18px;
height: 18px;
stroke: var(--asn-actions-icon-color);
}
.asn-folder-actions-icon:hover {
transform: scale(1.1);
}
.asn-actions-icon-wrapper:not(:last-child) {
margin-right: 12px;
}