Skip to content

Commit

Permalink
feat: outline enhance & fix: table setting panel
Browse files Browse the repository at this point in the history
  • Loading branch information
Erimus-Koo committed Aug 13, 2022
1 parent 5232967 commit bb35bc1
Show file tree
Hide file tree
Showing 2 changed files with 271 additions and 99 deletions.
185 changes: 131 additions & 54 deletions typora-docsify.css
Expand Up @@ -5,7 +5,7 @@
--text-color: #222;
--meta-content-color: #06B;
--primary-color: #24D;
--active-file-bg-color: rgba(51, 51, 51, 0.1);
--active-file-bg-color: rgba(51, 51, 51, 0.05);
--active-file-border-color: #24D;
--side-bar-bg-color: #EEE;
--item-hover-bg-color: rgba(127, 127, 127, 0.1);
Expand Down Expand Up @@ -97,9 +97,8 @@ body,
.markdown-section h6::before,
#write h6 *::before,
.markdown-section h6 *::before {
font: 400 0.8em 'Poppins', 'Source Han Sans HC', 'PingFang', 'Microsoft YaHei', sans-serif;
color: inherit;
font-size: 0.8em;
font-weight: normal;
margin-right: 0.5rem;
border: none;
position: relative;
Expand Down Expand Up @@ -259,8 +258,8 @@ body,
.markdown-section pre[data-lang],
#write blockquote,
.markdown-section blockquote,
#write table,
.markdown-section table,
#write table:not(.md-grid-board),
.markdown-section table:not(.md-grid-board),
#write ul,
.markdown-section ul,
#write ol,
Expand Down Expand Up @@ -558,8 +557,7 @@ body,
}
#write ol li::marker,
.markdown-section ol li::marker {
font-family: 'JetBrains Mono', Menlo, Consolas, 'Source Han Sans HC', 'PingFang', 'Microsoft YaHei', monospace;
font-size: 0.9em;
font: 0.9em 'JetBrains Mono', Menlo, Consolas, 'Source Han Sans HC', 'PingFang', 'Microsoft YaHei', monospace;
}
#write .md-task-list-item,
.markdown-section .md-task-list-item,
Expand All @@ -578,8 +576,8 @@ body,
flex: none;
position: inherit;
}
#write table,
.markdown-section table,
#write table:not(.md-grid-board),
.markdown-section table:not(.md-grid-board),
#write .md-table,
.markdown-section .md-table {
display: table;
Expand All @@ -590,64 +588,64 @@ body,
border-collapse: separate;
border: 1px solid #CCC;
}
#write table th,
.markdown-section table th,
#write table:not(.md-grid-board) th,
.markdown-section table:not(.md-grid-board) th,
#write .md-table th,
.markdown-section .md-table th,
#write table td,
.markdown-section table td,
#write table:not(.md-grid-board) td,
.markdown-section table:not(.md-grid-board) td,
#write .md-table td,
.markdown-section .md-table td {
padding: 0.5em calc(1em);
vertical-align: top;
border: none;
}
#write table th:not(:last-child),
.markdown-section table th:not(:last-child),
#write table:not(.md-grid-board) th:not(:last-child),
.markdown-section table:not(.md-grid-board) th:not(:last-child),
#write .md-table th:not(:last-child),
.markdown-section .md-table th:not(:last-child),
#write table td:not(:last-child),
.markdown-section table td:not(:last-child),
#write table:not(.md-grid-board) td:not(:last-child),
.markdown-section table:not(.md-grid-board) td:not(:last-child),
#write .md-table td:not(:last-child),
.markdown-section .md-table td:not(:last-child) {
border-right: 1px dashed #8888;
}
#write table tr:last-child td,
.markdown-section table tr:last-child td,
#write table:not(.md-grid-board) tr:last-child td,
.markdown-section table:not(.md-grid-board) tr:last-child td,
#write .md-table tr:last-child td,
.markdown-section .md-table tr:last-child td {
border-bottom: none;
}
#write table th,
.markdown-section table th,
#write table:not(.md-grid-board) th,
.markdown-section table:not(.md-grid-board) th,
#write .md-table th,
.markdown-section .md-table th {
line-height: 1.5em;
}
#write table th,
.markdown-section table th,
#write table:not(.md-grid-board) th,
.markdown-section table:not(.md-grid-board) th,
#write .md-table th,
.markdown-section .md-table th,
#write table td,
.markdown-section table td,
#write table:not(.md-grid-board) td,
.markdown-section table:not(.md-grid-board) td,
#write .md-table td,
.markdown-section .md-table td {
border-bottom: 1px solid #CCC;
}
#write table th,
.markdown-section table th,
#write table:not(.md-grid-board) th,
.markdown-section table:not(.md-grid-board) th,
#write .md-table th,
.markdown-section .md-table th {
background: #EEE;
}
#write table tbody tr:nth-child(even),
.markdown-section table tbody tr:nth-child(even),
#write table:not(.md-grid-board) tbody tr:nth-child(even),
.markdown-section table:not(.md-grid-board) tbody tr:nth-child(even),
#write .md-table tbody tr:nth-child(even),
.markdown-section .md-table tbody tr:nth-child(even) {
background: rgba(238, 238, 238, 0.25);
}
#write table tbody tr:nth-child(odd),
.markdown-section table tbody tr:nth-child(odd),
#write table:not(.md-grid-board) tbody tr:nth-child(odd),
.markdown-section table:not(.md-grid-board) tbody tr:nth-child(odd),
#write .md-table tbody tr:nth-child(odd),
.markdown-section .md-table tbody tr:nth-child(odd) {
background: none;
Expand Down Expand Up @@ -746,38 +744,117 @@ body,
color: #C8C8C8 !important;
color: var(--blur-text-color) !important;
}
#outline-content .outline-active {
color: #24D;
#outline-content {
padding: 0 0.5em;
font: 400 0.8em 'JetBrains Mono', Menlo, Consolas, 'Source Han Sans HC', 'PingFang', 'Microsoft YaHei', monospace;
}
#outline-content .outline-h2 > ul,
#outline-content .outline-h3 > ul,
#outline-content .outline-h4 > ul,
#outline-content .outline-h5 > ul,
#outline-content .outline-h6 > ul {
padding-left: 1em;
#outline-content li ul {
padding-left: 2ch;
}
#outline-content li .outline-item {
padding: 0.5em 0.5em !important;
margin: 0;
border: none;
border-radius: 0.25em;
}
#outline-content .outline-h2 > .outline-item,
#outline-content .outline-h3 > .outline-item,
#outline-content .outline-h4 > .outline-item,
#outline-content .outline-h5 > .outline-item,
#outline-content .outline-h6 > .outline-item {
padding-left: 0 !important;
#outline-content li .outline-item .outline-expander {
padding-right: 1ch;
}
#outline-content .outline-h1 {
counter-reset: h2;
#outline-content li .outline-item .outline-label {
font: 1.25em 'Poppins', 'Source Han Sans HC', 'PingFang', 'Microsoft YaHei', sans-serif;
}
#outline-content .outline-h1 > .outline-item > .outline-label::before {
content: '';
#outline-content li .outline-item .outline-label:hover {
text-decoration: none;
}
#outline-content .outline-h2 > .outline-item > .outline-label::before {
#outline-content li .outline-item::before {
display: inline-block;
margin-right: 0.25em;
min-width: calc(1em - 0.25em);
flex: none;
padding: 0.3em 0.25em;
position: absolute;
text-align: right;
opacity: 0;
transition: all 3s;
}
#outline-content .outline-h2 > .outline-item > .outline-label::before {
#outline-content li .outline-item::before:hover {
color: #FFF;
background: red;
border-radius: 0.25em;
z-index: 99;
}
#outline-content li .outline-item:hover::before,
#outline-content li .outline-item .outline-active::before {
opacity: 0.75;
transition: all 0s;
}
#outline-content li .outline-item:hover {
background-color: inherit;
}
#outline-content li .outline-item .outline-active {
color: #24D;
font-weight: bold !important;
}
#outline-content .outline-h1 {
counter-reset: h2;
overflow: hidden;
}
#outline-content .outline-h1 > ul {
padding-left: 2.5ch;
}
#outline-content .outline-h2 {
padding: 2px 0;
counter-reset: h3;
counter-increment: h2;
content: counter(h2) ".";
}
#outline-content .outline-h2::before {
content: '';
display: block;
height: 1px;
width: 200%;
position: absolute;
top: 0;
left: -50%;
border-top: 1px solid #0001;
}
#outline-content .outline-h2 > .outline-item::before {
content: counter(h2);
min-width: 2ch;
left: -2ch;
opacity: 0.75;
}
#outline-content .outline-h3 {
counter-reset: h4;
counter-increment: h3;
}
#outline-content .outline-h3 > .outline-item::before {
content: counter(h2) "." counter(h3);
min-width: 4ch;
left: -4ch;
}
#outline-content .outline-h4 {
counter-reset: h5;
counter-increment: h4;
}
#outline-content .outline-h4 > .outline-item::before {
content: counter(h2) "." counter(h3) "." counter(h4);
min-width: 6ch;
left: -6ch;
}
#outline-content .outline-h5 {
counter-reset: h6;
counter-increment: h5;
}
#outline-content .outline-h5 > .outline-item::before {
content: counter(h2) "." counter(h3) "." counter(h4) "." counter(h5);
min-width: 8ch;
left: -8ch;
}
#outline-content .outline-h6 {
counter-increment: h6;
}
#outline-content .outline-h6 > .outline-item::before {
content: counter(h2) "." counter(h3) "." counter(h4) "." counter(h5) "." counter(h6);
min-width: 10ch;
left: -10ch;
}
.sidebar > h1 .app-name-link {
font-size: 0;
Expand Down

0 comments on commit bb35bc1

Please sign in to comment.