summaryrefslogtreecommitdiffstats
path: root/assets
diff options
context:
space:
mode:
Diffstat (limited to 'assets')
-rw-r--r--assets/js/fuji.js99
-rw-r--r--assets/scss/_fuji-style/_content.scss42
-rw-r--r--assets/scss/_fuji-style/_sidebar.scss4
-rw-r--r--assets/scss/_fuji-theme/_dark-diff.scss25
-rw-r--r--assets/scss/_fuji-theme/_style.scss43
5 files changed, 176 insertions, 37 deletions
diff --git a/assets/js/fuji.js b/assets/js/fuji.js
index 4bc9d56..14d63bc 100644
--- a/assets/js/fuji.js
+++ b/assets/js/fuji.js
@@ -10,23 +10,6 @@ function getNowTheme() {
}
}
-// update medium-zoom theme
-function updateMeidumTheme(mediumInst) {
- let targetTheme = getNowTheme();
- if (mediumInst) {
- mediumInst.detach();
- if (targetTheme === 'dark') {
- mediumInst = mediumZoom('.img-zoomable', {
- background: '#2f3136',
- });
- } else {
- mediumInst = mediumZoom('.img-zoomable', {
- background: '#fffffd',
- });
- }
- }
-}
-
// update utterances theme
function updateUtterancesTheme(utterancesFrame) {
let targetTheme = getNowTheme();
@@ -61,18 +44,6 @@ document.querySelector('.btn .btn-scroll-top').addEventListener('click', () => {
document.documentElement.scrollTop = 0;
});
-// init medium-zoom
-var mediumInst; // medium-zoom instance
-if (getNowTheme() === 'dark') {
- mediumInst = mediumZoom('.img-zoomable', {
- background: '#2f3136',
- });
-} else {
- mediumInst = mediumZoom('.img-zoomable', {
- background: '#fffffd',
- });
-}
-
// theme switch button
document.querySelector('.btn .btn-toggle-mode').addEventListener('click', () => {
let nowTheme = getNowTheme();
@@ -95,8 +66,6 @@ document.querySelector('.btn .btn-toggle-mode').addEventListener('click', () =>
localStorage.setItem('fuji_data-theme', systemTheme === 'light' ? 'auto' : 'light');
}
- // update medium background
- updateMeidumTheme(mediumInst);
// switch comment area theme
// if this page has comment area
let commentArea = document.querySelector('.post-comment');
@@ -114,3 +83,71 @@ document.querySelector('.btn .btn-toggle-mode').addEventListener('click', () =>
}
}
});
+
+// search by fuse.js
+function searchAll(key, index, counter) {
+ let fuse = new Fuse(index, {
+ shouldSort: true,
+ distance: 10000,
+ keys: [
+ {
+ name: 'title',
+ weight: 2.0,
+ },
+ {
+ name: 'tags',
+ weight: 1.5,
+ },
+ {
+ name: 'content',
+ weight: 1.0,
+ },
+ ],
+ });
+ let result = fuse.search(key);
+ // console.log(result);
+ if (result.length > 0) {
+ document.getElementById('search-result').innerHTML = template('search-result-template', result);
+ return [new Date().getTime() - counter, result.length];
+ } else {
+ return 'notFound';
+ }
+}
+
+let urlParams = new URLSearchParams(window.location.search); // get params from URL
+if (urlParams.has('s')) {
+ let counter = new Date().getTime();
+ let infoElements = document.querySelectorAll('.search-result-info');
+ let key = urlParams.get('s'); // get search keyword, divided by space
+ document.querySelector('.search-input input').setAttribute('value', key);
+ // get search index from json
+ let xhr = new XMLHttpRequest();
+ xhr.open('GET', '/index.json', true);
+ xhr.responseType = 'json';
+ xhr.onerror = () => {
+ infoElements[2].removeAttribute('style');
+ };
+ xhr.ontimeout = () => {
+ infoElements[2].removeAttribute('style');
+ };
+ xhr.onreadystatechange = () => {
+ if (xhr.readyState === 4) {
+ if (xhr.status === 200) {
+ // use index json to search
+ // console.log(xhr.response);
+ counter = searchAll(key, xhr.response, counter);
+ // console.log(counter);
+ if (counter === 'notFound') {
+ infoElements[1].removeAttribute('style');
+ } else {
+ infoElements[0].innerHTML = infoElements[0].innerHTML.replace('[TIME]', counter[0]);
+ infoElements[0].innerHTML = infoElements[0].innerHTML.replace('[NUM]', counter[1]);
+ infoElements[0].removeAttribute('style');
+ }
+ } else {
+ infoElements[2].removeAttribute('style');
+ }
+ }
+ };
+ xhr.send(null);
+}
diff --git a/assets/scss/_fuji-style/_content.scss b/assets/scss/_fuji-style/_content.scss
index 03add33..2cfd184 100644
--- a/assets/scss/_fuji-style/_content.scss
+++ b/assets/scss/_fuji-style/_content.scss
@@ -56,6 +56,11 @@
margin: 0.5rem 0.1rem 0 0.1rem; // little space
flex-wrap: wrap;
+ span {
+ display: flex;
+ align-items: center;
+ }
+
span:not(:last-child) {
padding-right: 1.5rem;
}
@@ -155,3 +160,40 @@ article {
#disqus_thread {
padding: 1.25rem 0;
}
+
+// search page part
+
+#search-result .post:first-child {
+ padding: 1.5rem 0;
+}
+
+.search-result-info {
+ padding: 1rem 0.1rem;
+}
+
+.search-input {
+ display: flex;
+ height: 2.5rem;
+ align-items: center;
+ padding-left: 0.5rem;
+ width: 100%;
+
+ input {
+ width: 100%;
+ min-width: 0;
+ flex: 1 1 auto;
+ height: 2rem;
+ }
+
+ button {
+ flex: 0 1 auto;
+ padding: 0 0.5rem;
+ word-break: keep-all;
+ height: 2.5rem;
+
+ ion-icon {
+ height: 100%;
+ font-size: 1.6rem;
+ }
+ }
+}
diff --git a/assets/scss/_fuji-style/_sidebar.scss b/assets/scss/_fuji-style/_sidebar.scss
index 132a22f..b6621b9 100644
--- a/assets/scss/_fuji-style/_sidebar.scss
+++ b/assets/scss/_fuji-style/_sidebar.scss
@@ -4,11 +4,11 @@
.sidebar-item {
&:not(:last-child) {
- margin-bottom: 1rem; // space betreen sidebar items
+ margin-bottom: 1rem; // space between sidebar items
}
h3 {
- margin-bottom: 0.25rem; // space betreen head3 & lists
+ margin-bottom: 0.25rem; // space between head3 & lists
}
ul {
diff --git a/assets/scss/_fuji-theme/_dark-diff.scss b/assets/scss/_fuji-theme/_dark-diff.scss
index 55f596f..1af08fb 100644
--- a/assets/scss/_fuji-theme/_dark-diff.scss
+++ b/assets/scss/_fuji-theme/_dark-diff.scss
@@ -1,7 +1,3 @@
-img {
- filter: brightness(60%);
-}
-
table {
th,
td {
@@ -33,3 +29,24 @@ table {
.aplayer .aplayer-info .aplayer-controller .aplayer-time .aplayer-icon:hover path {
fill: var(--color-focus) !important;
}
+
+.aplayer .aplayer-list ol li {
+ border-top: 1px solid var(--color-bg) !important;
+}
+
+.aplayer.aplayer-withlist .aplayer-info {
+ border-bottom: 1px solid var(--color-bg) !important;
+}
+
+.aplayer .aplayer-list ol li.aplayer-list-light {
+ background-color: var(--color-codebg) !important;
+}
+
+.aplayer .aplayer-list ol li:hover {
+ background-color: var(--color-codebg) !important;
+}
+
+.aplayer .aplayer-list ol li .aplayer-list-author,
+.aplayer .aplayer-list ol li .aplayer-list-index {
+ color: var(--color-font) !important;
+}
diff --git a/assets/scss/_fuji-theme/_style.scss b/assets/scss/_fuji-theme/_style.scss
index 893a26c..f731fa2 100644
--- a/assets/scss/_fuji-theme/_style.scss
+++ b/assets/scss/_fuji-theme/_style.scss
@@ -312,3 +312,46 @@ code {
color: var(--color-mute) !important;
}
}
+
+.search-result-info {
+ border-bottom: $divider;
+}
+
+.search-input {
+ border-top: 2px solid;
+ border-left: 2px solid;
+ border-bottom: 2px solid;
+ border-right: none;
+ border-radius: 0.25rem;
+ border-color: var(--color-divider);
+ background-color: var(--color-bg);
+
+ &:hover,
+ &:focus-within {
+ color: var(--color-primary);
+ border-color: var(--color-primary);
+ }
+
+ input {
+ outline: none;
+ border: none;
+ color: inherit;
+ background-color: inherit;
+ }
+
+ button {
+ outline: none;
+ border-top: 2px solid;
+ border-left: none;
+ border-right: 2px solid;
+ border-bottom: 2px solid;
+ border-radius: 0 0.25rem 0.25rem 0;
+ border-color: inherit;
+ color: inherit;
+ background-color: inherit;
+
+ &:hover {
+ color: var(--color-secondary);
+ }
+ }
+}
generated by cgit v1.2.3 (git 2.25.1) at 2025-05-17 21:17:26 +0000