diff --git a/README.md b/README.md index 410afe6..bd0fee7 100644 --- a/README.md +++ b/README.md @@ -28,8 +28,8 @@ A minimalism, personal blog theme for Astro. - [x] 📰 RSS feed & sitemap support - [x] 🛠️ Google analysis integration - [x] 💬 Commenting Integration (Twikoo) +- [x] 🎨 Enhance Transition and Animation - [ ] 🔍 Local search functionality -- [ ] 🎨 Enhance Transition and Animation - [ ] ...and more ## Quick Start diff --git a/src/components/astro/comments.astro b/src/components/astro/comments.astro index 079526b..de6c619 100644 --- a/src/components/astro/comments.astro +++ b/src/components/astro/comments.astro @@ -1,11 +1,6 @@ --- -import Twikoo from "~/components/react/comment/twikoo.tsx" +import Twikoo from "~/components/astro/twikoo.astro" import { common } from "~/config" -import "~/styles/comment.css" --- -{ - common.comments.enabled && common.comments.twikoo.enabled && ( - - ) -} +{common.comments.enabled && common.comments.twikoo.enabled && } diff --git a/src/components/astro/twikoo.astro b/src/components/astro/twikoo.astro new file mode 100644 index 0000000..95d6e3f --- /dev/null +++ b/src/components/astro/twikoo.astro @@ -0,0 +1,23 @@ +
+ + diff --git a/src/components/react/comment/twikoo.tsx b/src/components/react/comment/twikoo.tsx deleted file mode 100644 index 0920d35..0000000 --- a/src/components/react/comment/twikoo.tsx +++ /dev/null @@ -1,20 +0,0 @@ -import { useEffect } from "react" -// @ts-ignore -import twikoo from "twikoo" -import { common, defaultLanguage } from "~/config" - -const Twikoo = () => { - useEffect(() => { - twikoo({ - envId: common.comments.twikoo.envId, - el: "#tcomment", - lang: defaultLanguage === "zh" ? "zh-CN" : "en-GB", - }).then(() => { - console.log("comment loading success") - }) - }, []) - - return
-} - -export default Twikoo diff --git a/src/layouts/base.astro b/src/layouts/base.astro index 56af75c..6b03c12 100644 --- a/src/layouts/base.astro +++ b/src/layouts/base.astro @@ -4,6 +4,7 @@ import { NoiseBackground } from "~/components/react/noise-background" import { getLangFromUrl } from "~/i18n/utils" import { GoogleAnalytics } from "astro-google-analytics" import { en, zh } from "~/config" +import { ClientRouter } from "astro:transitions" const lang = getLangFromUrl(Astro.url) @@ -88,6 +89,7 @@ const config = lang === "zh" ? zh : en ) } + span > p { - display: flex; - flex-direction: column; - justify-content: center; - gap: 10px; -} - -.tk-main .tk-content { - display: flex; - flex-direction: column; - justify-content: center; - gap: 10px; -} - -.tk-main .tk-content > span > p > img { - border-radius: 20px !important; -} - -.tk-extras { - margin-top: 5px !important; -} diff --git a/src/styles/twikoo.css b/src/styles/twikoo.css new file mode 100644 index 0000000..bc437f4 --- /dev/null +++ b/src/styles/twikoo.css @@ -0,0 +1,1954 @@ +/*! + * Twikoo v1.6.40 + * (c) 2020-2024 iMaeGoo + * Released under the MIT License. + * Last Update: 11/17/2024, 2:31:23 AM + */ + +.tk-avatar { + flex-shrink: 0; + height: 2.5rem; + width: 2.5rem; + overflow: hidden; + text-align: center; + border-radius: 5px; + margin-right: 1rem; +} +.tk-comment .tk-submit .tk-avatar, +.tk-replies .tk-avatar { + height: 1.6rem; + width: 1.6rem; +} +.tk-avatar.tk-has-avatar { + background-color: rgba(144, 147, 153, 0.13); +} +.tk-avatar.tk-clickable { + cursor: pointer; +} +.tk-avatar .tk-avatar-img { + height: 2.5rem; + color: #c0c4cc; +} +.tk-comment .tk-submit .tk-avatar .tk-avatar-img, +.tk-replies .tk-avatar .tk-avatar-img { + height: 1.6rem; +} + +.tk-meta-input { + display: flex; +} +.tk-meta-input .el-input { + width: auto; + width: calc((100% - 1rem) / 3); /* Fix Safari */ + flex: 1; +} +.tk-meta-input .el-input + .el-input { + margin-left: 0.5rem; +} +.tk-meta-input .el-input .el-input-group__prepend { + padding: 0 1rem; +} +.tk-meta-input .el-input input:invalid { + border: 1px solid #f56c6c; + box-shadow: none; +} +@media screen and (max-width: 767px) { + .tk-meta-input { + flex-direction: column; + } + .tk-meta-input .el-input { + width: auto; + } + .tk-meta-input .el-input + .el-input { + margin-left: 0; + margin-top: 0.5rem; + } +} + +.tk-submit { + display: flex; + flex-direction: column; +} +.tk-row { + display: flex; + flex-direction: row; +} +.tk-col { + flex: 1; + display: flex; + flex-direction: column; +} +.tk-meta-input { + margin-bottom: 0.5rem; +} +.tk-row.actions { + position: relative; + margin-top: 1rem; + margin-bottom: 1rem; + margin-left: 3.5rem; + align-items: center; + justify-content: flex-end; +} +.tk-row-actions-start { + flex: 1; + display: flex; + align-items: center; +} +.tk-submit-action-icon { + align-self: center; + display: inline-block; + width: 1.25em; + line-height: 0; + margin-right: 10px; + cursor: pointer; + flex-shrink: 0; +} +.tk-submit-action-icon svg:hover { + opacity: 0.8; +} +.tk-submit-action-icon.__markdown { + color: #909399; +} +.tk-error-message { + word-break: break-all; + color: #ff0000; + font-size: 0.75em; + flex-shrink: 1; +} +.tk-input-image { + display: none; +} +.tk-input { + flex: 1; +} +.tk-input .el-textarea__inner { + background-position: right bottom; + background-repeat: no-repeat; +} +.tk-turnstile-container { + position: absolute; + right: 0; + bottom: -75px; + z-index: 1; +} +.tk-turnstile { + display: flex; + flex-direction: column; +} +.tk-preview-container { + margin-left: 3rem; + margin-bottom: 1rem; + padding: 5px 15px; + border: 1px solid rgba(128, 128, 128, 0.31); + border-radius: 4px; + word-break: break-word; +} +.tk-fade-in { + animation: tkFadeIn 0.3s; +} +@keyframes tkFadeIn { + 0% { + opacity: 0; + } + to { + opacity: 1; + } +} + +.tk-action { + display: flex; + align-items: center; +} +.tk-action-link { + margin-left: 0.5rem; + color: #409eff; + text-decoration: none; + display: flex; + align-items: center; +} +.tk-action-link .tk-action-icon-solid { + display: none; +} +.tk-action-link.tk-liked .tk-action-icon, +.tk-action-link:hover .tk-action-icon { + display: none; +} +.tk-action-link.tk-liked .tk-action-icon-solid, +.tk-action-link:hover .tk-action-icon-solid { + display: block; +} +.tk-action-count { + margin-left: 0.25rem; + font-size: 0.75rem; + height: 1.5rem; + line-height: 1.5rem; +} +.tk-action-icon { + display: inline-block; + height: 1em; + width: 1em; + line-height: 0; + color: #409eff; +} + +.tk-main { + flex: 1; + width: 0; +} +.tk-row { + flex: 1; + display: flex; + flex-direction: row; + justify-content: space-between; +} +.tk-nick-link { + color: inherit; + text-decoration: none; +} +.tk-replies .tk-nick-link { + font-size: 0.9em; +} +.tk-nick-link:hover { + color: #409eff; +} +.tk-actions { + display: none; + margin-left: 1em; +} +.tk-comment:hover .tk-actions { + display: inline; +} +.tk-extras { + color: #999999; + font-size: 0.875em; + display: flex; + flex-wrap: wrap; +} +.tk-extra { + margin-top: 0.5rem; + margin-right: 0.75rem; + display: flex; + align-items: center; +} +.tk-icon.__comment { + height: 1em; + width: 1em; + line-height: 1; +} +.tk-extra-text { + line-height: 1; +} +.tk-tag { + display: inline-block; + padding: 0 0.5em; + font-size: 0.75em; + background-color: #f2f6fc; +} +.tk-tag-green { + background-color: rgba(103, 194, 58, 0.13); + border: 1px solid rgba(103, 194, 58, 0.5); + border-radius: 2px; + color: #67c23a; +} +.tk-tag-yellow { + background-color: rgba(230, 162, 60, 0.13); + border: 1px solid rgba(230, 162, 60, 0.5); + border-radius: 2px; + color: #e6a23c; +} +.tk-tag-blue { + background-color: rgba(64, 158, 255, 0.13); + border: 1px solid rgba(64, 158, 255, 0.5); + border-radius: 2px; + color: #409eff; +} +.tk-tag-red { + background-color: rgba(245, 108, 108, 0.13); + border: 1px solid rgba(245, 108, 108, 0.5); + border-radius: 2px; + color: #f56c6c; +} +.tk-comment { + margin-top: 1rem; + display: flex; + flex-direction: row; + word-break: break-all; +} +.tk-content { + margin-top: 0.5rem; + overflow: hidden; + max-height: 500px; + position: relative; +} +.tk-content-expand { + max-height: none; +} +.tk-replies .tk-content { + font-size: 0.9em; +} +.tk-comment .vemoji { + max-height: 2em; + vertical-align: middle; +} +.tk-replies { + max-height: 200px; + overflow: hidden; + position: relative; +} +.tk-replies-expand { + max-height: none; + overflow: unset; +} +.tk-submit { + margin-top: 1rem; +} +.tk-expand { + font-size: 0.75em; +} +.tk-lightbox { + display: block; + position: fixed; + background-color: rgba(0, 0, 0, 0.3); + top: 0; + left: 0; + right: 0; + bottom: 0; + z-index: 999; +} +.tk-lightbox-image { + min-width: 100px; + min-height: 30px; + width: auto; + height: auto; + max-width: 95%; + max-height: 95%; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + background: linear-gradient(90deg, #eeeeee 50%, #e3e3e3 0); + background-size: 40px 100%; +} + +.tk-comments-title { + font-size: 1.25rem; + font-weight: bold; + margin-bottom: 1rem; + display: flex; + align-items: baseline; + justify-content: space-between; +} +.tk-comments-count.__hidden { + visibility: hidden; +} +.tk-comments-container { + min-height: 10rem; + display: flex; + flex-direction: column; +} +.tk-comments-no { + flex: 1; + text-align: center; + display: flex; + align-items: center; + justify-content: center; +} +.tk-comments-error { + font-size: 0.75em; + color: #ff0000; +} +.tk-icon.__comments { + display: inline-flex; + align-items: center; + justify-content: center; + vertical-align: sub; + margin-left: 0.5em; + height: 0.75em; + width: 0.75em; + line-height: 0; + cursor: pointer; + color: #409eff; +} +.twikoo div.code-toolbar { + position: relative; + border-radius: 0.3em; +} +.twikoo div.code-toolbar > .toolbar { + position: absolute; + right: 4px; + top: 4px; + font-size: 0.8125rem; + font-weight: 500; + display: flex; +} +.twikoo div.code-toolbar > .toolbar > .toolbar-item { + margin-left: 0.3em; +} +.twikoo div.code-toolbar > .toolbar > .toolbar-item > a, +.twikoo div.code-toolbar > .toolbar > .toolbar-item > button, +.twikoo div.code-toolbar > .toolbar > .toolbar-item > span { + padding: 2px 4px; + border-radius: 0.3em; +} +.twikoo div.code-toolbar > .toolbar > .toolbar-item > button { + border: 1px solid rgba(128, 128, 128, 0.31); +} +.twikoo div.code-toolbar > .toolbar > .toolbar-item > button:hover { + cursor: pointer; +} + +.tk-footer { + width: 100%; + text-align: end; + font-size: 0.75em; + color: #999999; + margin-top: 1em; +} + +.tk-pagination, +.tk-pagination-pagers { + display: flex; +} +.tk-pagination { + width: 100%; + align-items: center; + justify-content: space-between; + flex-wrap: wrap; +} +.tk-pagination-options { + display: flex; + align-items: center; +} +.tk-pagination-pager { + width: 2em; + height: 2em; + display: flex; + align-items: center; + justify-content: center; + cursor: pointer; +} +.tk-pagination-pager.__current { + background-color: #409eff; + pointer-events: none; +} +.tk-pagination .el-input { + width: 50px; +} +.tk-pagination .el-input .el-input__inner { + padding: 0; + height: 28px; + text-align: center; + -moz-appearance: textfield; + appearance: textfield; +} +.tk-pagination .el-input .el-input__inner::-webkit-inner-spin-button, +.tk-pagination .el-input .el-input__inner::-webkit-outer-spin-button { + -webkit-appearance: none; + appearance: none; + margin: 0; +} + +.tk-admin-comment { + display: flex; + flex-direction: column; + align-items: center; +} +.tk-admin-comment a { + color: currentColor; + text-decoration: underline; +} +.tk-admin-warn { + margin-bottom: 1em; +} +.tk-admin-comment-filter { + width: 100%; + display: flex; + align-items: center; + justify-content: flex-start; +} +.tk-admin-comment-filter-keyword { + flex: 1; +} +.tk-admin-comment-filter-type { + height: 32px; + margin: 0 0.5em; + padding: 0 0.5em; + color: #ffffff; + background: none; + border: 1px solid rgba(144, 147, 153, 0.31); + border-radius: 4px; + position: relative; + -moz-appearance: none; + -webkit-appearance: none; +} +.tk-admin-comment-filter-type:focus { + border-color: #409eff; +} +.tk-admin-comment-filter-type option { + color: initial; +} +.tk-admin-comment-list { + margin-top: 1em; +} +.tk-admin-comment-list, +.tk-admin-comment-item { + width: 100%; + display: flex; + flex-direction: column; + justify-content: stretch; +} +.tk-admin-comment-meta { + display: flex; + align-items: center; + flex-wrap: wrap; + margin-bottom: 0.5em; +} +.tk-admin-comment .tk-avatar { + margin-right: 0.5em; +} +.tk-admin-comment .tk-content { + max-height: none; +} +.tk-admin-actions { + display: flex; + margin-bottom: 1em; + border-bottom: 1px solid rgba(255, 255, 255, 0.5); +} + +.tk-admin-config-groups { + overflow-y: auto; + padding-right: 0.5em; +} +.tk-admin-config-groups .tk-admin-config-group, +.tk-admin-config-groups .tk-admin-config-group-title { + background: transparent; +} +.tk-admin-config-group-title { + margin-top: 1em; + font-size: 1.25rem; + font-weight: bold; +} +.tk-admin-config-item { + display: grid; + align-items: center; + grid-template-columns: 30% 70%; + margin-top: 1em; +} +.tk-admin-config-title { + text-align: right; + margin-right: 1em; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} +.tk-admin-config-desc { + margin-top: 0.5em; + font-size: 0.75em; + overflow-wrap: break-word; +} +.tk-admin-config-actions { + display: flex; + align-items: center; + justify-content: center; + margin-top: 1em; +} +.tk-admin-config-message { + margin-top: 0.5em; + text-align: center; +} +.tk-admin-config-email-test-desc { + margin: 1em 0; +} + +.tk-admin-import { + display: flex; + flex-direction: column; +} +.tk-admin-import-label { + margin-top: 1em; + font-size: 1.25rem; + font-weight: bold; +} +.tk-admin-import select, +.tk-admin-import input, +.tk-admin-import .el-button, +.tk-admin-import .el-textarea { + margin-top: 1em; +} + +.tk-admin-container { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + overflow: hidden; + pointer-events: none; +} +.tk-admin { + position: absolute; + top: 0; + left: 100%; + width: 100%; + height: 100%; + overflow-y: auto; + pointer-events: all; + color: #ffffff; + background-color: rgba(0, 0, 0, 0.6); + backdrop-filter: blur(5px); + transition: all 0.5s ease; + visibility: hidden; +} +.tk-admin::-webkit-scrollbar { + width: 5px; + background-color: transparent; +} +.tk-admin::-webkit-scrollbar-track { + background-color: transparent; +} +.tk-admin::-webkit-scrollbar-thumb { + background-color: rgba(255, 255, 255, 0.31); +} +.tk-admin.__show { + left: 0; + visibility: visible; +} +.tk-admin-close { + position: sticky; + float: right; + display: block; + top: 0; + right: 0; + width: 1rem; + height: 1rem; + padding: 1rem; + box-sizing: content-box; + color: #ffffff; +} +.tk-login, +.tk-regist { + display: flex; + flex-direction: column; + align-items: center; + width: 100%; + padding: 0 2rem; +} +.tk-login-title { + color: #ffffff; + font-size: 1.25rem; + text-align: center; + margin-top: 10rem; +} +.tk-password, +.tk-login-msg { + color: #ffffff; + width: 80%; + text-align: center; + margin-top: 1rem; +} +.tk-password .el-input__inner { + min-width: 100px; +} +.tk-login-msg a { + color: #ffffff; + margin-left: 1em; + text-decoration: underline; +} +.tk-regist-button { + margin-top: 1rem; +} +.tk-panel { + color: #ffffff; + padding: 2rem; +} +.tk-panel-title { + font-size: 1.5rem; + display: flex; + align-items: flex-end; + justify-content: space-between; +} +.tk-panel-logout { + color: #ffffff; + font-size: 1rem; + text-decoration: underline; +} +.tk-panel .tk-tabs { + display: flex; + margin-bottom: 1em; + border-bottom: 2px solid #c0c4cc; +} +.tk-panel .tk-tab { + color: #c0c4cc; + cursor: pointer; + line-height: 2em; + margin-right: 2em; + margin-bottom: -2px; +} +.tk-panel .tk-tab.__active { + color: #ffffff; + border-bottom: 2px solid #ffffff; +} + +.twikoo { + position: relative; +} +.twikoo svg { + width: 100%; + height: 100%; + fill: currentColor; +} + +/* 全局 CSS */ +.tk-expand { + width: 100%; + cursor: pointer; + padding: 0.75em; + text-align: center; + transition: all 0.5s; +} +.tk-expand:hover { + background-color: rgba(0, 0, 0, 0.13); +} +.tk-expand:active { + background-color: rgba(0, 0, 0, 0.19); +} +.tk-content img { + max-width: 300px; + max-height: 300px; + vertical-align: middle; +} +.tk-owo-emotion, +.twikoo .OwO-item img { + width: 3em; + height: auto; +} + +/* element-ui overwrite */ +.twikoo .el-input__inner, +.twikoo .el-textarea__inner { + color: currentColor; + background-color: transparent; + border-color: rgba(144, 147, 153, 0.31); +} +.twikoo .el-input__inner:hover, +.twikoo .el-textarea__inner:hover { + border-color: rgba(144, 147, 153, 0.5); +} +.twikoo .el-input__inner:focus, +.twikoo .el-textarea__inner:focus { + border-color: #409eff; +} +.twikoo .el-input-group__append, +.twikoo .el-input-group__prepend { + color: currentColor; + background-clip: padding-box; + background-color: rgba(144, 147, 153, 0.13); + border-color: rgba(144, 147, 153, 0.31); +} +.twikoo .el-button:not(.el-button--primary):not(.el-button--text) { + color: currentColor; + background-color: rgba(144, 147, 153, 0.063); + border-color: rgba(144, 147, 153, 0.31); +} +.twikoo .el-button:not(.el-button--primary):not(.el-button--text):active, +.twikoo .el-button:not(.el-button--primary):not(.el-button--text):focus, +.twikoo .el-button:not(.el-button--primary):not(.el-button--text):hover { + color: #409eff; + background-color: rgba(64, 158, 255, 0.063); + border-color: rgba(64, 158, 255, 0.5); +} +.twikoo .el-button--primary.is-disabled, +.twikoo .el-button--primary.is-disabled:active, +.twikoo .el-button--primary.is-disabled:focus, +.twikoo .el-button--primary.is-disabled:hover { + color: rgba(255, 255, 255, 0.63); + background-color: rgba(64, 158, 255, 0.5); + border-color: transparent; +} +.twikoo .el-loading-mask { + background-color: transparent; + backdrop-filter: opacity(20%); +} +.twikoo .el-textarea .el-input__count { + color: currentColor; + background: transparent; +} +.tk-admin-warn { + padding: 1rem 1.5rem; + background-color: #fff7d0; + border-left: 0.5rem solid #e7c000; + color: #6b5900; + align-self: stretch; +} + +.el-button { + display: inline-block; + line-height: 1; + white-space: nowrap; + cursor: pointer; + background: #fff; + border: 1px solid #dcdfe6; + color: #606266; + -webkit-appearance: none; + text-align: center; + -webkit-box-sizing: border-box; + box-sizing: border-box; + outline: 0; + margin: 0; + -webkit-transition: 0.1s; + transition: 0.1s; + font-weight: 500; + -moz-user-select: none; + -webkit-user-select: none; + -ms-user-select: none; + padding: 12px 20px; + font-size: 14px; + border-radius: 4px; +} +.el-button + .el-button { + margin-left: 10px; +} +.el-button:focus, +.el-button:hover { + color: #409eff; + border-color: #c6e2ff; + background-color: #ecf5ff; +} +.el-button:active { + color: #3a8ee6; + border-color: #3a8ee6; + outline: 0; +} +.el-button::-moz-focus-inner { + border: 0; +} +.el-button [class*="el-icon-"] + span { + margin-left: 5px; +} +.el-button.is-plain:focus, +.el-button.is-plain:hover { + background: #fff; + border-color: #409eff; + color: #409eff; +} +.el-button.is-active, +.el-button.is-plain:active { + color: #3a8ee6; + border-color: #3a8ee6; +} +.el-button.is-plain:active { + background: #fff; + outline: 0; +} +.el-button.is-disabled, +.el-button.is-disabled:focus, +.el-button.is-disabled:hover { + color: #c0c4cc; + cursor: not-allowed; + background-image: none; + background-color: #fff; + border-color: #ebeef5; +} +.el-button.is-disabled.el-button--text { + background-color: transparent; +} +.el-button.is-disabled.is-plain, +.el-button.is-disabled.is-plain:focus, +.el-button.is-disabled.is-plain:hover { + background-color: #fff; + border-color: #ebeef5; + color: #c0c4cc; +} +.el-button.is-loading { + position: relative; + pointer-events: none; +} +.el-button.is-loading:before { + pointer-events: none; + content: ""; + position: absolute; + left: -1px; + top: -1px; + right: -1px; + bottom: -1px; + border-radius: inherit; + background-color: rgba(255, 255, 255, 0.35); +} +.el-button.is-round { + border-radius: 20px; + padding: 12px 23px; +} +.el-button.is-circle { + border-radius: 50%; + padding: 12px; +} +.el-button--primary { + color: #fff; + background-color: #409eff; + border-color: #409eff; +} +.el-button--primary:focus, +.el-button--primary:hover { + background: #66b1ff; + border-color: #66b1ff; + color: #fff; +} +.el-button--primary:active { + background: #3a8ee6; + border-color: #3a8ee6; + color: #fff; + outline: 0; +} +.el-button--primary.is-active { + background: #3a8ee6; + border-color: #3a8ee6; + color: #fff; +} +.el-button--primary.is-disabled, +.el-button--primary.is-disabled:active, +.el-button--primary.is-disabled:focus, +.el-button--primary.is-disabled:hover { + color: #fff; + background-color: #a0cfff; + border-color: #a0cfff; +} +.el-button--primary.is-plain { + color: #409eff; + background: #ecf5ff; + border-color: #b3d8ff; +} +.el-button--primary.is-plain:focus, +.el-button--primary.is-plain:hover { + background: #409eff; + border-color: #409eff; + color: #fff; +} +.el-button--primary.is-plain:active { + background: #3a8ee6; + border-color: #3a8ee6; + color: #fff; + outline: 0; +} +.el-button--primary.is-plain.is-disabled, +.el-button--primary.is-plain.is-disabled:active, +.el-button--primary.is-plain.is-disabled:focus, +.el-button--primary.is-plain.is-disabled:hover { + color: #8cc5ff; + background-color: #ecf5ff; + border-color: #d9ecff; +} +.el-button--success { + color: #fff; + background-color: #67c23a; + border-color: #67c23a; +} +.el-button--success:focus, +.el-button--success:hover { + background: #85ce61; + border-color: #85ce61; + color: #fff; +} +.el-button--success.is-active, +.el-button--success:active { + background: #5daf34; + border-color: #5daf34; + color: #fff; +} +.el-button--success:active { + outline: 0; +} +.el-button--success.is-disabled, +.el-button--success.is-disabled:active, +.el-button--success.is-disabled:focus, +.el-button--success.is-disabled:hover { + color: #fff; + background-color: #b3e19d; + border-color: #b3e19d; +} +.el-button--success.is-plain { + color: #67c23a; + background: #f0f9eb; + border-color: #c2e7b0; +} +.el-button--success.is-plain:focus, +.el-button--success.is-plain:hover { + background: #67c23a; + border-color: #67c23a; + color: #fff; +} +.el-button--success.is-plain:active { + background: #5daf34; + border-color: #5daf34; + color: #fff; + outline: 0; +} +.el-button--success.is-plain.is-disabled, +.el-button--success.is-plain.is-disabled:active, +.el-button--success.is-plain.is-disabled:focus, +.el-button--success.is-plain.is-disabled:hover { + color: #a4da89; + background-color: #f0f9eb; + border-color: #e1f3d8; +} +.el-button--warning { + color: #fff; + background-color: #e6a23c; + border-color: #e6a23c; +} +.el-button--warning:focus, +.el-button--warning:hover { + background: #ebb563; + border-color: #ebb563; + color: #fff; +} +.el-button--warning.is-active, +.el-button--warning:active { + background: #cf9236; + border-color: #cf9236; + color: #fff; +} +.el-button--warning:active { + outline: 0; +} +.el-button--warning.is-disabled, +.el-button--warning.is-disabled:active, +.el-button--warning.is-disabled:focus, +.el-button--warning.is-disabled:hover { + color: #fff; + background-color: #f3d19e; + border-color: #f3d19e; +} +.el-button--warning.is-plain { + color: #e6a23c; + background: #fdf6ec; + border-color: #f5dab1; +} +.el-button--warning.is-plain:focus, +.el-button--warning.is-plain:hover { + background: #e6a23c; + border-color: #e6a23c; + color: #fff; +} +.el-button--warning.is-plain:active { + background: #cf9236; + border-color: #cf9236; + color: #fff; + outline: 0; +} +.el-button--warning.is-plain.is-disabled, +.el-button--warning.is-plain.is-disabled:active, +.el-button--warning.is-plain.is-disabled:focus, +.el-button--warning.is-plain.is-disabled:hover { + color: #f0c78a; + background-color: #fdf6ec; + border-color: #faecd8; +} +.el-button--danger { + color: #fff; + background-color: #f56c6c; + border-color: #f56c6c; +} +.el-button--danger:focus, +.el-button--danger:hover { + background: #f78989; + border-color: #f78989; + color: #fff; +} +.el-button--danger.is-active, +.el-button--danger:active { + background: #dd6161; + border-color: #dd6161; + color: #fff; +} +.el-button--danger:active { + outline: 0; +} +.el-button--danger.is-disabled, +.el-button--danger.is-disabled:active, +.el-button--danger.is-disabled:focus, +.el-button--danger.is-disabled:hover { + color: #fff; + background-color: #fab6b6; + border-color: #fab6b6; +} +.el-button--danger.is-plain { + color: #f56c6c; + background: #fef0f0; + border-color: #fbc4c4; +} +.el-button--danger.is-plain:focus, +.el-button--danger.is-plain:hover { + background: #f56c6c; + border-color: #f56c6c; + color: #fff; +} +.el-button--danger.is-plain:active { + background: #dd6161; + border-color: #dd6161; + color: #fff; + outline: 0; +} +.el-button--danger.is-plain.is-disabled, +.el-button--danger.is-plain.is-disabled:active, +.el-button--danger.is-plain.is-disabled:focus, +.el-button--danger.is-plain.is-disabled:hover { + color: #f9a7a7; + background-color: #fef0f0; + border-color: #fde2e2; +} +.el-button--info { + color: #fff; + background-color: #909399; + border-color: #909399; +} +.el-button--info:focus, +.el-button--info:hover { + background: #a6a9ad; + border-color: #a6a9ad; + color: #fff; +} +.el-button--info.is-active, +.el-button--info:active { + background: #82848a; + border-color: #82848a; + color: #fff; +} +.el-button--info:active { + outline: 0; +} +.el-button--info.is-disabled, +.el-button--info.is-disabled:active, +.el-button--info.is-disabled:focus, +.el-button--info.is-disabled:hover { + color: #fff; + background-color: #c8c9cc; + border-color: #c8c9cc; +} +.el-button--info.is-plain { + color: #909399; + background: #f4f4f5; + border-color: #d3d4d6; +} +.el-button--info.is-plain:focus, +.el-button--info.is-plain:hover { + background: #909399; + border-color: #909399; + color: #fff; +} +.el-button--info.is-plain:active { + background: #82848a; + border-color: #82848a; + color: #fff; + outline: 0; +} +.el-button--info.is-plain.is-disabled, +.el-button--info.is-plain.is-disabled:active, +.el-button--info.is-plain.is-disabled:focus, +.el-button--info.is-plain.is-disabled:hover { + color: #bcbec2; + background-color: #f4f4f5; + border-color: #e9e9eb; +} +.el-button--medium { + padding: 10px 20px; + font-size: 14px; + border-radius: 4px; +} +.el-button--mini, +.el-button--small { + font-size: 12px; + border-radius: 3px; +} +.el-button--medium.is-round { + padding: 10px 20px; +} +.el-button--medium.is-circle { + padding: 10px; +} +.el-button--small, +.el-button--small.is-round { + padding: 9px 15px; +} +.el-button--small.is-circle { + padding: 9px; +} +.el-button--mini, +.el-button--mini.is-round { + padding: 7px 15px; +} +.el-button--mini.is-circle { + padding: 7px; +} +.el-button--text { + border-color: transparent; + color: #409eff; + background: 0 0; + padding-left: 0; + padding-right: 0; +} +.el-button--text:focus, +.el-button--text:hover { + color: #66b1ff; + border-color: transparent; + background-color: transparent; +} +.el-button--text:active { + color: #3a8ee6; + border-color: transparent; + background-color: transparent; +} +.el-button--text.is-disabled, +.el-button--text.is-disabled:focus, +.el-button--text.is-disabled:hover { + border-color: transparent; +} +.el-button-group .el-button--danger:last-child, +.el-button-group .el-button--danger:not(:first-child):not(:last-child), +.el-button-group .el-button--info:last-child, +.el-button-group .el-button--info:not(:first-child):not(:last-child), +.el-button-group .el-button--primary:last-child, +.el-button-group .el-button--primary:not(:first-child):not(:last-child), +.el-button-group .el-button--success:last-child, +.el-button-group .el-button--success:not(:first-child):not(:last-child), +.el-button-group .el-button--warning:last-child, +.el-button-group .el-button--warning:not(:first-child):not(:last-child), +.el-button-group > .el-dropdown > .el-button { + border-left-color: rgba(255, 255, 255, 0.5); +} +.el-button-group .el-button--danger:first-child, +.el-button-group .el-button--danger:not(:first-child):not(:last-child), +.el-button-group .el-button--info:first-child, +.el-button-group .el-button--info:not(:first-child):not(:last-child), +.el-button-group .el-button--primary:first-child, +.el-button-group .el-button--primary:not(:first-child):not(:last-child), +.el-button-group .el-button--success:first-child, +.el-button-group .el-button--success:not(:first-child):not(:last-child), +.el-button-group .el-button--warning:first-child, +.el-button-group .el-button--warning:not(:first-child):not(:last-child) { + border-right-color: rgba(255, 255, 255, 0.5); +} +.el-button-group { + display: inline-block; + vertical-align: middle; +} +.el-button-group::after, +.el-button-group::before { + display: table; + content: ""; +} +.el-button-group::after { + clear: both; +} +.el-button-group > .el-button { + float: left; + position: relative; +} +.el-button-group > .el-button + .el-button { + margin-left: 0; +} +.el-button-group > .el-button.is-disabled { + z-index: 1; +} +.el-button-group > .el-button:first-child { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} +.el-button-group > .el-button:last-child { + border-top-left-radius: 0; + border-bottom-left-radius: 0; +} +.el-button-group > .el-button:first-child:last-child { + border-radius: 4px; +} +.el-button-group > .el-button:first-child:last-child.is-round { + border-radius: 20px; +} +.el-button-group > .el-button:first-child:last-child.is-circle { + border-radius: 50%; +} +.el-button-group > .el-button:not(:first-child):not(:last-child) { + border-radius: 0; +} +.el-button-group > .el-button:not(:last-child) { + margin-right: -1px; +} +.el-button-group > .el-button.is-active, +.el-button-group > .el-button:not(.is-disabled):active, +.el-button-group > .el-button:not(.is-disabled):focus, +.el-button-group > .el-button:not(.is-disabled):hover { + z-index: 1; +} +.el-button-group > .el-dropdown > .el-button { + border-top-left-radius: 0; + border-bottom-left-radius: 0; +} +.el-input__inner, +.el-textarea__inner { + background-image: none; + -webkit-box-sizing: border-box; + -webkit-transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1); +} +.el-textarea { + position: relative; + display: inline-block; + width: 100%; + vertical-align: bottom; + font-size: 14px; +} +.el-textarea__inner { + display: block; + resize: vertical; + padding: 5px 15px; + line-height: 1.5; + box-sizing: border-box; + width: 100%; + font-size: inherit; + color: #606266; + background-color: #fff; + border: 1px solid #dcdfe6; + border-radius: 4px; + transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1); +} +.el-textarea__inner::-webkit-input-placeholder { + color: #c0c4cc; +} +.el-textarea__inner:-ms-input-placeholder { + color: #c0c4cc; +} +.el-textarea__inner::-ms-input-placeholder { + color: #c0c4cc; +} +.el-textarea__inner::placeholder { + color: #c0c4cc; +} +.el-textarea__inner:hover { + border-color: #c0c4cc; +} +.el-textarea__inner:focus { + outline: 0; + border-color: #409eff; +} +.el-textarea .el-input__count { + color: #909399; + background: #fff; + position: absolute; + font-size: 12px; + bottom: 5px; + right: 10px; +} +.el-textarea.is-disabled .el-textarea__inner { + background-color: #f5f7fa; + border-color: #e4e7ed; + color: #c0c4cc; + cursor: not-allowed; +} +.el-textarea.is-disabled .el-textarea__inner::-webkit-input-placeholder { + color: #c0c4cc; +} +.el-textarea.is-disabled .el-textarea__inner:-ms-input-placeholder { + color: #c0c4cc; +} +.el-textarea.is-disabled .el-textarea__inner::-ms-input-placeholder { + color: #c0c4cc; +} +.el-textarea.is-disabled .el-textarea__inner::placeholder { + color: #c0c4cc; +} +.el-textarea.is-exceed .el-textarea__inner { + border-color: #f56c6c; +} +.el-textarea.is-exceed .el-input__count { + color: #f56c6c; +} +.el-input { + position: relative; + font-size: 14px; + display: inline-block; + width: 100%; +} +.el-input::-webkit-scrollbar { + z-index: 11; + width: 6px; +} +.el-input::-webkit-scrollbar:horizontal { + height: 6px; +} +.el-input::-webkit-scrollbar-thumb { + border-radius: 5px; + width: 6px; + background: #b4bccc; +} +.el-input::-webkit-scrollbar-corner { + background: #fff; +} +.el-input::-webkit-scrollbar-track { + background: #fff; +} +.el-input::-webkit-scrollbar-track-piece { + background: #fff; + width: 6px; +} +.el-input .el-input__clear { + color: #c0c4cc; + font-size: 14px; + cursor: pointer; + -webkit-transition: color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1); + transition: color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1); +} +.el-input .el-input__clear:hover { + color: #909399; +} +.el-input .el-input__count { + height: 100%; + display: -webkit-inline-box; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + color: #909399; + font-size: 12px; +} +.el-input-group__append .el-button, +.el-input-group__append .el-input, +.el-input-group__prepend .el-button, +.el-input-group__prepend .el-input, +.el-input__inner { + font-size: inherit; +} +.el-input .el-input__count .el-input__count-inner { + background: #fff; + line-height: initial; + display: inline-block; + padding: 0 5px; +} +.el-input__inner { + -webkit-appearance: none; + background-color: #fff; + border-radius: 4px; + border: 1px solid #dcdfe6; + box-sizing: border-box; + color: #606266; + display: inline-block; + height: 40px; + line-height: 40px; + outline: 0; + padding: 0 15px; + transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1); + width: 100%; +} +.el-input__prefix, +.el-input__suffix { + position: absolute; + top: 0; + -webkit-transition: all 0.3s; + text-align: center; + height: 100%; + color: #c0c4cc; +} +.el-input__inner::-ms-reveal { + display: none; +} +.el-input__inner::-webkit-input-placeholder { + color: #c0c4cc; +} +.el-input__inner:-ms-input-placeholder { + color: #c0c4cc; +} +.el-input__inner::-ms-input-placeholder { + color: #c0c4cc; +} +.el-input__inner::placeholder { + color: #c0c4cc; +} +.el-input__inner:hover { + border-color: #c0c4cc; +} +.el-input.is-active .el-input__inner, +.el-input__inner:focus { + border-color: #409eff; + outline: 0; +} +.el-input__suffix { + right: 5px; + transition: all 0.3s; + pointer-events: none; +} +.el-input__suffix-inner { + pointer-events: all; +} +.el-input__prefix { + left: 5px; + transition: all 0.3s; +} +.el-input__icon { + height: 100%; + width: 25px; + text-align: center; + -webkit-transition: all 0.3s; + transition: all 0.3s; + line-height: 40px; +} +.el-input__icon:after { + content: ""; + height: 100%; + width: 0; + display: inline-block; + vertical-align: middle; +} +.el-input__validateIcon { + pointer-events: none; +} +.el-input.is-disabled .el-input__inner { + background-color: #f5f7fa; + border-color: #e4e7ed; + color: #c0c4cc; + cursor: not-allowed; +} +.el-input.is-disabled .el-input__inner::-webkit-input-placeholder { + color: #c0c4cc; +} +.el-input.is-disabled .el-input__inner:-ms-input-placeholder { + color: #c0c4cc; +} +.el-input.is-disabled .el-input__inner::-ms-input-placeholder { + color: #c0c4cc; +} +.el-input.is-disabled .el-input__inner::placeholder { + color: #c0c4cc; +} +.el-input.is-disabled .el-input__icon { + cursor: not-allowed; +} +.el-input.is-exceed .el-input__inner { + border-color: #f56c6c; +} +.el-input.is-exceed .el-input__suffix .el-input__count { + color: #f56c6c; +} +.el-input--suffix .el-input__inner { + padding-right: 30px; +} +.el-input--prefix .el-input__inner { + padding-left: 30px; +} +.el-input--medium { + font-size: 14px; +} +.el-input--medium .el-input__inner { + height: 36px; + line-height: 36px; +} +.el-input--medium .el-input__icon { + line-height: 36px; +} +.el-input--small { + font-size: 13px; +} +.el-input--small .el-input__inner { + height: 32px; + line-height: 32px; +} +.el-input--small .el-input__icon { + line-height: 32px; +} +.el-input--mini { + font-size: 12px; +} +.el-input--mini .el-input__inner { + height: 28px; + line-height: 28px; +} +.el-input--mini .el-input__icon { + line-height: 28px; +} +.el-input-group { + line-height: normal; + display: inline-table; + width: 100%; + border-collapse: separate; + border-spacing: 0; +} +.el-input-group > .el-input__inner { + vertical-align: middle; + display: table-cell; +} +.el-input-group__append, +.el-input-group__prepend { + background-color: #f5f7fa; + color: #909399; + vertical-align: middle; + display: table-cell; + position: relative; + border: 1px solid #dcdfe6; + border-radius: 4px; + padding: 0 20px; + width: 1px; + white-space: nowrap; +} +.el-input-group--prepend .el-input__inner, +.el-input-group__append { + border-top-left-radius: 0; + border-bottom-left-radius: 0; +} +.el-input-group--append .el-input__inner, +.el-input-group__prepend { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} +.el-input-group__append:focus, +.el-input-group__prepend:focus { + outline: 0; +} +.el-input-group__append .el-button, +.el-input-group__append .el-select, +.el-input-group__prepend .el-button, +.el-input-group__prepend .el-select { + display: inline-block; + margin: -10px -20px; +} +.el-input-group__append button.el-button, +.el-input-group__append div.el-select .el-input__inner, +.el-input-group__append div.el-select:hover .el-input__inner, +.el-input-group__prepend button.el-button, +.el-input-group__prepend div.el-select .el-input__inner, +.el-input-group__prepend div.el-select:hover .el-input__inner { + border-color: transparent; + background-color: transparent; + color: inherit; + border-top: 0; + border-bottom: 0; +} +.el-input-group__prepend { + border-right: 0; +} +.el-input-group__append { + border-left: 0; +} +.el-input-group--append .el-select .el-input.is-focus .el-input__inner, +.el-input-group--prepend .el-select .el-input.is-focus .el-input__inner { + border-color: transparent; +} +.el-input__inner::-ms-clear { + display: none; + width: 0; + height: 0; +} +.el-loading-parent--relative { + position: relative !important; +} +.el-loading-parent--hidden { + overflow: hidden !important; +} +.el-loading-mask { + position: absolute; + z-index: 2000; + background-color: rgba(255, 255, 255, 0.9); + margin: 0; + top: 0; + right: 0; + bottom: 0; + left: 0; + -webkit-transition: opacity 0.3s; + transition: opacity 0.3s; +} +.el-loading-mask.is-fullscreen { + position: fixed; +} +.el-loading-mask.is-fullscreen .el-loading-spinner { + margin-top: -25px; +} +.el-loading-mask.is-fullscreen .el-loading-spinner .circular { + height: 50px; + width: 50px; +} +.el-loading-spinner { + top: 50%; + margin-top: -21px; + width: 100%; + text-align: center; + position: absolute; +} +.el-loading-spinner .el-loading-text { + color: #409eff; + margin: 3px 0; + font-size: 14px; +} +.el-loading-spinner .circular { + height: 42px; + width: 42px; + -webkit-animation: loading-rotate 2s linear infinite; + animation: loading-rotate 2s linear infinite; +} +.el-loading-spinner .path { + -webkit-animation: loading-dash 1.5s ease-in-out infinite; + animation: loading-dash 1.5s ease-in-out infinite; + stroke-dasharray: 90, 150; + stroke-dashoffset: 0; + stroke-width: 2; + stroke: #409eff; + stroke-linecap: round; +} +.el-loading-spinner i { + color: #409eff; +} +.el-loading-fade-enter, +.el-loading-fade-leave-active { + opacity: 0; +} +@-webkit-keyframes loading-rotate { + 100% { + -webkit-transform: rotate(360deg); + transform: rotate(360deg); + } +} +@keyframes loading-rotate { + 100% { + -webkit-transform: rotate(360deg); + transform: rotate(360deg); + } +} +@-webkit-keyframes loading-dash { + 0% { + stroke-dasharray: 1, 200; + stroke-dashoffset: 0; + } + 50% { + stroke-dasharray: 90, 150; + stroke-dashoffset: -40px; + } + 100% { + stroke-dasharray: 90, 150; + stroke-dashoffset: -120px; + } +} +@keyframes loading-dash { + 0% { + stroke-dasharray: 1, 200; + stroke-dashoffset: 0; + } + 50% { + stroke-dasharray: 90, 150; + stroke-dashoffset: -40px; + } + 100% { + stroke-dasharray: 90, 150; + stroke-dashoffset: -120px; + } +} +/*! + * OwO v1.0.2 + * Source: https://github.com/DIYgod/OwO/blob/master/dist/OwO.min.css + * Author: DIYgod + * Modified by: iMaeGoo + * Released under the MIT License. + */ + +.OwO { + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} + +.OwO.OwO-open .OwO-body { + display: block; +} + +.OwO .OwO-logo { + width: 1.125em; + display: flex; +} + +.OwO .OwO-body { + display: none; + position: absolute; + left: 0; + right: 0; + max-width: 500px; + color: #4a4a4a; + background-color: #ffffff; + border: 1px solid rgba(144, 147, 153, 0.31); + top: 2em; + border-radius: 0 4px 4px; + z-index: 1000; +} + +.night .OwO .OwO-body, +.darkmode .OwO .OwO-body, +.DarkMode .OwO .OwO-body, +[data-theme="dark"] .OwO .OwO-body, +[data-user-color-scheme="dark"] .OwO .OwO-body { + color: #ffffff; + background-color: #4a4a4a; +} + +.OwO .OwO-body .OwO-items { + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + display: none; + padding: 10px; + padding-right: 0; + margin: 0; + overflow: auto; + font-size: 0; +} + +.OwO .OwO-body .OwO-items .OwO-item { + list-style-type: none; + padding: 5px 10px; + border-radius: 5px; + display: inline-block; + font-size: 12px; + line-height: 14px; + cursor: pointer; + -webkit-transition: 0.3s; + transition: 0.3s; + text-align: center; +} + +.OwO .OwO-body .OwO-items .OwO-item:hover { + background-color: rgba(144, 147, 153, 0.13); + box-shadow: + 0 2px 2px 0 rgba(0, 0, 0, 0.14), + 0 3px 1px -2px rgba(0, 0, 0, 0.2), + 0 1px 5px 0 rgba(0, 0, 0, 0.12); +} + +.OwO .OwO-body .OwO-items-emoji .OwO-item { + font-size: 20px; + line-height: 19px; +} + +.OwO .OwO-body .OwO-items-image .OwO-item { + width: 14%; + box-sizing: border-box; +} + +@media screen and (max-width: 600px) { + #twikoo .OwO-items > .OwO-item { + width: 16%; + } +} + +@media screen and (max-width: 460px) { + #twikoo .OwO-items > .OwO-item { + width: 20%; + } +} + +@media screen and (max-width: 400px) { + #twikoo .OwO-items > .OwO-item { + width: 25%; + } +} + +@media screen and (max-width: 330px) { + #twikoo .OwO-items > .OwO-item { + width: 33%; + } +} + +.OwO .OwO-body .OwO-items-image .OwO-item img { + max-width: 100%; +} + +.OwO .OwO-body .OwO-items-show { + display: block; +} + +.OwO .OwO-body .OwO-bar { + width: 100%; + border-top: 1px solid rgba(144, 147, 153, 0.31); + border-radius: 0 0 4px 4px; +} + +.OwO .OwO-body .OwO-bar .OwO-packages { + margin: 0; + padding: 0; + font-size: 0; +} + +.OwO .OwO-body .OwO-bar .OwO-packages li { + list-style-type: none; + display: inline-block; + line-height: 30px; + font-size: 14px; + padding: 0 10px; + cursor: pointer; + margin-right: 3px; +} + +.OwO .OwO-body .OwO-bar .OwO-packages li:nth-child(1) { + border-radius: 0 0 0 3px; +} + +.OwO .OwO-body .OwO-bar .OwO-packages li:hover { + background-color: rgba(144, 147, 153, 0.13); +} + +.OwO .OwO-body .OwO-bar .OwO-packages .OwO-package-active { + background-color: rgba(144, 147, 153, 0.13); + -webkit-transition: 0.3s; + transition: 0.3s; +} + +/* --------- */ +/* comments container */ +.tk-comments-container { + margin-top: 50px !important; +} + +/* avatar*/ +.tk-avatar { + background-color: transparent !important; +} + +.tk-avatar-img { + border-radius: 50% !important; +} + +/* comment margin */ +.tk-comment { + margin-top: 36px !important; +} + +/* comment content */ +.tk-main .tk-content { + border-radius: 10px !important; + padding: 10px !important; + background-color: rgba(144, 147, 153, 0.1) !important; +} + +/* PC 端宽度调整 */ +@media screen and (min-width: 768px) { + .tk-main .tk-content { + max-width: 60% !important; + } +} + +/* comment content image */ + +.tk-main .tk-content > span > p { + display: flex; + flex-direction: column; + justify-content: center; + gap: 10px; +} + +.tk-main .tk-content { + display: flex; + flex-direction: column; + justify-content: center; + gap: 10px; +} + +.tk-main .tk-content > span > p > img { + border-radius: 20px !important; +} + +.tk-extras { + margin-top: 5px !important; +} diff --git a/src/types/twikoo.d.ts b/src/types/twikoo.d.ts new file mode 100644 index 0000000..607c440 --- /dev/null +++ b/src/types/twikoo.d.ts @@ -0,0 +1 @@ +declare module "twikoo"