bofh/fet2020
8
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

update Redesign to v1.2.0-dev

Browse Source
This commit is contained in:
Patrick Mayr
2022-11-21 11:56:52 +00:00
parent 8ce674e2de
commit 44e9dddf23
11 changed files with 383 additions and 95 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
fet2020/search/urls.py
View File

@@ -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"),
]

386
fet2020/static/css/styles.css
View File

@@ -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));
}

12
fet2020/static/js/alpine-csp.js
View File

@@ -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;

35
fet2020/templates/base.html
View File

@@ -4,7 +4,33 @@
{% load static %}
{% block body %}
<body x-data="modal" x-ref="overflow">
<body x-data="search" x-ref="overflow" @keyup.escape="closeShowSearch">
<!-- SEARCH-BAR -->
<div class="fixed w-screen h-screen z-30 backdrop-blur-sm backdrop-saturate-50"
x-show="showSearch"
x-transition:enter="transition ease-out duration-300"
x-transition:enter-start="transform backdrop-blur-none backdrop-saturate-100"
x-transition:enter-end="transform backdrop-blur-sm backdrop-saturate-50"
x-transition:leave="transition ease-in duration-150"
x-transition:leave-start="transform backdrop-blur-sm backdrop-saturate-50"
x-transition:leave-end="transform backdrop-blur-none backdrop-saturate-100"
>
<form action="{% url 'search:index' %}" class="flex items-center opacity-90 gap-x-4 mt-[33vh] sm:max-w-md lg:max-w-lg xl:max-w-xl mx-4 sm:mx-auto py-2 px-4 shadow-lg dark:shadow-none bg-gray-200 dark:bg-gray-800 text-gray-800 dark:text-gray-200 rounded-lg dark:border-2 dark:border-gray-700"
@click.outside="closeShowSearch"
x-show="showSearch"
x-transition:enter="transition transform ease-out duration-300"
x-transition:enter-start="scale-0 opacity-0"
x-transition:enter-end="scale-100 opacity-90"
x-transition:leave="transition transform ease-in duration-150"
x-transition:leave-start="scale-100 opacity-90"
x-transition:leave-end="scale-0 opacity-0"
>
<input class="flex-grow bg-inherit text-inherit h-10 p-0 border-0 focus:outline-none focus:border-transparent focus:ring-0" type="search" name="q" placeholder="Nach Person, Artikel oder Fotoalbum suchen...">
<button type="submit" class="flex-none">
<i class="fa-solid fa-magnifying-glass text-gray-500 dark:text-gray-600"></i>
</button>
</form>
</div>
<!-- NAVBAR -->
{% if not request.user.is_authenticated %}
<nav class="navBar-md" x-data="myNavBar">
@@ -12,6 +38,11 @@
<nav class="navBar-lg" x-data="myNavBar">
{% endif %}
<div>
<button class="searchbar-toggle"
@click.prevent="openShowSearch"
>
<i class="fa-solid fa-magnifying-glass"></i>
</button>
<a href="{% url 'home' %}">
<img src="{% static 'img/FET-Logo-2014_64_light.svg' %}" alt="FET-Logo" class="navbar-logo p-2 dark:hidden">
<img src="{% static 'img/FET-Logo-2014_64_dark.svg' %}" alt="FET-Logo" class="navbar-logo p-2 hidden dark:block">
@@ -36,6 +67,8 @@
<li class="{% if '/kontakt/' in request.path %}active{% endif %}"><a href="{{ pages.first.url }}">{{ pages.first.title }}</a></li>
{% endif %}
<li class="visible-expandedOnly"><button @click.prevent="openShowSearch"><span class="hidden md:inline"><i class="fa-solid fa-magnifying-glass"></i></span></button></li>
{% if not request.user.is_authenticated %}
<li><a href="{% url 'authentications:login' %}?next={{ request.path }}">Anmelden</a></li>
{% else %}

2
fet2020/templates/members/index.html
View File

@@ -6,7 +6,7 @@
{% block content %}
<!-- Main Content -->
<main class="container mx-auto w-full px-4 mt-8 flex-1">
<main x-data="modal" class="container mx-auto w-full px-4 mt-8 flex-1">
<h1 class="page-title">Über uns</h1>
<div class="sm:flex sm:flex-row justify-center my-8">
<aside class="flex-none max-w-min sm:mr-8">

2
fet2020/templates/posts/index.html
View File

@@ -4,7 +4,7 @@
{% block content %}
<!-- Main Content -->
<main class="container mx-auto w-full px-4 my-8 flex-1">
<main x-data="modal" class="container mx-auto w-full px-4 my-8 flex-1">
<h1 class="page-title">News</h1>
<div class="sm:flex sm:flex-row-reverse justify-center">
<aside class="sm:w-2/5 sm:max-w-xs sm:pl-4 lg:pl-8 my-8 sm:my-0">

4
fet2020/templates/search/album.html
View File

@@ -12,7 +12,9 @@
</div>
<article class="flex-grow-0 sm:m-2">
<h2 class="line-clamp-1 hover:underline decoration-1 text-gray-800 dark:text-gray-200 sm:font-medium"><i class="fa-solid fa-images mr-2"></i>{{ result.title }}</h2>
<div class="line-clamp-2 mt-0.5 text-gray-700 dark:text-gray-300 min-h-12">{{ result.description|safe }}</div>
<div class="line-clamp-2 mt-0.5 text-gray-700 dark:text-gray-300 min-h-12">
{{ result.description|safe }}
</div>
<div class="mt-1">
<small class="text-sm sm:text-base text-gray-600 dark:text-gray-400 hidden sm:block">{{ result.photographer|default:'' }} am {{ result.event_date }}</small>
<small class="text-sm sm:text-base text-gray-600 dark:text-gray-400 sm:hidden">{{ result.photographer|default:'' }} am {{ result.event_date|date:"d. M. Y" }}</small>

18
fet2020/templates/search/index.html
View File

@@ -7,13 +7,11 @@
<main class="container mx-auto w-full px-4 my-8 flex-1">
<h1 class="page-title">Suchergebnisse</h1>
<section>
<div class="w-full sticky py-4 md:py-8 -mt-4 md:-mt-8 top-0 z-20 bg-gray-100 dark:bg-gray-900">
<form method="get" action="." class="flex gap-x-2 mx-auto max-w-prose">
<table>
<input type="search" id="id_q" name="{{ form.q.name }}" value="{{ form.q.value|default:'' }}" class="block w-full rounded-md border-gray-300 dark:border-none shadow-sm focus:border-blue-200 focus:ring focus:ring-blue-200 dark:focus:ring-sky-700 focus:ring-opacity-50 placeholder:italic" autofocus placeholder="Frag mich etwas...">
<input type="submit" class="flex-grow-0 btn btn-primary" value="Suche">
</table>
</form>
<div class="w-full sticky py-4 md:py-8 -mt-4 md:-mt-8 top-0 z-10 bg-gray-100 dark:bg-gray-900">
<form class="flex gap-x-2 mx-auto max-w-prose">
<input type="search" id="id_q" name="{{ form.q.name }}" value="{{ form.q.value|default:'' }}" class="block w-full rounded-md border-gray-300 dark:border-none shadow-sm focus:border-blue-200 focus:ring focus:ring-blue-200 dark:focus:ring-sky-700 focus:ring-opacity-50 placeholder:italic" autofocus placeholder="Frag mich etwas...">
<input type="submit" class="flex-grow-0 btn btn-primary" value="Suchen">
</form>
</div>
{% if form.q.value %}
@@ -29,9 +27,9 @@
{% include 'search/album.html' %}
{% endif %}
{% empty %}
<article class="flex-grow-0 sm:m-2">
<h2 class="line-clamp-1 decoration-1 text-gray-800 dark:text-gray-200 sm:font-medium"></i>Keine Ergebnisse gefunden.</h2>
</article>
<div class="text-lg text-gray-800 dark:text-gray-200 text-center my-8">
<i class="fa-solid fa-ban mr-2"></i> Keine Ergebnisse gefunden!
</div>
{% endfor %}
</div>
{% endif %}

6
fet2020/templates/search/member.html
View File

@@ -1,6 +1,6 @@
<a class="flex gap-x-2 group" href="{{ result.get_absolute_url }}">
<div class="flex-none rounded-full aspect-square bg-center bg-no-repeat bg-cover bg-gray-300 dark:bg-gray-700" style="background-image: url('{{ result.image.url }}')"></div>
<article class="flex-grow-0 sm:m-2">
<a class="flex gap-x-4 group" href="{{ result.get_absolute_url }}">
<div class="flex-none w-20 rounded-full aspect-square bg-center bg-no-repeat bg-cover bg-gray-300 dark:bg-gray-700" style="background-image: url('{{ result.image.url }}')"></div>
<article class="flex-grow-0 self-center">
<h2 class="line-clamp-1 hover:underline decoration-1 text-gray-800 dark:text-gray-200 font-medium">{{ result.firstname }} {{ result.surname }}</h2>
<ul class="text-gray-700 dark:text-gray-300 text-sm sm:text-base">
<li><i class="fa-fw fa-solid fa-user-tag text-gray-600 dark:text-gray-400 mr-1" title="Spitzname: "></i>{{ result.nickname }}</li>

8
fet2020/templates/search/post.html
View File

@@ -3,9 +3,13 @@
<article class="flex-grow-0 sm:m-2">
<h2 class="line-clamp-1 hover:underline decoration-1 text-gray-800 dark:text-gray-200 sm:font-medium"><i class="fa-solid fa-up-right-from-square mr-2"></i>{{ result.title|truncatechars:50 }}</h2>
{% if result.body %}
<div class="line-clamp-2 mt-0.5 text-gray-700 dark:text-gray-300 min-h-12">{{ result.body|safe|truncatechars:120 }}</div>
<div class="line-clamp-2 mt-0.5 text-gray-700 dark:text-gray-300 min-h-12">
{{ result.body|safe|truncatechars:120 }}
</div>
{% elif result.agenda_html %}
<div class="line-clamp-2 mt-0.5 text-gray-700 dark:text-gray-300 min-h-12">{{ result.agenda_html|safe|truncatechars:120 }}</div>
<div class="line-clamp-2 mt-0.5 text-gray-700 dark:text-gray-300 min-h-12">
{{ result.agenda_html|safe|truncatechars:120 }}
</div>
{% endif %}
<div class="mt-1">
<small class="text-sm sm:text-base text-gray-600 dark:text-gray-400 hidden sm:block">{{ result.author }} am {{ result.date }}</small>

2
fet2020/templates/tasks/index.html
View File

@@ -4,7 +4,7 @@
{% block content %}
<!-- Main Content -->
<main class="container mx-auto w-full px-4 my-8 flex-1">
<main x-data="modal" class="container mx-auto w-full px-4 my-8 flex-1">
<h1 class="page-title">Tasks</h1>
<div class="sm:flex sm:flex-row-reverse justify-center">
<aside class="sm:w-2/5 sm:max-w-xs sm:pl-4 lg:pl-8 my-8 sm:my-0">