vitepress-theme-element-plus 0.0.7 → 0.0.9

package/styles/doc-content.scss

@@ -1,231 +1,245 @@
-.doc-content {
-  h1  {
-    margin-bottom: 2rem;
-    font-weight: 600;
-    font-size: 1.9rem;
-  }
-
-  h2 {
-    margin-top: 2.25rem;
-    margin-bottom: 1.25rem;
-    padding-bottom: .3rem;
-    line-height: 1.25;
-    font-size: 1.65rem;
-    font-weight: 600;
-  }
-
-  h3 {
-    font-size: 1.35rem;
-    margin-top: 2rem;
-    font-weight: 600;
-  }
-
-  h4 {
-    font-size: 1.15rem;
-    font-weight: 600;
-  }
-
-  h5 {
-    font-weight: 600;
-  }
-
-  h2+h3 {
-    margin-top: 1.5rem;
-  }
-
-  p {
-    margin: 1rem 0;
-    line-height: 1.7;
-  }
-
-  a {
-    font-weight: 500;
-    text-decoration: inherit;
-    color: var(--brand-color);
-    display: inline-flex;
-    align-items: center;
-  }
-
-  a .link-icon {
-    margin-left: .25rem;
-    height: 1em;
-    width: 1em;
-  }
-
-
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  h6 {
-    display: flex;
-    align-items: center;
-    color: var(--el-text-color-regular);
-
-    // Special case for handling tagged header.
-    .el-tag,
-    .vp-tag {
-      margin-left: 8px;
-    }
-  }
-
-  @media screen and (min-width: 480px) {
-    h1 {
-      font-size: 2.2rem;
-    }
-  }
-
-  div .vp-table {
-    width: 100%;
-    overflow-y: hidden;
-    overflow-x: auto;
-    margin-bottom: 45px;
-
-    & > table {
-      border-collapse: collapse;
-      width: 100%;
-      background-color: var(--bg-color);
-      font-size: 14px;
-      line-height: 1.5em;
-
-      tr {
-        td:nth-child(2) {
-          font-family: var(--font-family);
-        }
-      }
-
-      th,
-      td {
-        white-space: nowrap;
-        border-top: 1px solid var(--border-color);
-        border-bottom: 1px solid var(--border-color);
-        padding: 0.6em 1em;
-        text-align: left;
-        max-width: 250px;
-        white-space: pre-wrap;
-      }
-
-      thead tr:first-child th {
-        border-top: none;
-      }
-
-      tbody tr td:first-child {
-        font-family: var(--font-family-mono);
-      }
-    }
-  }
-
-  .header-anchor:before {
-    content: '#';
-  }
-
-  a.header-anchor {
-    position: absolute;
-    margin-top: .125em;
-    margin-left: -.87em;
-    padding-right: .23em;
-    font-size: .85em;
-    opacity: 0;
-  }
-
-  h1:hover .header-anchor,h1:focus .header-anchor,h2:hover .header-anchor,h2:focus .header-anchor,h3:hover .header-anchor,h3:focus .header-anchor,h4:hover .header-anchor,h4:focus .header-anchor,h5:hover .header-anchor,h5:focus .header-anchor,h6:hover .header-anchor,h6:focus .header-anchor {
-    opacity: 1
-  }
-
-
-  .custom-block {
-    .custom-block-title {
-      font-weight: 700;
-    }
-
-    p:not(.custom-block-title) {
-      font-size: 0.9rem;
-    }
-
-    &.tip {
-      padding: 8px 16px;
-      background-color: var(--block-tip-bg-color);
-      border-radius: 4px;
-      border-left: 5px solid var(--el-color-primary);
-      margin: 20px 0;
-    }
-
-    &.warning {
-      padding: 8px 16px;
-      background-color: var(--block-warning-bg-color);
-      border-radius: 4px;
-      border-left: 5px solid var(--el-color-danger);
-      margin: 20px 0;
-    }
-  }
-
-  blockquote {
-    margin: 1rem 0;
-    border-left: .2rem solid var(--el-border-color);
-    padding: .25rem 0 .25rem 1rem;
-    font-size: 1rem;
-    color: var(--text-color-lighter)
-  }
-
-  blockquote>p {
-    margin: 0
-  }
-
-  form {
-    margin: 0
-  }
-
-  details summary {
-    margin: 16px 0;
-    font-size: 18px;
-    font-weight: 600;
-    cursor: pointer
-  }
-
-  figure {
-    margin: 0
-  }
-
-  img {
-    max-width: 100%
-  }
-
-  ul,
-  ol {
-    padding-left: 1.25em;
-  }
-
-  li>ul,
-  li>ol {
-    margin: 0
-  }
-
-  p,
-  ol,
-  ul {
-    margin: 1rem 0;
-    line-height: 1.7;
-    list-style-type: disc
-  }
-
-  ol>li {
-    list-style: auto
-  }
-
-  .ep-task-list {
-    padding-left: 0;
-
-    &>li {
-      list-style: none;
-    }
-  }
-
-  hr {
-    margin-top: 20px;
-    margin-bottom: 20px;
-    border: 0;
-    border-top: 1px solid var(--el-border-color-lighter);
-  }
-}
-
+.doc-content {
+  h1  {
+    margin-bottom: 2rem;
+    font-weight: 600;
+    font-size: 1.9rem;
+  }
+
+  h2 {
+    margin-top: 2.25rem;
+    margin-bottom: 1.25rem;
+    padding-bottom: .3rem;
+    line-height: 1.25;
+    font-size: 1.65rem;
+    font-weight: 600;
+  }
+
+  h3 {
+    font-size: 1.35rem;
+    margin-top: 2rem;
+    font-weight: 600;
+  }
+
+  h4 {
+    font-size: 1.15rem;
+    font-weight: 600;
+  }
+
+  h5 {
+    font-weight: 600;
+  }
+
+  h2+h3 {
+    margin-top: 1.5rem;
+  }
+
+  p {
+    margin: 1rem 0;
+    line-height: 1.7;
+  }
+
+  a {
+    font-weight: 500;
+    text-decoration: inherit;
+    color: var(--vp-c-brand);
+    display: inline-flex;
+    align-items: center;
+  }
+
+  a .link-icon {
+    margin-left: .25rem;
+    height: 1em;
+    width: 1em;
+  }
+
+
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    display: flex;
+    align-items: center;
+    color: var(--el-text-color-regular);
+
+    // Special case for handling tagged header.
+    .el-tag,
+    .vp-tag {
+      margin-left: 8px;
+    }
+  }
+
+  @media screen and (min-width: 480px) {
+    h1 {
+      font-size: 2.2rem;
+    }
+  }
+
+  div .vp-table {
+    width: 100%;
+    overflow-y: hidden;
+    overflow-x: auto;
+    margin-bottom: 45px;
+
+    & > table {
+      border-collapse: collapse;
+      width: 100%;
+      background-color: var(--bg-color);
+      font-size: 14px;
+      line-height: 1.5em;
+
+      tr {
+        td:nth-child(2) {
+          font-family: var(--font-family);
+        }
+      }
+
+      th,
+      td {
+        white-space: nowrap;
+        border-top: 1px solid var(--border-color);
+        border-bottom: 1px solid var(--border-color);
+        padding: 0.6em 1em;
+        text-align: left;
+        max-width: 250px;
+        white-space: pre-wrap;
+      }
+
+      thead tr:first-child th {
+        border-top: none;
+      }
+
+      tbody tr td:first-child {
+        font-family: var(--font-family-mono);
+      }
+    }
+  }
+
+  .header-anchor:before {
+    content: '#';
+  }
+
+  a.header-anchor {
+    position: absolute;
+    margin-top: .125em;
+    margin-left: -.87em;
+    padding-right: .23em;
+    font-size: .85em;
+    opacity: 0;
+  }
+
+  h1:hover .header-anchor,h1:focus .header-anchor,h2:hover .header-anchor,h2:focus .header-anchor,h3:hover .header-anchor,h3:focus .header-anchor,h4:hover .header-anchor,h4:focus .header-anchor,h5:hover .header-anchor,h5:focus .header-anchor,h6:hover .header-anchor,h6:focus .header-anchor {
+    opacity: 1
+  }
+
+
+  .custom-block {
+    .custom-block-title {
+      font-weight: 700;
+    }
+
+    p:not(.custom-block-title) {
+      font-size: 0.9rem;
+    }
+
+    &.tip {
+      padding: 8px 16px;
+      background-color: var(--block-tip-bg-color);
+      border-radius: 4px;
+      border-left: 5px solid var(--el-color-primary);
+      margin: 20px 0;
+    }
+
+    &.warning {
+      padding: 8px 16px;
+      background-color: var(--block-warning-bg-color);
+      border-radius: 4px;
+      border-left: 5px solid var(--el-color-danger);
+      margin: 20px 0;
+    }
+  }
+
+  blockquote {
+    margin: 1rem 0;
+    border-left: .2rem solid var(--el-border-color);
+    padding: .25rem 0 .25rem 1rem;
+    font-size: 1rem;
+    color: var(--text-color-lighter)
+  }
+
+  blockquote>p {
+    margin: 0
+  }
+
+  form {
+    margin: 0
+  }
+
+  details summary {
+    margin: 16px 0;
+    font-size: 18px;
+    font-weight: 600;
+    cursor: pointer
+  }
+
+  figure {
+    margin: 0
+  }
+
+  img {
+    max-width: 100%
+  }
+
+  ul,
+  ol {
+    padding-left: 1.25em;
+  }
+
+  li>ul,
+  li>ol {
+    margin: 0
+  }
+
+  p,
+  ol,
+  ul {
+    margin: 1rem 0;
+    line-height: 1.7;
+    list-style-type: disc
+  }
+
+  ol>li {
+    list-style: auto
+  }
+
+  .ep-task-list {
+    padding-left: 0;
+    .el-checkbox {
+      --el-checkbox-checked-text-color: var(--vp-c-brand);
+      cursor: unset;
+    }
+    .el-checkbox__input {
+      cursor: unset;
+    }
+    .el-checkbox__inner:hover {
+      border: var(--el-checkbox-input-border);
+    }
+    .el-checkbox__input.is-checked .el-checkbox__inner {
+      background-color: var(--vp-c-brand);
+      border-color: var(--vp-c-brand);
+    }
+
+    &>li {
+      list-style: none;
+    }
+  }
+
+  hr {
+    margin-top: 20px;
+    margin-bottom: 20px;
+    border: 0;
+    border-top: 1px solid var(--el-border-color-lighter);
+  }
+}
+

package/styles/index.scss

@@ -1,69 +1,63 @@
-:root {
-  --vp-layout-max-width: 1680px;
-  --vp-sidebar-width-small: 266px;
-  --vp-sidebar-width-mobile: 320px;
-  --text-color: var(--el-text-color-primary);
-  --text-color-light: var(--el-text-color-regular);
-  --text-color-lighter: var(--el-text-color-secondary);
-  --brand-color: var(--el-color-primary);
-  --brand-color-light: var(--el-color-primary-light-1);
-  --bg-brand-color: var(--el-color-primary-light-9);
-  --bg-color: var(--el-bg-color);
-  --bg-color-rgb: 255, 255, 255;
-  --bg-color-soft: #fafafa;
-  --bg-color-mute: #f2f2f2;
-  --border-color: var(--el-border-color);
-  --border-color-light: var(--el-border-color-lighter);
-  --font-family: var(--el-font-family);
-  --font-family-mono: "JetBrains Mono", source-code-pro, Menlo, Monaco, Consolas, "Courier New", monospace;
-  --success-color: var(--el-color-success);
-  --warning-color: var(--el-color-warning);
-  --danger-color: var(--el-color-danger);
-  --vp-screen-max-width: 1362px;
-  --vp-sidebar-width-mobile: 320px;
-  --vp-sidebar-width-small: 266px;
-  --code-font-family: var(--font-family-mono);
-  --code-font-size: var(--el-font-size-base);
-  --code-bg-color: var(--el-fill-color-light);
-  --code-text-color: var(--text-color);
-  --code-tooltip-bg-color: var(--code-bg-color);
-  --code-tooltip-color: #0c61c9;
-  --block-tip-bg-color: rgba(var(--el-color-primary-rgb), .1);
-  --block-warning-bg-color: rgba(var(--el-color-danger-rgb), .1);
-  --link-active-bg-color: rgba(var(--el-color-primary-rgb), .1)
-
-  &.dark {
-    --el-color-primary: #a8b1ff;
-  }
-}
-
-:root:root {
-  --vp-nav-height: 55px;
-  --vp-nav-logo-height: 28px;
-  --vp-c-brand: var(--el-color-primary);
-  --vp-c-brand-1: var(--el-color-primary);
-  --vp-c-bg: var(--el-bg-color);
-}
-// fix "vitepress-plugin-group-icons" 
-.vp-code-block-title-bar.vp-code-block-title-bar {
-    margin: 16px 0px 0px;
-}
-
-.vp-code-group .tabs.tabs {
-  margin-right: 0px;
-  margin-left: 0px;
-  border-radius: 8px 8px 0px 0px;
-}
-
-@media screen and (min-width: 1440px) {
-  :root {
-    --vp-sidebar-width-small: 234px;
-  }
-}
-
-@media screen and (min-width: 1680px) {
-  :root {
-    --vp-screen-max-width: 1482px;
-    --vp-sidebar-width-small: 290px;
-  }
-}
+// #region snippet
+:root {
+  --vp-layout-max-width: 1680px;
+  --vp-screen-max-width: 1362px;
+  --vp-sidebar-width-mobile: 320px;
+  --vp-sidebar-width-small: 266px;
+  --vp-nav-height: 55px;
+  --vp-nav-logo-height: 28px;
+  --vp-c-brand: var(--el-color-primary);
+  --vp-c-brand-1: var(--vp-c-brand);
+  --vp-c-brand-2: var(--el-color-primary);
+  --vp-c-brand-3: var(--el-color-primary);
+  --vp-c-brand-soft: var(--el-color-primary-light-9);
+  --vp-c-bg: var(--el-bg-color);
+  --text-color: var(--el-text-color-primary);
+  --text-color-light: var(--el-text-color-regular);
+  --text-color-lighter: var(--el-text-color-secondary);
+  --bg-brand-color: var(--vp-c-brand-soft);
+  --bg-color: var(--el-bg-color);
+  --border-color: var(--el-border-color);
+  --font-family: var(--el-font-family);
+  --font-family-mono: "JetBrains Mono", source-code-pro, Menlo, Monaco, Consolas, "Courier New", monospace;
+  --code-font-family: var(--font-family-mono);
+  --code-font-size: var(--el-font-size-base);
+  --code-bg-color: var(--el-fill-color-light);
+  --code-text-color: var(--text-color);
+  --code-tooltip-bg-color: var(--code-bg-color);
+  --code-tooltip-color: #0c61c9;
+  --purple-color: #6222c2;
+  --purple-color-light: #9065db;
+  --block-tip-bg-color: rgba(var(--el-color-primary-rgb), .1);
+  --block-warning-bg-color: rgba(var(--el-color-danger-rgb), .1);
+  --link-active-bg-color: rgba(var(--el-color-primary-rgb), .1)
+}
+
+:root.dark {
+  --vp-c-brand: #a8b1ff;
+}
+// #endregion snippet
+
+@media screen and (min-width: 1440px) {
+  :root {
+    --vp-sidebar-width-small: 234px;
+  }
+}
+
+@media screen and (min-width: 1680px) {
+  :root {
+    --vp-screen-max-width: 1482px;
+    --vp-sidebar-width-small: 290px;
+  }
+}
+
+// fix "vitepress-plugin-group-icons" problem
+.vp-code-block-title-bar.vp-code-block-title-bar {
+    margin: 16px 0px 0px;
+}
+
+.vp-code-group .tabs.tabs {
+  margin-right: 0px;
+  margin-left: 0px;
+  border-radius: 8px 8px 0px 0px;
+}

package/styles/tag-content.scss

@@ -1,30 +1,30 @@
-.vp-tag {
-  --vp-tag-color: var(--vp-c-brand);
-  --vp-tag-border-color: var(--vp-c-brand);
-
-  display: inline-block;
-  padding: 0 7px;
-  border-radius: 10px;
-  border: 1px solid var(--vp-tag-border-color);
-  font-size: var(--el-font-size-extra-small);
-  color: var(--vp-tag-color);
-  line-height: 18px;
-  white-space: nowrap;
-
-  &.beta {
-    --vp-tag-color: var(--el-color-danger);
-    --vp-tag-border-color: var(--el-color-danger);
-  }
-  &.deprecated {
-    --vp-tag-color: var(--el-color-warning);
-    --vp-tag-border-color: var(--el-color-warning);
-  }
-  &.a11y {
-    --vp-tag-color: var(--purple-color);
-    --vp-tag-border-color: var(--purple-color-light);
-  }
-  &.required {
-    --vp-tag-color: var(--el-color-success);
-    --vp-tag-border-color: var(--el-color-success);
-  }
-}
+.vp-tag {
+  --vp-tag-color: var(--vp-c-brand);
+  --vp-tag-border-color: var(--vp-c-brand);
+
+  display: inline-block;
+  padding: 0 7px;
+  border-radius: 10px;
+  border: 1px solid var(--vp-tag-border-color);
+  font-size: var(--el-font-size-extra-small);
+  color: var(--vp-tag-color);
+  line-height: 18px;
+  white-space: nowrap;
+
+  &.beta {
+    --vp-tag-color: var(--el-color-danger);
+    --vp-tag-border-color: var(--el-color-danger);
+  }
+  &.deprecated {
+    --vp-tag-color: var(--el-color-warning);
+    --vp-tag-border-color: var(--el-color-warning);
+  }
+  &.a11y {
+    --vp-tag-color: var(--purple-color);
+    --vp-tag-border-color: var(--purple-color-light);
+  }
+  &.required {
+    --vp-tag-color: var(--el-color-success);
+    --vp-tag-border-color: var(--el-color-success);
+  }
+}