diff --git a/README.md b/README.md index 5e740f4..e899b08 100644 --- a/README.md +++ b/README.md @@ -43,7 +43,8 @@ The minimalist [Pelican](http://blog.getpelican.com/) theme. - [Related Posts](https://github.com/getpelican/pelican-plugins/tree/master/related_posts) - [Representative image](https://github.com/getpelican/pelican-plugins/tree/master/representative_image) - [Neighbors](https://github.com/getpelican/pelican-plugins/tree/master/neighbors) -- [Tipue Search](https://github.com/getpelican/pelican-plugins/blob/master/tipue_search/) +- [Pelican Search](https://github.com/pelican-plugins/search) +- [Tipue Search](https://github.com/getpelican/pelican-plugins/blob/master/tipue_search/) (deprecated) - [SEO](https://github.com/pelican-plugins/seo) ## Install diff --git a/static/stork/stork-dark.css b/static/stork/stork-dark.css new file mode 100644 index 0000000..09f162d --- /dev/null +++ b/static/stork/stork-dark.css @@ -0,0 +1,208 @@ +.stork-wrapper-dark { + position: relative; + font-family: inherit; + box-sizing: border-box; + font-size: 1em; + padding: unset; + + --stork-blue-2: #a5d8ff; + + --stork-violet-4: #9775fa; + --stork-violet-5: #845ef7; + --stork-violet-10: #52366d; + + --stork-lime-3: #c0eb75; + + --stork-gray-1: #f1f3f5; + --stork-gray-3: #dee2e6; + --stork-gray-7: #495057; + --stork-gray-8: #343a40; + --flex-red: #d9411e; + + --stork-border-color: var(--stork-gray-7); + --stork-background-color: var(--stork-gray-8); + --stork-text-color: var(--flex-red); +} + +.stork-wrapper-dark *, +.stork-wrapper-dark *:before, +.stork-wrapper-dark *:after { + box-sizing: border-box; +} + +.stork-wrapper-dark .stork-input { + width: 100%; + height: 2.4em; + font-size: 1em; + padding: 0.4em 0.8em; + position: relative; + box-shadow: inset 0 0.1em 0.3em hsla(0, 0%, 0%, 0.1); + border: 1px solid var(--stork-border-color); + border-radius: 8px; + background-color: var(--stork-gray-3); + color: var(--stork-gray-8); + font-family: inherit; +} + +.stork-wrapper-dark .stork-input:focus { + outline: none; + background-color: var(--stork-gray-8); + color: var(--stork-gray-3); +} + +.stork-wrapper-dark .stork-progress { + position: absolute; + display: block; + content: ""; + bottom: 1px; + background-color: var(--stork-violet-5); + box-shadow: 0 0 8px var(--stork-violet-4); + height: 1px; + transition: width 0.25s ease, opacity 0.4s ease 0.4s; +} + +.stork-wrapper-dark .stork-output { + position: absolute; + width: 100%; + margin-top: 0.5em; + border-radius: 4px; + display: flex; + flex-direction: column; + z-index: 100; + color: var(--stork-text-color); + font-weight: 400; + font-family: inherit; + text-align: unset; + padding: unset; +} + +.stork-wrapper-dark .stork-attribution a:link, +.stork-wrapper-dark .stork-attribution a:visited { + color: var(--stork-blue-2); +} + +.stork-wrapper-dark .stork-output-visible { + border: 1px solid var(--stork-border-color); + box-shadow: 0px 0.4px 2.2px rgba(0, 0, 0, 0.011), + 0px 1px 5.3px rgba(0, 0, 0, 0.016), 0px 1.9px 10px rgba(0, 0, 0, 0.02), + 0px 3.4px 17.9px rgba(0, 0, 0, 0.024), 0px 6.2px 33.4px rgba(0, 0, 0, 0.029), + 0px 15px 80px rgba(0, 0, 0, 0.04); + background: var(--stork-background-color); +} + +.stork-wrapper-dark .stork-message { + width: 100%; + padding: 0.5em 1em; + color: var(--stork-text-color); +} + +.stork-wrapper-dark .stork-attribution { + width: 100%; + padding: 0.5em 1em; + font-size: 0.8em; + color: var(--stork-text-color); +} + +.stork-wrapper-dark .stork-results { + margin: 0; + padding: 0; + width: 100%; + list-style-type: none; + max-height: 25em; + overflow-y: scroll; + border-top: 1px solid var(--stork-border-color); + border-bottom: 1px solid var(--stork-border-color); + box-shadow: inset 0em 0.7em 0.2em -0.5em hsla(0, 0%, 0%, 0.08), + inset 0em -0.7em 0.2em -0.5em hsla(0, 0%, 0%, 0.08); +} + +.stork-wrapper-dark .stork-result:not(:last-child) { + border-bottom: 1px solid var(--stork-border-color); +} + +.stork-wrapper-dark .stork-result.selected { + background: var(--stork-violet-10); +} + +.stork-wrapper-dark .stork-result a:link { + padding: 1em; + display: block; + color: currentcolor; + text-decoration: none; +} + +.stork-wrapper-dark .stork-result p { + margin: 0; +} + +.stork-wrapper-dark .stork-title { + padding: unset; + font-weight: bold; + font-size: 0.95em; + margin: 0 0 0.75em 0; + color: var(--stork-text-color); + + /* Flexbox container for the title and the score, when debugging */ + display: flex; + justify-content: space-between; +} + +.stork-wrapper-dark .stork-excerpt { + font-size: 0.8em; + line-height: 1; + margin: 0; + color: var(--stork-gray-3); + padding: unset; + + /* Flexbox container for the title and the score, when debugging */ + display: flex; + justify-content: space-between; +} + +.stork-wrapper-dark .stork-excerpt:not(:last-of-type) { + margin-bottom: 0.6em; +} + +.stork-wrapper-dark .stork-highlight { + background-color: var(--stork-lime-3); + padding: 0 0.1em; +} + +.stork-wrapper-dark .stork-error { + outline: 2px solid #c92a2a; +} + +.stork-wrapper-dark .stork-close-button { + position: absolute; + /* bottom: 0; */ + right: 0; + margin: 0.7em 0.6em; + height: 1.2em; + width: 1.2em; + padding: 0px; + background: linear-gradient( + to bottom, + hsl(0, 0%, 85%) 0%, + hsl(0, 0%, 83%) 100% + ); + border: 1px solid hsla(0, 0%, 50%, 0.3); + font-size: 1em; + color: hsl(0, 0%, 50%); + border-radius: 15%; + line-height: 1; +} + +.stork-wrapper-dark .stork-close-button svg { + width: 0.8em; + position: relative; + top: 1px; +} + +.stork-wrapper-dark .stork-close-button:hover { + background: hsla(0, 0%, 78%); + cursor: pointer; +} + +.stork-wrapper-dark .stork-close-button:active { + background: hsla(0, 0%, 65%); +} diff --git a/templates/base.html b/templates/base.html index dbe4a31..474d887 100644 --- a/templates/base.html +++ b/templates/base.html @@ -73,7 +73,12 @@ {% if USE_GOOGLE_FONTS != False %} {% endif %} - + + {% endif %} + + {% if PLUGINS and 'pelican.plugins.search' in PLUGINS %} + {% endif %} @@ -182,7 +187,12 @@ {% endif %} - + {% if PLUGINS and 'pelican.plugins.search' in PLUGINS %} +
+ +
+
+ {% endif %} {% if (pages and DISPLAY_PAGES_ON_MENU) or LINKS %}