diff --git a/fet2020/search/urls.py b/fet2020/search/urls.py index 68e46d2e..7ff59069 100644 --- a/fet2020/search/urls.py +++ b/fet2020/search/urls.py @@ -1,7 +1,10 @@ from django.urls import path, re_path +from . import apps from . import views +app_name = apps.SearchConfig.name + urlpatterns = [ path("", views.index, name="index"), ] diff --git a/fet2020/static/css/styles.css b/fet2020/static/css/styles.css index 509afca3..0c326f5e 100644 --- a/fet2020/static/css/styles.css +++ b/fet2020/static/css/styles.css @@ -1,5 +1,5 @@ /* -! tailwindcss v3.0.24 | MIT License | https://tailwindcss.com +! tailwindcss v3.1.8 | MIT License | https://tailwindcss.com */ /* @@ -187,6 +187,8 @@ textarea { /* 1 */ font-size: 100%; /* 1 */ + font-weight: inherit; + /* 1 */ line-height: inherit; /* 1 */ color: inherit; @@ -353,13 +355,6 @@ input::-moz-placeholder, textarea::-moz-placeholder { /* 2 */ } -input:-ms-input-placeholder, textarea:-ms-input-placeholder { - opacity: 1; - /* 1 */ - color: #9ca3af; - /* 2 */ -} - input::placeholder, textarea::placeholder { opacity: 1; @@ -415,14 +410,6 @@ video { height: auto; } -/* -Ensure the default browser behavior of the `hidden` attribute. -*/ - -[hidden] { - display: none; -} - [type='text'],[type='email'],[type='url'],[type='password'],[type='number'],[type='date'],[type='datetime-local'],[type='month'],[type='search'],[type='tel'],[type='time'],[type='week'],[multiple],textarea,select { -webkit-appearance: none; -moz-appearance: none; @@ -458,11 +445,6 @@ input::-moz-placeholder, textarea::-moz-placeholder { opacity: 1; } -input:-ms-input-placeholder, textarea:-ms-input-placeholder { - color: #6b7280; - opacity: 1; -} - input::placeholder,textarea::placeholder { color: #6b7280; opacity: 1; @@ -513,7 +495,6 @@ select { background-origin: border-box; -webkit-user-select: none; -moz-user-select: none; - -ms-user-select: none; user-select: none; flex-shrink: 0; height: 1rem; @@ -635,6 +616,102 @@ p a:hover { } *, ::before, ::after { + --tw-border-spacing-x: 0; + --tw-border-spacing-y: 0; + --tw-translate-x: 0; + --tw-translate-y: 0; + --tw-rotate: 0; + --tw-skew-x: 0; + --tw-skew-y: 0; + --tw-scale-x: 1; + --tw-scale-y: 1; + --tw-pan-x: ; + --tw-pan-y: ; + --tw-pinch-zoom: ; + --tw-scroll-snap-strictness: proximity; + --tw-ordinal: ; + --tw-slashed-zero: ; + --tw-numeric-figure: ; + --tw-numeric-spacing: ; + --tw-numeric-fraction: ; + --tw-ring-inset: ; + --tw-ring-offset-width: 0px; + --tw-ring-offset-color: #fff; + --tw-ring-color: rgb(59 130 246 / 0.5); + --tw-ring-offset-shadow: 0 0 #0000; + --tw-ring-shadow: 0 0 #0000; + --tw-shadow: 0 0 #0000; + --tw-shadow-colored: 0 0 #0000; + --tw-blur: ; + --tw-brightness: ; + --tw-contrast: ; + --tw-grayscale: ; + --tw-hue-rotate: ; + --tw-invert: ; + --tw-saturate: ; + --tw-sepia: ; + --tw-drop-shadow: ; + --tw-backdrop-blur: ; + --tw-backdrop-brightness: ; + --tw-backdrop-contrast: ; + --tw-backdrop-grayscale: ; + --tw-backdrop-hue-rotate: ; + --tw-backdrop-invert: ; + --tw-backdrop-opacity: ; + --tw-backdrop-saturate: ; + --tw-backdrop-sepia: ; +} + +::-webkit-backdrop { + --tw-border-spacing-x: 0; + --tw-border-spacing-y: 0; + --tw-translate-x: 0; + --tw-translate-y: 0; + --tw-rotate: 0; + --tw-skew-x: 0; + --tw-skew-y: 0; + --tw-scale-x: 1; + --tw-scale-y: 1; + --tw-pan-x: ; + --tw-pan-y: ; + --tw-pinch-zoom: ; + --tw-scroll-snap-strictness: proximity; + --tw-ordinal: ; + --tw-slashed-zero: ; + --tw-numeric-figure: ; + --tw-numeric-spacing: ; + --tw-numeric-fraction: ; + --tw-ring-inset: ; + --tw-ring-offset-width: 0px; + --tw-ring-offset-color: #fff; + --tw-ring-color: rgb(59 130 246 / 0.5); + --tw-ring-offset-shadow: 0 0 #0000; + --tw-ring-shadow: 0 0 #0000; + --tw-shadow: 0 0 #0000; + --tw-shadow-colored: 0 0 #0000; + --tw-blur: ; + --tw-brightness: ; + --tw-contrast: ; + --tw-grayscale: ; + --tw-hue-rotate: ; + --tw-invert: ; + --tw-saturate: ; + --tw-sepia: ; + --tw-drop-shadow: ; + --tw-backdrop-blur: ; + --tw-backdrop-brightness: ; + --tw-backdrop-contrast: ; + --tw-backdrop-grayscale: ; + --tw-backdrop-hue-rotate: ; + --tw-backdrop-invert: ; + --tw-backdrop-opacity: ; + --tw-backdrop-saturate: ; + --tw-backdrop-sepia: ; +} + +::backdrop { + --tw-border-spacing-x: 0; + --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; @@ -782,6 +859,23 @@ p a:hover { flex: none; } +.searchbar-toggle { + position: absolute; + top: 1.25rem; + left: 1rem; + font-size: 1.5rem; + line-height: 2rem; + --tw-text-opacity: 1; + color: rgb(0 101 153 / var(--tw-text-opacity)); +} + +@media (prefers-color-scheme: dark) { + .searchbar-toggle { + --tw-text-opacity: 1; + color: rgb(71 194 255 / var(--tw-text-opacity)); + } +} + .navbar-toggle { position: absolute; top: 1.25rem; @@ -823,7 +917,8 @@ p a:hover { margin-bottom: 0.5rem; } -.navbar-content li > a { +.navbar-content li > a, +.navbar-content li > button { margin-left: 0.25rem; margin-right: 0.25rem; display: block; @@ -915,6 +1010,11 @@ p a:hover { justify-content: space-between; } + .navBar-sm .searchbar-toggle { + left: 0px; + display: none; + } + .navBar-sm .navbar-toggle { right: 0px; display: none; @@ -1009,6 +1109,11 @@ p a:hover { justify-content: space-between; } + .navBar-md .searchbar-toggle { + left: 0px; + display: none; + } + .navBar-md .navbar-toggle { right: 0px; display: none; @@ -1097,12 +1202,27 @@ p a:hover { } } +.navBar-md .visible-expandedOnly { + display: none; +} + +@media (min-width: 768px) { + .navBar-md .visible-expandedOnly { + display: block; + } +} + @media (min-width: 1024px) { .navBar-lg > div { flex-direction: row; justify-content: space-between; } + .navBar-lg .searchbar-toggle { + left: 0px; + display: none; + } + .navBar-lg .navbar-toggle { right: 0px; display: none; @@ -1191,6 +1311,16 @@ p a:hover { } } +.navBar-lg .visible-expandedOnly { + display: none; +} + +@media (min-width: 1024px) { + .navBar-lg .visible-expandedOnly { + display: block; + } +} + /***** PAGE-TITLE *****/ .page-title { @@ -1599,7 +1729,6 @@ ul.sideBarNav > ul > li.active > a:first-child { /***** CALENDAR *****/ .calendar-preview > div { - position: -webkit-sticky; position: sticky; top: 1rem; } @@ -1717,7 +1846,8 @@ ul.sideBarNav > ul > li.active > a:first-child { border-radius: 0.25rem; background-image: linear-gradient(to top, var(--tw-gradient-stops)); --tw-gradient-from: #1f2937; - --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(31 41 55 / 0)); + --tw-gradient-to: rgb(31 41 55 / 0); + --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); } .article-cover-desc-items { @@ -1851,7 +1981,11 @@ ul.sideBarNav > ul > li.active > a:first-child { } } -[class^=db-page-content] h2, [class^=db-page-content] h3, [class^=db-page-content] h4, [class^=db-page-content] h5, [class^=db-page-content] h6 { +[class^=db-page-content] h2, +[class^=db-page-content] h3, +[class^=db-page-content] h4, +[class^=db-page-content] h5, +[class^=db-page-content] h6 { margin-top: 0.5rem; line-height: 1; --tw-text-opacity: 1; @@ -1859,7 +1993,11 @@ ul.sideBarNav > ul > li.active > a:first-child { } @media (prefers-color-scheme: dark) { - [class^=db-page-content] h2, [class^=db-page-content] h3, [class^=db-page-content] h4, [class^=db-page-content] h5, [class^=db-page-content] h6 { + [class^=db-page-content] h2, +[class^=db-page-content] h3, +[class^=db-page-content] h4, +[class^=db-page-content] h5, +[class^=db-page-content] h6 { --tw-text-opacity: 1; color: rgb(229 231 235 / var(--tw-text-opacity)); } @@ -1878,12 +2016,13 @@ ul.sideBarNav > ul > li.active > a:first-child { font-weight: 500; } -[class^=db-page-content] h4, [class^=db-page-content] h5, [class^=db-page-content] h6 { +[class^=db-page-content] h4, [class^=db-page-content] h5, [class^=db-page-content] h6 { font-size: 1.125rem; line-height: 1.75rem; } -[class^=db-page-content] b, [class^=db-page-content] strong { +[class^=db-page-content] b, +[class^=db-page-content] strong { font-weight: 600; } @@ -2614,6 +2753,10 @@ footer .copyright { color: rgb(156 163 175 / var(--tw-text-opacity)); } +.visible { + visibility: visible; +} + .static { position: static; } @@ -2631,7 +2774,6 @@ footer .copyright { } .sticky { - position: -webkit-sticky; position: sticky; } @@ -2695,14 +2837,6 @@ footer .copyright { margin: -1rem; } -.-m-3 { - margin: -0.75rem; -} - -.-m-1 { - margin: -0.25rem; -} - .mx-auto { margin-left: auto; margin-right: auto; @@ -2808,6 +2942,10 @@ footer .copyright { margin-top: 2rem; } +.mt-\[33vh\] { + margin-top: 33vh; +} + .ml-0\.5 { margin-left: 0.125rem; } @@ -2888,6 +3026,18 @@ footer .copyright { height: 0.75rem; } +.h-8 { + height: 2rem; +} + +.h-screen { + height: 100vh; +} + +.h-10 { + height: 2.5rem; +} + .h-7 { height: 1.75rem; } @@ -2896,24 +3046,12 @@ footer .copyright { height: 9rem; } -.h-44 { - height: 11rem; -} - -.h-6 { - height: 1.5rem; -} - -.h-12 { - height: 3rem; -} - .h-16 { height: 4rem; } -.h-8 { - height: 2rem; +.h-44 { + height: 11rem; } .min-h-screen { @@ -2946,6 +3084,14 @@ footer .copyright { width: 0.75rem; } +.w-8 { + width: 2rem; +} + +.w-screen { + width: 100vw; +} + .w-7 { width: 1.75rem; } @@ -2966,6 +3112,10 @@ footer .copyright { width: 6rem; } +.w-20 { + width: 5rem; +} + .w-\[3\.5rem\] { width: 3.5rem; } @@ -2974,18 +3124,6 @@ footer .copyright { width: 12rem; } -.w-6 { - width: 1.5rem; -} - -.w-8 { - width: 2rem; -} - -.w-10 { - width: 2.5rem; -} - .max-w-prose { max-width: 65ch; } @@ -3121,6 +3259,12 @@ footer .copyright { transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } +.scale-0 { + --tw-scale-x: 0; + --tw-scale-y: 0; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + .scale-90 { --tw-scale-x: .9; --tw-scale-y: .9; @@ -3362,6 +3506,10 @@ footer .copyright { align-self: stretch; } +.overflow-y-auto { + overflow-y: auto; +} + .overflow-y-hidden { overflow-y: hidden; } @@ -3418,6 +3566,10 @@ footer .copyright { border-width: 2px; } +.border-0 { + border-width: 0px; +} + .border-dashed { border-style: dashed; } @@ -3482,6 +3634,15 @@ footer .copyright { background-color: rgb(2 132 199 / var(--tw-bg-opacity)); } +.bg-gray-200 { + --tw-bg-opacity: 1; + background-color: rgb(229 231 235 / var(--tw-bg-opacity)); +} + +.bg-inherit { + background-color: inherit; +} + .bg-gray-800 { --tw-bg-opacity: 1; background-color: rgb(31 41 55 / var(--tw-bg-opacity)); @@ -3542,7 +3703,8 @@ footer .copyright { .from-black { --tw-gradient-from: #000; - --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(0 0 0 / 0)); + --tw-gradient-to: rgb(0 0 0 / 0); + --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); } .bg-cover { @@ -3574,6 +3736,10 @@ footer .copyright { padding: 2rem; } +.p-0 { + padding: 0px; +} + .p-3 { padding: 0.75rem; } @@ -3613,6 +3779,11 @@ footer .copyright { padding-right: 0.5rem; } +.py-2 { + padding-top: 0.5rem; + padding-bottom: 0.5rem; +} + .py-4 { padding-top: 1rem; padding-bottom: 1rem; @@ -3671,11 +3842,6 @@ footer .copyright { line-height: 2.5rem; } -.text-5xl { - font-size: 3rem; - line-height: 1; -} - .text-base { font-size: 1rem; line-height: 1.5rem; @@ -3785,6 +3951,11 @@ footer .copyright { color: rgb(156 163 175 / var(--tw-text-opacity)); } +.text-gray-100 { + --tw-text-opacity: 1; + color: rgb(243 244 246 / var(--tw-text-opacity)); +} + .text-blue-50 { --tw-text-opacity: 1; color: rgb(239 246 255 / var(--tw-text-opacity)); @@ -3825,6 +3996,10 @@ footer .copyright { color: rgb(0 85 128 / var(--tw-text-opacity)); } +.text-inherit { + color: inherit; +} + .text-blue-700 { --tw-text-opacity: 1; color: rgb(29 78 216 / var(--tw-text-opacity)); @@ -3870,6 +4045,10 @@ footer .copyright { opacity: 0.8; } +.opacity-90 { + opacity: 0.9; +} + .shadow-sm { --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05); --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color); @@ -3905,6 +4084,30 @@ footer .copyright { filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); } +.backdrop-blur-sm { + --tw-backdrop-blur: blur(4px); + -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); + backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); +} + +.backdrop-blur-none { + --tw-backdrop-blur: blur(0); + -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); + backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); +} + +.backdrop-saturate-50 { + --tw-backdrop-saturate: saturate(.5); + -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); + backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); +} + +.backdrop-saturate-100 { + --tw-backdrop-saturate: saturate(1); + -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); + backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); +} + .transition { transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; @@ -3969,10 +4172,6 @@ footer .copyright { font-style: italic; } -.placeholder\:italic:-ms-input-placeholder { - font-style: italic; -} - .placeholder\:italic::placeholder { font-style: italic; } @@ -4037,6 +4236,10 @@ footer .copyright { border-color: rgb(147 197 253 / var(--tw-border-opacity)); } +.focus\:border-transparent:focus { + border-color: transparent; +} + .focus\:border-sky-700:focus { --tw-border-opacity: 1; border-color: rgb(3 105 161 / var(--tw-border-opacity)); @@ -4047,12 +4250,23 @@ footer .copyright { border-color: rgb(191 219 254 / var(--tw-border-opacity)); } +.focus\:outline-none:focus { + outline: 2px solid transparent; + outline-offset: 2px; +} + .focus\:ring:focus { --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); } +.focus\:ring-0:focus { + --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); + --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color); + box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); +} + .focus\:ring-blue-200:focus { --tw-ring-opacity: 1; --tw-ring-color: rgb(191 219 254 / var(--tw-ring-opacity)); @@ -4281,6 +4495,12 @@ footer .copyright { color: rgb(239 68 68 / var(--tw-text-opacity)); } + .dark\:shadow-none { + --tw-shadow: 0 0 #0000; + --tw-shadow-colored: 0 0 #0000; + box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); + } + .dark\:hover\:bg-gray-800:hover { --tw-bg-opacity: 1; background-color: rgb(31 41 55 / var(--tw-bg-opacity)); @@ -4357,7 +4577,6 @@ footer .copyright { } .sm\:sticky { - position: -webkit-sticky; position: sticky; } @@ -4384,6 +4603,11 @@ footer .copyright { margin-bottom: 1rem; } + .sm\:mx-auto { + margin-left: auto; + margin-right: auto; + } + .sm\:my-8 { margin-top: 2rem; margin-bottom: 2rem; @@ -4483,6 +4707,10 @@ footer .copyright { max-width: none; } + .sm\:max-w-md { + max-width: 28rem; + } + .sm\:flex-1 { flex: 1 1 0%; } @@ -4770,6 +4998,10 @@ footer .copyright { width: 40%; } + .lg\:max-w-lg { + max-width: 32rem; + } + .lg\:flex-grow-0 { flex-grow: 0; } @@ -4838,6 +5070,10 @@ footer .copyright { width: 33.333333%; } + .xl\:max-w-xl { + max-width: 36rem; + } + .xl\:grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); } diff --git a/fet2020/static/js/alpine-csp.js b/fet2020/static/js/alpine-csp.js index bd763dc6..d75266d5 100644 --- a/fet2020/static/js/alpine-csp.js +++ b/fet2020/static/js/alpine-csp.js @@ -3186,6 +3186,18 @@ } } })); + alpine_default.data("search", () => ({ + showSearch: false, + openShowSearch() { + this.showSearch = true; + }, + closeShowSearch() { + this.showSearch = false; + }, + getShowSearch() { + return this.showSearch; + } + })); // packages/csp/builds/cdn.js window.Alpine = src_default2; diff --git a/fet2020/templates/base.html b/fet2020/templates/base.html index 605d2597..29a39eaa 100644 --- a/fet2020/templates/base.html +++ b/fet2020/templates/base.html @@ -4,7 +4,33 @@ {% load static %} {% block body %} - + + +
+
+ + +
+
{% if not request.user.is_authenticated %}