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

Update Redesign to 2.0.0 - Switched to CSP safe

Browse Source
This commit is contained in:
Patrick Mayr
2023-08-29 10:06:48 +00:00
parent 91c5cd9dfc
commit 63679973f7
26 changed files with 6078 additions and 10927 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

File diff suppressed because it is too large Load Diff

85
fet2020/static/img/404.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 6.8 KiB

After

Width:  |  Height:  |  Size: 9.4 KiB

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

File diff suppressed because it is too large Load Diff

79
fet2020/static/js/dark-mode.js
View File

@@ -1,79 +0,0 @@
const prefersDark = window.matchMedia("(prefers-color-scheme: dark)").matches;
function setTheme(mode) {
if (mode !== "light" && mode !== "dark" && mode !== "auto") {
mode = "auto";
}
var themeToggleAutoIcon = document.getElementById('theme-icon-when-auto');
var themeToggleDarkIcon = document.getElementById('theme-icon-when-dark');
var themeToggleLightIcon = document.getElementById('theme-icon-when-light');
themeToggleAutoIcon.classList.add('hidden');
themeToggleDarkIcon.classList.add('hidden');
themeToggleLightIcon.classList.add('hidden');
if (mode === "dark") {
themeToggleDarkIcon.classList.remove('hidden');
document.documentElement.classList.add('dark');
} else if (mode === "auto") {
themeToggleAutoIcon.classList.remove('hidden');
if(prefersDark) {
document.documentElement.classList.add('dark');
}
else {
document.documentElement.classList.remove('dark');
}
} else {
document.documentElement.classList.remove('dark');
themeToggleLightIcon.classList.remove('hidden');
}
localStorage.setItem('color-theme', mode);
}
function cycleTheme() {
const currentTheme = localStorage.getItem('color-theme') || "auto";
if (prefersDark) {
// Auto (dark) -> Light -> Dark
if (currentTheme === "auto") {
setTheme("light");
} else if (currentTheme === "light") {
setTheme("dark");
} else {
setTheme("auto");
}
} else {
// Auto (light) -> Dark -> Light
if (currentTheme === "auto") {
setTheme("dark");
} else if (currentTheme === "dark") {
setTheme("light");
} else {
setTheme("auto");
}
}
}
function initTheme() {
// set theme defined in localStorage if there is one, or fallback to auto mode
const currentTheme = localStorage.getItem('color-theme');
currentTheme ? setTheme(currentTheme) : setTheme("auto");
}
function setupTheme() {
// Attach event handlers for toggling themes
let buttons = document.getElementsByClassName("theme-toggle");
for (var i = 0; i < buttons.length; i++) {
buttons[i].addEventListener("click", cycleTheme);
};
}
initTheme();
document.addEventListener('DOMContentLoaded', function() {
setupTheme();
})

484
fet2020/static/js/gumshoe@5.1.1.js
View File

@@ -1,484 +0,0 @@
/*!
* gumshoejs v5.1.1
* A simple, framework-agnostic scrollspy script.
* (c) 2019 Chris Ferdinandi
* MIT License
* http://github.com/cferdinandi/gumshoe
*/
(function (root, factory) {
if ( typeof define === 'function' && define.amd ) {
define([], (function () {
return factory(root);
}));
} else if ( typeof exports === 'object' ) {
module.exports = factory(root);
} else {
root.Gumshoe = factory(root);
}
})(typeof global !== 'undefined' ? global : typeof window !== 'undefined' ? window : this, (function (window) {
'use strict';
//
// Defaults
//
var defaults = {
// Active classes
navClass: 'active',
contentClass: 'active',
// Nested navigation
nested: false,
nestedClass: 'active',
// Offset & reflow
offset: 0,
reflow: false,
// Event support
events: true
};
//
// Methods
//
/**
* Merge two or more objects together.
* @param {Object} objects The objects to merge together
* @returns {Object} Merged values of defaults and options
*/
var extend = function () {
var merged = {};
Array.prototype.forEach.call(arguments, (function (obj) {
for (var key in obj) {
if (!obj.hasOwnProperty(key)) return;
merged[key] = obj[key];
}
}));
return merged;
};
/**
* Emit a custom event
* @param {String} type The event type
* @param {Node} elem The element to attach the event to
* @param {Object} detail Any details to pass along with the event
*/
var emitEvent = function (type, elem, detail) {
// Make sure events are enabled
if (!detail.settings.events) return;
// Create a new event
var event = new CustomEvent(type, {
bubbles: true,
cancelable: true,
detail: detail
});
// Dispatch the event
elem.dispatchEvent(event);
};
/**
* Get an element's distance from the top of the Document.
* @param {Node} elem The element
* @return {Number} Distance from the top in pixels
*/
var getOffsetTop = function (elem) {
var location = 0;
if (elem.offsetParent) {
while (elem) {
location += elem.offsetTop;
elem = elem.offsetParent;
}
}
return location >= 0 ? location : 0;
};
/**
* Sort content from first to last in the DOM
* @param {Array} contents The content areas
*/
var sortContents = function (contents) {
if(contents) {
contents.sort((function (item1, item2) {
var offset1 = getOffsetTop(item1.content);
var offset2 = getOffsetTop(item2.content);
if (offset1 < offset2) return -1;
return 1;
}));
}
};
/**
* Get the offset to use for calculating position
* @param {Object} settings The settings for this instantiation
* @return {Float} The number of pixels to offset the calculations
*/
var getOffset = function (settings) {
// if the offset is a function run it
if (typeof settings.offset === 'function') {
return parseFloat(settings.offset());
}
// Otherwise, return it as-is
return parseFloat(settings.offset);
};
/**
* Get the document element's height
* @private
* @returns {Number}
*/
var getDocumentHeight = function () {
return Math.max(
document.body.scrollHeight, document.documentElement.scrollHeight,
document.body.offsetHeight, document.documentElement.offsetHeight,
document.body.clientHeight, document.documentElement.clientHeight
);
};
/**
* Determine if an element is in view
* @param {Node} elem The element
* @param {Object} settings The settings for this instantiation
* @param {Boolean} bottom If true, check if element is above bottom of viewport instead
* @return {Boolean} Returns true if element is in the viewport
*/
var isInView = function (elem, settings, bottom) {
var bounds = elem.getBoundingClientRect();
var offset = getOffset(settings);
if (bottom) {
return parseInt(bounds.bottom, 10) < (window.innerHeight || document.documentElement.clientHeight);
}
return parseInt(bounds.top, 10) <= offset;
};
/**
* Check if at the bottom of the viewport
* @return {Boolean} If true, page is at the bottom of the viewport
*/
var isAtBottom = function () {
if (window.innerHeight + window.pageYOffset >= getDocumentHeight()) return true;
return false;
};
/**
* Check if the last item should be used (even if not at the top of the page)
* @param {Object} item The last item
* @param {Object} settings The settings for this instantiation
* @return {Boolean} If true, use the last item
*/
var useLastItem = function (item, settings) {
if (isAtBottom() && isInView(item.content, settings, true)) return true;
return false;
};
/**
* Get the active content
* @param {Array} contents The content areas
* @param {Object} settings The settings for this instantiation
* @return {Object} The content area and matching navigation link
*/
var getActive = function (contents, settings) {
var last = contents[contents.length-1];
if (useLastItem(last, settings)) return last;
for (var i = contents.length - 1; i >= 0; i--) {
if (isInView(contents[i].content, settings)) return contents[i];
}
};
/**
* Deactivate parent navs in a nested navigation
* @param {Node} nav The starting navigation element
* @param {Object} settings The settings for this instantiation
*/
var deactivateNested = function (nav, settings) {
// If nesting isn't activated, bail
if (!settings.nested) return;
// Get the parent navigation
var li = nav.parentNode.closest('li');
if (!li) return;
// Remove the active class
li.classList.remove(settings.nestedClass);
// Apply recursively to any parent navigation elements
deactivateNested(li, settings);
};
/**
* Deactivate a nav and content area
* @param {Object} items The nav item and content to deactivate
* @param {Object} settings The settings for this instantiation
*/
var deactivate = function (items, settings) {
// Make sure their are items to deactivate
if (!items) return;
// Get the parent list item
var li = items.nav.closest('li');
if (!li) return;
// Remove the active class from the nav and content
li.classList.remove(settings.navClass);
items.content.classList.remove(settings.contentClass);
// Deactivate any parent navs in a nested navigation
deactivateNested(li, settings);
// Emit a custom event
emitEvent('gumshoeDeactivate', li, {
link: items.nav,
content: items.content,
settings: settings
});
};
/**
* Activate parent navs in a nested navigation
* @param {Node} nav The starting navigation element
* @param {Object} settings The settings for this instantiation
*/
var activateNested = function (nav, settings) {
// If nesting isn't activated, bail
if (!settings.nested) return;
// Get the parent navigation
var li = nav.parentNode.closest('li');
if (!li) return;
// Add the active class
li.classList.add(settings.nestedClass);
// Apply recursively to any parent navigation elements
activateNested(li, settings);
};
/**
* Activate a nav and content area
* @param {Object} items The nav item and content to activate
* @param {Object} settings The settings for this instantiation
*/
var activate = function (items, settings) {
// Make sure their are items to activate
if (!items) return;
// Get the parent list item
var li = items.nav.closest('li');
if (!li) return;
// Add the active class to the nav and content
li.classList.add(settings.navClass);
items.content.classList.add(settings.contentClass);
// Activate any parent navs in a nested navigation
activateNested(li, settings);
// Emit a custom event
emitEvent('gumshoeActivate', li, {
link: items.nav,
content: items.content,
settings: settings
});
};
/**
* Create the Constructor object
* @param {String} selector The selector to use for navigation items
* @param {Object} options User options and settings
*/
var Constructor = function (selector, options) {
//
// Variables
//
var publicAPIs = {};
var navItems, contents, current, timeout, settings;
//
// Methods
//
/**
* Set variables from DOM elements
*/
publicAPIs.setup = function () {
// Get all nav items
navItems = document.querySelectorAll(selector);
// Create contents array
contents = [];
// Loop through each item, get it's matching content, and push to the array
Array.prototype.forEach.call(navItems, (function (item) {
// Get the content for the nav item
var content = document.getElementById(decodeURIComponent(item.hash.substr(1)));
if (!content) return;
// Push to the contents array
contents.push({
nav: item,
content: content
});
}));
// Sort contents by the order they appear in the DOM
sortContents(contents);
};
/**
* Detect which content is currently active
*/
publicAPIs.detect = function () {
// Get the active content
var active = getActive(contents, settings);
// if there's no active content, deactivate and bail
if (!active) {
if (current) {
deactivate(current, settings);
current = null;
}
return;
}
// If the active content is the one currently active, do nothing
if (current && active.content === current.content) return;
// Deactivate the current content and activate the new content
deactivate(current, settings);
activate(active, settings);
// Update the currently active content
current = active;
};
/**
* Detect the active content on scroll
* Debounced for performance
*/
var scrollHandler = function (event) {
// If there's a timer, cancel it
if (timeout) {
window.cancelAnimationFrame(timeout);
}
// Setup debounce callback
timeout = window.requestAnimationFrame(publicAPIs.detect);
};
/**
* Update content sorting on resize
* Debounced for performance
*/
var resizeHandler = function (event) {
// If there's a timer, cancel it
if (timeout) {
window.cancelAnimationFrame(timeout);
}
// Setup debounce callback
timeout = window.requestAnimationFrame((function () {
sortContents(contents);
publicAPIs.detect();
}));
};
/**
* Destroy the current instantiation
*/
publicAPIs.destroy = function () {
// Undo DOM changes
if (current) {
deactivate(current, settings);
}
// Remove event listeners
window.removeEventListener('scroll', scrollHandler, false);
if (settings.reflow) {
window.removeEventListener('resize', resizeHandler, false);
}
// Reset variables
contents = null;
navItems = null;
current = null;
timeout = null;
settings = null;
};
/**
* Initialize the current instantiation
*/
var init = function () {
// Merge user options into defaults
settings = extend(defaults, options || {});
// Setup variables based on the current DOM
publicAPIs.setup();
// Find the currently active content
publicAPIs.detect();
// Setup event listeners
window.addEventListener('scroll', scrollHandler, false);
if (settings.reflow) {
window.addEventListener('resize', resizeHandler, false);
}
};
//
// Initialize and return the public APIs
//
init();
return publicAPIs;
};
//
// Return the Constructor
//
return Constructor;
}));

515
fet2020/static/js/prism-autoloader@1.25.0.js
View File

@@ -1,515 +0,0 @@
(function () {
if (typeof Prism === 'undefined' || typeof document === 'undefined') {
return;
}
/* eslint-disable */
/**
* The dependencies map is built automatically with gulp.
*
* @type {Object<string, string | string[]>}
*/
var lang_dependencies = /*dependencies_placeholder[*/{
"javascript": "clike",
"actionscript": "javascript",
"apex": [
"clike",
"sql"
],
"arduino": "cpp",
"aspnet": [
"markup",
"csharp"
],
"birb": "clike",
"bison": "c",
"c": "clike",
"csharp": "clike",
"cpp": "c",
"cfscript": "clike",
"chaiscript": [
"clike",
"cpp"
],
"coffeescript": "javascript",
"crystal": "ruby",
"css-extras": "css",
"d": "clike",
"dart": "clike",
"django": "markup-templating",
"ejs": [
"javascript",
"markup-templating"
],
"etlua": [
"lua",
"markup-templating"
],
"erb": [
"ruby",
"markup-templating"
],
"fsharp": "clike",
"firestore-security-rules": "clike",
"flow": "javascript",
"ftl": "markup-templating",
"gml": "clike",
"glsl": "c",
"go": "clike",
"groovy": "clike",
"haml": "ruby",
"handlebars": "markup-templating",
"haxe": "clike",
"hlsl": "c",
"idris": "haskell",
"java": "clike",
"javadoc": [
"markup",
"java",
"javadoclike"
],
"jolie": "clike",
"jsdoc": [
"javascript",
"javadoclike",
"typescript"
],
"js-extras": "javascript",
"json5": "json",
"jsonp": "json",
"js-templates": "javascript",
"kotlin": "clike",
"latte": [
"clike",
"markup-templating",
"php"
],
"less": "css",
"lilypond": "scheme",
"liquid": "markup-templating",
"markdown": "markup",
"markup-templating": "markup",
"mongodb": "javascript",
"n4js": "javascript",
"objectivec": "c",
"opencl": "c",
"parser": "markup",
"php": "markup-templating",
"phpdoc": [
"php",
"javadoclike"
],
"php-extras": "php",
"plsql": "sql",
"processing": "clike",
"protobuf": "clike",
"pug": [
"markup",
"javascript"
],
"purebasic": "clike",
"purescript": "haskell",
"qsharp": "clike",
"qml": "javascript",
"qore": "clike",
"racket": "scheme",
"cshtml": [
"markup",
"csharp"
],
"jsx": [
"markup",
"javascript"
],
"tsx": [
"jsx",
"typescript"
],
"reason": "clike",
"ruby": "clike",
"sass": "css",
"scss": "css",
"scala": "java",
"shell-session": "bash",
"smarty": "markup-templating",
"solidity": "clike",
"soy": "markup-templating",
"sparql": "turtle",
"sqf": "clike",
"squirrel": "clike",
"t4-cs": [
"t4-templating",
"csharp"
],
"t4-vb": [
"t4-templating",
"vbnet"
],
"tap": "yaml",
"tt2": [
"clike",
"markup-templating"
],
"textile": "markup",
"twig": "markup",
"typescript": "javascript",
"v": "clike",
"vala": "clike",
"vbnet": "basic",
"velocity": "markup",
"wiki": "markup",
"xeora": "markup",
"xml-doc": "markup",
"xquery": "markup"
}/*]*/;
var lang_aliases = /*aliases_placeholder[*/{
"html": "markup",
"xml": "markup",
"svg": "markup",
"mathml": "markup",
"ssml": "markup",
"atom": "markup",
"rss": "markup",
"js": "javascript",
"g4": "antlr4",
"adoc": "asciidoc",
"avs": "avisynth",
"avdl": "avro-idl",
"shell": "bash",
"shortcode": "bbcode",
"rbnf": "bnf",
"oscript": "bsl",
"cs": "csharp",
"dotnet": "csharp",
"cfc": "cfscript",
"coffee": "coffeescript",
"conc": "concurnas",
"jinja2": "django",
"dns-zone": "dns-zone-file",
"dockerfile": "docker",
"gv": "dot",
"eta": "ejs",
"xlsx": "excel-formula",
"xls": "excel-formula",
"gamemakerlanguage": "gml",
"gni": "gn",
"hbs": "handlebars",
"hs": "haskell",
"idr": "idris",
"gitignore": "ignore",
"hgignore": "ignore",
"npmignore": "ignore",
"webmanifest": "json",
"kt": "kotlin",
"kts": "kotlin",
"kum": "kumir",
"tex": "latex",
"context": "latex",
"ly": "lilypond",
"emacs": "lisp",
"elisp": "lisp",
"emacs-lisp": "lisp",
"md": "markdown",
"moon": "moonscript",
"n4jsd": "n4js",
"nani": "naniscript",
"objc": "objectivec",
"qasm": "openqasm",
"objectpascal": "pascal",
"px": "pcaxis",
"pcode": "peoplecode",
"pq": "powerquery",
"mscript": "powerquery",
"pbfasm": "purebasic",
"purs": "purescript",
"py": "python",
"qs": "qsharp",
"rkt": "racket",
"razor": "cshtml",
"rpy": "renpy",
"robot": "robotframework",
"rb": "ruby",
"sh-session": "shell-session",
"shellsession": "shell-session",
"smlnj": "sml",
"sol": "solidity",
"sln": "solution-file",
"rq": "sparql",
"t4": "t4-cs",
"trig": "turtle",
"ts": "typescript",
"tsconfig": "typoscript",
"uscript": "unrealscript",
"uc": "unrealscript",
"url": "uri",
"vb": "visual-basic",
"vba": "visual-basic",
"mathematica": "wolfram",
"nb": "wolfram",
"wl": "wolfram",
"xeoracube": "xeora",
"yml": "yaml"
}/*]*/;
/* eslint-enable */
/**
* @typedef LangDataItem
* @property {{ success?: () => void, error?: () => void }[]} callbacks
* @property {boolean} [error]
* @property {boolean} [loading]
*/
/** @type {Object<string, LangDataItem>} */
var lang_data = {};
var ignored_language = 'none';
var languages_path = 'components/';
var script = Prism.util.currentScript();
if (script) {
var autoloaderFile = /\bplugins\/autoloader\/prism-autoloader\.(?:min\.)?js(?:\?[^\r\n/]*)?$/i;
var prismFile = /(^|\/)[\w-]+\.(?:min\.)?js(?:\?[^\r\n/]*)?$/i;
var autoloaderPath = script.getAttribute('data-autoloader-path');
if (autoloaderPath != null) {
// data-autoloader-path is set, so just use it
languages_path = autoloaderPath.trim().replace(/\/?$/, '/');
} else {
var src = script.src;
if (autoloaderFile.test(src)) {
// the script is the original autoloader script in the usual Prism project structure
languages_path = src.replace(autoloaderFile, 'components/');
} else if (prismFile.test(src)) {
// the script is part of a bundle like a custom prism.js from the download page
languages_path = src.replace(prismFile, '$1components/');
}
}
}
var config = Prism.plugins.autoloader = {
languages_path: languages_path,
use_minified: true,
loadLanguages: loadLanguages
};
/**
* Lazily loads an external script.
*
* @param {string} src
* @param {() => void} [success]
* @param {() => void} [error]
*/
function addScript(src, success, error) {
var s = document.createElement('script');
s.src = src;
s.async = true;
s.onload = function () {
document.body.removeChild(s);
success && success();
};
s.onerror = function () {
document.body.removeChild(s);
error && error();
};
document.body.appendChild(s);
}
/**
* Returns all additional dependencies of the given element defined by the `data-dependencies` attribute.
*
* @param {Element} element
* @returns {string[]}
*/
function getDependencies(element) {
var deps = (element.getAttribute('data-dependencies') || '').trim();
if (!deps) {
var parent = element.parentElement;
if (parent && parent.tagName.toLowerCase() === 'pre') {
deps = (parent.getAttribute('data-dependencies') || '').trim();
}
}
return deps ? deps.split(/\s*,\s*/g) : [];
}
/**
* Returns whether the given language is currently loaded.
*
* @param {string} lang
* @returns {boolean}
*/
function isLoaded(lang) {
if (lang.indexOf('!') >= 0) {
// forced reload
return false;
}
lang = lang_aliases[lang] || lang; // resolve alias
if (lang in Prism.languages) {
// the given language is already loaded
return true;
}
// this will catch extensions like CSS extras that don't add a grammar to Prism.languages
var data = lang_data[lang];
return data && !data.error && data.loading === false;
}
/**
* Returns the path to a grammar, using the language_path and use_minified config keys.
*
* @param {string} lang
* @returns {string}
*/
function getLanguagePath(lang) {
return config.languages_path + 'prism-' + lang + (config.use_minified ? '.min' : '') + '.js';
}
/**
* Loads all given grammars concurrently.
*
* @param {string[]|string} languages
* @param {(languages: string[]) => void} [success]
* @param {(language: string) => void} [error] This callback will be invoked on the first language to fail.
*/
function loadLanguages(languages, success, error) {
if (typeof languages === 'string') {
languages = [languages];
}
var total = languages.length;
var completed = 0;
var failed = false;
if (total === 0) {
if (success) {
setTimeout(success, 0);
}
return;
}
function successCallback() {
if (failed) {
return;
}
completed++;
if (completed === total) {
success && success(languages);
}
}
languages.forEach(function (lang) {
loadLanguage(lang, successCallback, function () {
if (failed) {
return;
}
failed = true;
error && error(lang);
});
});
}
/**
* Loads a grammar with its dependencies.
*
* @param {string} lang
* @param {() => void} [success]
* @param {() => void} [error]
*/
function loadLanguage(lang, success, error) {
var force = lang.indexOf('!') >= 0;
lang = lang.replace('!', '');
lang = lang_aliases[lang] || lang;
function load() {
var data = lang_data[lang];
if (!data) {
data = lang_data[lang] = {
callbacks: []
};
}
data.callbacks.push({
success: success,
error: error
});
if (!force && isLoaded(lang)) {
// the language is already loaded and we aren't forced to reload
languageCallback(lang, 'success');
} else if (!force && data.error) {
// the language failed to load before and we don't reload
languageCallback(lang, 'error');
} else if (force || !data.loading) {
// the language isn't currently loading and/or we are forced to reload
data.loading = true;
data.error = false;
addScript(getLanguagePath(lang), function () {
data.loading = false;
languageCallback(lang, 'success');
}, function () {
data.loading = false;
data.error = true;
languageCallback(lang, 'error');
});
}
}
var dependencies = lang_dependencies[lang];
if (dependencies && dependencies.length) {
loadLanguages(dependencies, load, error);
} else {
load();
}
}
/**
* Runs all callbacks of the given type for the given language.
*
* @param {string} lang
* @param {"success" | "error"} type
*/
function languageCallback(lang, type) {
if (lang_data[lang]) {
var callbacks = lang_data[lang].callbacks;
for (var i = 0, l = callbacks.length; i < l; i++) {
var callback = callbacks[i][type];
if (callback) {
setTimeout(callback, 0);
}
}
callbacks.length = 0;
}
}
Prism.hooks.add('complete', function (env) {
var element = env.element;
var language = env.language;
if (!element || !language || language === ignored_language) {
return;
}
var deps = getDependencies(element);
if (/^diff-./i.test(language)) {
// the "diff-xxxx" format is used by the Diff Highlight plugin
deps.push('diff');
deps.push(language.substr('diff-'.length));
} else {
deps.push(language);
}
if (!deps.every(isLoaded)) {
// the language or some dependencies aren't loaded
loadLanguages(deps, function () {
Prism.highlightElement(element);
});
}
});
}());

1221
fet2020/static/js/prism-core@1.25.0.js
View File

File diff suppressed because it is too large Load Diff

21
fet2020/static/js/scripts.js
View File

@@ -1,8 +1,3 @@
// Open article on click without an anchor-tag.
function openArticle(link){
window.location.href=link;
}
if(cookieSet("InfoBoxHidden")){ if(cookieSet("InfoBoxHidden")){
let element = document.getElementById("infoBox"); let element = document.getElementById("infoBox");
element.classList.toggle("hidden"); element.classList.toggle("hidden");
@@ -31,24 +26,12 @@ function cookieSet(cname) {
let ca = decodedCookie.split(';'); let ca = decodedCookie.split(';');
for(let i = 0; i < ca.length; i++) { for(let i = 0; i < ca.length; i++) {
let c = ca[i]; let c = ca[i];
while (c.charAt(0) == ' ') { while (c.charAt(0) === ' ') {
c = c.substring(1); c = c.substring(1);
} }
if (c.indexOf(name) == 0) { if (c.indexOf(name) === 0) {
return true; return true;
} }
} }
return false; return false;
} }
var spy = new Gumshoe('#scrollspy-subNav a', {
/***** Scrollspy *****/ // Active classes
navClass: 'active', // applied to the nav list item
});
/***** SmoothScroll *****/ // All animations will take exactly 500ms
var scroll = new SmoothScroll('a[href*="#"]', {
speed: 750,
speedAsDuration: true,
easing: 'easeInOutQuad'
});

650
fet2020/static/js/smooth-scroll@16.1.2.js
View File

@@ -1,650 +0,0 @@
/*!
* smooth-scroll v16.1.2
* Animate scrolling to anchor links
* (c) 2020 Chris Ferdinandi
* MIT License
* http://github.com/cferdinandi/smooth-scroll
*/
(function (root, factory) {
if (typeof define === 'function' && define.amd) {
define([], (function () {
return factory(root);
}));
} else if (typeof exports === 'object') {
module.exports = factory(root);
} else {
root.SmoothScroll = factory(root);
}
})(typeof global !== 'undefined' ? global : typeof window !== 'undefined' ? window : this, (function (window) {
'use strict';
//
// Default settings
//
var defaults = {
// Selectors
ignore: '[data-scroll-ignore]',
header: null,
topOnEmptyHash: true,
// Speed & Duration
speed: 500,
speedAsDuration: false,
durationMax: null,
durationMin: null,
clip: true,
offset: 0,
// Easing
easing: 'easeInOutCubic',
customEasing: null,
// History
updateURL: true,
popstate: true,
// Custom Events
emitEvents: true
};
//
// Utility Methods
//
/**
* Check if browser supports required methods
* @return {Boolean} Returns true if all required methods are supported
*/
var supports = function () {
return (
'querySelector' in document &&
'addEventListener' in window &&
'requestAnimationFrame' in window &&
'closest' in window.Element.prototype
);
};
/**
* Merge two or more objects together.
* @param {Object} objects The objects to merge together
* @returns {Object} Merged values of defaults and options
*/
var extend = function () {
var merged = {};
Array.prototype.forEach.call(arguments, (function (obj) {
for (var key in obj) {
if (!obj.hasOwnProperty(key)) return;
merged[key] = obj[key];
}
}));
return merged;
};
/**
* Check to see if user prefers reduced motion
* @param {Object} settings Script settings
*/
var reduceMotion = function () {
if ('matchMedia' in window && window.matchMedia('(prefers-reduced-motion)').matches) {
return true;
}
return false;
};
/**
* Get the height of an element.
* @param {Node} elem The element to get the height of
* @return {Number} The element's height in pixels
*/
var getHeight = function (elem) {
return parseInt(window.getComputedStyle(elem).height, 10);
};
/**
* Escape special characters for use with querySelector
* @author Mathias Bynens
* @link https://github.com/mathiasbynens/CSS.escape
* @param {String} id The anchor ID to escape
*/
var escapeCharacters = function (id) {
// Remove leading hash
if (id.charAt(0) === '#') {
id = id.substr(1);
}
var string = String(id);
var length = string.length;
var index = -1;
var codeUnit;
var result = '';
var firstCodeUnit = string.charCodeAt(0);
while (++index < length) {
codeUnit = string.charCodeAt(index);
// Note: there’s no need to special-case astral symbols, surrogate
// pairs, or lone surrogates.
// If the character is NULL (U+0000), then throw an
// `InvalidCharacterError` exception and terminate these steps.
if (codeUnit === 0x0000) {
throw new InvalidCharacterError(
'Invalid character: the input contains U+0000.'
);
}
if (
// If the character is in the range [\1-\1F] (U+0001 to U+001F) or is
// U+007F, […]
(codeUnit >= 0x0001 && codeUnit <= 0x001F) || codeUnit == 0x007F ||
// If the character is the first character and is in the range [0-9]
// (U+0030 to U+0039), […]
(index === 0 && codeUnit >= 0x0030 && codeUnit <= 0x0039) ||
// If the character is the second character and is in the range [0-9]
// (U+0030 to U+0039) and the first character is a `-` (U+002D), […]
(
index === 1 &&
codeUnit >= 0x0030 && codeUnit <= 0x0039 &&
firstCodeUnit === 0x002D
)
) {
// http://dev.w3.org/csswg/cssom/#escape-a-character-as-code-point
result += '\\' + codeUnit.toString(16) + ' ';
continue;
}
// If the character is not handled by one of the above rules and is
// greater than or equal to U+0080, is `-` (U+002D) or `_` (U+005F), or
// is in one of the ranges [0-9] (U+0030 to U+0039), [A-Z] (U+0041 to
// U+005A), or [a-z] (U+0061 to U+007A), […]
if (
codeUnit >= 0x0080 ||
codeUnit === 0x002D ||
codeUnit === 0x005F ||
codeUnit >= 0x0030 && codeUnit <= 0x0039 ||
codeUnit >= 0x0041 && codeUnit <= 0x005A ||
codeUnit >= 0x0061 && codeUnit <= 0x007A
) {
// the character itself
result += string.charAt(index);
continue;
}
// Otherwise, the escaped character.
// http://dev.w3.org/csswg/cssom/#escape-a-character
result += '\\' + string.charAt(index);
}
// Return sanitized hash
return '#' + result;
};
/**
* Calculate the easing pattern
* @link https://gist.github.com/gre/1650294
* @param {String} type Easing pattern
* @param {Number} time Time animation should take to complete
* @returns {Number}
*/
var easingPattern = function (settings, time) {
var pattern;
// Default Easing Patterns
if (settings.easing === 'easeInQuad') pattern = time * time; // accelerating from zero velocity
if (settings.easing === 'easeOutQuad') pattern = time * (2 - time); // decelerating to zero velocity
if (settings.easing === 'easeInOutQuad') pattern = time < 0.5 ? 2 * time * time : -1 + (4 - 2 * time) * time; // acceleration until halfway, then deceleration
if (settings.easing === 'easeInCubic') pattern = time * time * time; // accelerating from zero velocity
if (settings.easing === 'easeOutCubic') pattern = (--time) * time * time + 1; // decelerating to zero velocity
if (settings.easing === 'easeInOutCubic') pattern = time < 0.5 ? 4 * time * time * time : (time - 1) * (2 * time - 2) * (2 * time - 2) + 1; // acceleration until halfway, then deceleration
if (settings.easing === 'easeInQuart') pattern = time * time * time * time; // accelerating from zero velocity
if (settings.easing === 'easeOutQuart') pattern = 1 - (--time) * time * time * time; // decelerating to zero velocity
if (settings.easing === 'easeInOutQuart') pattern = time < 0.5 ? 8 * time * time * time * time : 1 - 8 * (--time) * time * time * time; // acceleration until halfway, then deceleration
if (settings.easing === 'easeInQuint') pattern = time * time * time * time * time; // accelerating from zero velocity
if (settings.easing === 'easeOutQuint') pattern = 1 + (--time) * time * time * time * time; // decelerating to zero velocity
if (settings.easing === 'easeInOutQuint') pattern = time < 0.5 ? 16 * time * time * time * time * time : 1 + 16 * (--time) * time * time * time * time; // acceleration until halfway, then deceleration
// Custom Easing Patterns
if (!!settings.customEasing) pattern = settings.customEasing(time);
return pattern || time; // no easing, no acceleration
};
/**
* Determine the document's height
* @returns {Number}
*/
var getDocumentHeight = function () {
return Math.max(
document.body.scrollHeight, document.documentElement.scrollHeight,
document.body.offsetHeight, document.documentElement.offsetHeight,
document.body.clientHeight, document.documentElement.clientHeight
);
};
/**
* Calculate how far to scroll
* Clip support added by robjtede - https://github.com/cferdinandi/smooth-scroll/issues/405
* @param {Element} anchor The anchor element to scroll to
* @param {Number} headerHeight Height of a fixed header, if any
* @param {Number} offset Number of pixels by which to offset scroll
* @param {Boolean} clip If true, adjust scroll distance to prevent abrupt stops near the bottom of the page
* @returns {Number}
*/
var getEndLocation = function (anchor, headerHeight, offset, clip) {
var location = 0;
if (anchor.offsetParent) {
do {
location += anchor.offsetTop;
anchor = anchor.offsetParent;
} while (anchor);
}
location = Math.max(location - headerHeight - offset, 0);
if (clip) {
location = Math.min(location, getDocumentHeight() - window.innerHeight);
}
return location;
};
/**
* Get the height of the fixed header
* @param {Node} header The header
* @return {Number} The height of the header
*/
var getHeaderHeight = function (header) {
return !header ? 0 : (getHeight(header) + header.offsetTop);
};
/**
* Calculate the speed to use for the animation
* @param {Number} distance The distance to travel
* @param {Object} settings The plugin settings
* @return {Number} How fast to animate
*/
var getSpeed = function (distance, settings) {
var speed = settings.speedAsDuration ? settings.speed : Math.abs(distance / 1000 * settings.speed);
if (settings.durationMax && speed > settings.durationMax) return settings.durationMax;
if (settings.durationMin && speed < settings.durationMin) return settings.durationMin;
return parseInt(speed, 10);
};
var setHistory = function (options) {
// Make sure this should run
if (!history.replaceState || !options.updateURL || history.state) return;
// Get the hash to use
var hash = window.location.hash;
hash = hash ? hash : '';
// Set a default history
history.replaceState(
{
smoothScroll: JSON.stringify(options),
anchor: hash ? hash : window.pageYOffset
},
document.title,
hash ? hash : window.location.href
);
};
/**
* Update the URL
* @param {Node} anchor The anchor that was scrolled to
* @param {Boolean} isNum If true, anchor is a number
* @param {Object} options Settings for Smooth Scroll
*/
var updateURL = function (anchor, isNum, options) {
// Bail if the anchor is a number
if (isNum) return;
// Verify that pushState is supported and the updateURL option is enabled
if (!history.pushState || !options.updateURL) return;
// Update URL
history.pushState(
{
smoothScroll: JSON.stringify(options),
anchor: anchor.id
},
document.title,
anchor === document.documentElement ? '#top' : '#' + anchor.id
);
};
/**
* Bring the anchored element into focus
* @param {Node} anchor The anchor element
* @param {Number} endLocation The end location to scroll to
* @param {Boolean} isNum If true, scroll is to a position rather than an element
*/
var adjustFocus = function (anchor, endLocation, isNum) {
// Is scrolling to top of page, blur
if (anchor === 0) {
document.body.focus();
}
// Don't run if scrolling to a number on the page
if (isNum) return;
// Otherwise, bring anchor element into focus
anchor.focus();
if (document.activeElement !== anchor) {
anchor.setAttribute('tabindex', '-1');
anchor.focus();
anchor.style.outline = 'none';
}
window.scrollTo(0 , endLocation);
};
/**
* Emit a custom event
* @param {String} type The event type
* @param {Object} options The settings object
* @param {Node} anchor The anchor element
* @param {Node} toggle The toggle element
*/
var emitEvent = function (type, options, anchor, toggle) {
if (!options.emitEvents || typeof window.CustomEvent !== 'function') return;
var event = new CustomEvent(type, {
bubbles: true,
detail: {
anchor: anchor,
toggle: toggle
}
});
document.dispatchEvent(event);
};
//
// SmoothScroll Constructor
//
var SmoothScroll = function (selector, options) {
//
// Variables
//
var smoothScroll = {}; // Object for public APIs
var settings, anchor, toggle, fixedHeader, eventTimeout, animationInterval;
//
// Methods
//
/**
* Cancel a scroll-in-progress
*/
smoothScroll.cancelScroll = function (noEvent) {
cancelAnimationFrame(animationInterval);
animationInterval = null;
if (noEvent) return;
emitEvent('scrollCancel', settings);
};
/**
* Start/stop the scrolling animation
* @param {Node|Number} anchor The element or position to scroll to
* @param {Element} toggle The element that toggled the scroll event
* @param {Object} options
*/
smoothScroll.animateScroll = function (anchor, toggle, options) {
// Cancel any in progress scrolls
smoothScroll.cancelScroll();
// Local settings
var _settings = extend(settings || defaults, options || {}); // Merge user options with defaults
// Selectors and variables
var isNum = Object.prototype.toString.call(anchor) === '[object Number]' ? true : false;
var anchorElem = isNum || !anchor.tagName ? null : anchor;
if (!isNum && !anchorElem) return;
var startLocation = window.pageYOffset; // Current location on the page
if (_settings.header && !fixedHeader) {
// Get the fixed header if not already set
fixedHeader = document.querySelector(_settings.header);
}
var headerHeight = getHeaderHeight(fixedHeader);
var endLocation = isNum ? anchor : getEndLocation(anchorElem, headerHeight, parseInt((typeof _settings.offset === 'function' ? _settings.offset(anchor, toggle) : _settings.offset), 10), _settings.clip); // Location to scroll to
var distance = endLocation - startLocation; // distance to travel
var documentHeight = getDocumentHeight();
var timeLapsed = 0;
var speed = getSpeed(distance, _settings);
var start, percentage, position;
/**
* Stop the scroll animation when it reaches its target (or the bottom/top of page)
* @param {Number} position Current position on the page
* @param {Number} endLocation Scroll to location
* @param {Number} animationInterval How much to scroll on this loop
*/
var stopAnimateScroll = function (position, endLocation) {
// Get the current location
var currentLocation = window.pageYOffset;
// Check if the end location has been reached yet (or we've hit the end of the document)
if (position == endLocation || currentLocation == endLocation || ((startLocation < endLocation && window.innerHeight + currentLocation) >= documentHeight)) {
// Clear the animation timer
smoothScroll.cancelScroll(true);
// Bring the anchored element into focus
adjustFocus(anchor, endLocation, isNum);
// Emit a custom event
emitEvent('scrollStop', _settings, anchor, toggle);
// Reset start
start = null;
animationInterval = null;
return true;
}
};
/**
* Loop scrolling animation
*/
var loopAnimateScroll = function (timestamp) {
if (!start) { start = timestamp; }
timeLapsed += timestamp - start;
percentage = speed === 0 ? 0 : (timeLapsed / speed);
percentage = (percentage > 1) ? 1 : percentage;
position = startLocation + (distance * easingPattern(_settings, percentage));
window.scrollTo(0, Math.floor(position));
if (!stopAnimateScroll(position, endLocation)) {
animationInterval = window.requestAnimationFrame(loopAnimateScroll);
start = timestamp;
}
};
/**
* Reset position to fix weird iOS bug
* @link https://github.com/cferdinandi/smooth-scroll/issues/45
*/
if (window.pageYOffset === 0) {
window.scrollTo(0, 0);
}
// Update the URL
updateURL(anchor, isNum, _settings);
// If the user prefers reduced motion, jump to location
if (reduceMotion()) {
window.scrollTo(0, Math.floor(endLocation));
return;
}
// Emit a custom event
emitEvent('scrollStart', _settings, anchor, toggle);
// Start scrolling animation
smoothScroll.cancelScroll(true);
window.requestAnimationFrame(loopAnimateScroll);
};
/**
* If smooth scroll element clicked, animate scroll
*/
var clickHandler = function (event) {
// Don't run if event was canceled but still bubbled up
// By @mgreter - https://github.com/cferdinandi/smooth-scroll/pull/462/
if (event.defaultPrevented) return;
// Don't run if right-click or command/control + click or shift + click
if (event.button !== 0 || event.metaKey || event.ctrlKey || event.shiftKey) return;
// Check if event.target has closest() method
// By @totegi - https://github.com/cferdinandi/smooth-scroll/pull/401/
if (!('closest' in event.target)) return;
// Check if a smooth scroll link was clicked
toggle = event.target.closest(selector);
if (!toggle || toggle.tagName.toLowerCase() !== 'a' || event.target.closest(settings.ignore)) return;
// Only run if link is an anchor and points to the current page
if (toggle.hostname !== window.location.hostname || toggle.pathname !== window.location.pathname || !/#/.test(toggle.href)) return;
// Get an escaped version of the hash
var hash;
try {
hash = escapeCharacters(decodeURIComponent(toggle.hash));
} catch(e) {
hash = escapeCharacters(toggle.hash);
}
// Get the anchored element
var anchor;
if (hash === '#') {
if (!settings.topOnEmptyHash) return;
anchor = document.documentElement;
} else {
anchor = document.querySelector(hash);
}
anchor = !anchor && hash === '#top' ? document.documentElement : anchor;
// If anchored element exists, scroll to it
if (!anchor) return;
event.preventDefault();
setHistory(settings);
smoothScroll.animateScroll(anchor, toggle);
};
/**
* Animate scroll on popstate events
*/
var popstateHandler = function (event) {
// Stop if history.state doesn't exist (ex. if clicking on a broken anchor link).
// fixes `Cannot read property 'smoothScroll' of null` error getting thrown.
if (history.state === null) return;
// Only run if state is a popstate record for this instantiation
if (!history.state.smoothScroll || history.state.smoothScroll !== JSON.stringify(settings)) return;
// Only run if state includes an anchor
// if (!history.state.anchor && history.state.anchor !== 0) return;
// Get the anchor
var anchor = history.state.anchor;
if (typeof anchor === 'string' && anchor) {
anchor = document.querySelector(escapeCharacters(history.state.anchor));
if (!anchor) return;
}
// Animate scroll to anchor link
smoothScroll.animateScroll(anchor, null, {updateURL: false});
};
/**
* Destroy the current initialization.
*/
smoothScroll.destroy = function () {
// If plugin isn't already initialized, stop
if (!settings) return;
// Remove event listeners
document.removeEventListener('click', clickHandler, false);
window.removeEventListener('popstate', popstateHandler, false);
// Cancel any scrolls-in-progress
smoothScroll.cancelScroll();
// Reset variables
settings = null;
anchor = null;
toggle = null;
fixedHeader = null;
eventTimeout = null;
animationInterval = null;
};
/**
* Initialize Smooth Scroll
* @param {Object} options User settings
*/
var init = function () {
// feature test
if (!supports()) throw 'Smooth Scroll: This browser does not support the required JavaScript methods and browser APIs.';
// Destroy any existing initializations
smoothScroll.destroy();
// Selectors and variables
settings = extend(defaults, options || {}); // Merge user options with defaults
fixedHeader = settings.header ? document.querySelector(settings.header) : null; // Get the fixed header
// When a toggle is clicked, run the click handler
document.addEventListener('click', clickHandler, false);
// If updateURL and popState are enabled, listen for pop events
if (settings.updateURL && settings.popstate) {
window.addEventListener('popstate', popstateHandler, false);
}
};
//
// Initialize plugin
//
init();
//
// Public APIs
//
return smoothScroll;
};
return SmoothScroll;
}));

6776
fet2020/static/js/vendor.js
View File

File diff suppressed because it is too large Load Diff

21
fet2020/templates/404.html
View File

@@ -5,12 +5,17 @@
{% block title %}Fehler 404{% endblock %} {% block title %}Fehler 404{% endblock %}
{% block content %} {% block content %}
<!-- Main Content --> <!-- Main Content -->
<main class="container mx-auto w-full px-4 my-8 flex-1"> <main class="container mx-auto w-full px-4 my-8 flex-1">
<h1 class="page-title">Fehler 404 - Seite nicht gefunden</h1> <section class="w-full text-center">
<small class="text-lg font-semibold text-proprietary dark:text-proprietary-lighter">404</small>
<section class="flex justify-center items-center"> <h1 class="mt-4 text-3xl font-bold tracking-tight text-gray-900 dark:text-gray-100 sm:text-4xl xl:text-5xl">Seite nicht gefunden</h1>
<img src="{% static 'img/404.svg' %}" alt="" class="h-64 text-proprietary"> <img src="{% static 'img/404.svg' %}" alt="" class="mt-16 mx-auto h-64 text-proprietary">
</section> <p class="mt-6 text-base leading-7 text-proprietary dark:text-sky-600">Die angeforderte Seite konnte leider nicht gefunden werden.</p>
</main> <div class="mt-10 flex items-center justify-center gap-x-6">
<a href="{% url 'posts:index' %}" type="submit" class="block btn btn-primary">News</a>
<a href="{% url 'members:index' %}" class="text-sm font-semibold text-gray-900">Über uns <span aria-hidden="true">&rarr;</span></a>
</div>
</section>
</main>
{% endblock %} {% endblock %}

124
fet2020/templates/base.html
View File

@@ -3,7 +3,7 @@
{% load version %} {% load version %}
<!DOCTYPE html> <!DOCTYPE html>
<html lang="de"> <html lang="de" x-data="bodyData" x-bind="documentRoot">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
@@ -19,16 +19,15 @@
<meta name="theme-color" content="#006599"> <meta name="theme-color" content="#006599">
<link rel="apple-touch-icon" sizes="180x180" href="{% static 'img/favicons/apple-touch-icon.png' %}"> <link rel="apple-touch-icon" sizes="180x180" href="{% static 'img/favicons/apple-touch-icon.png' %}">
<link rel="icon" type="image/png" sizes="32x32" href="{% static 'img/favicons/favicon-32x32.png' %}"> <!-- <link rel="icon" type="image/png" sizes="32x32" href="{% static 'img/favicons/favicon-32x32.png' %}"> -->
<!--<link rel="icon" type="image/png" sizes="16x16" href="{% static 'img/favicons/favicon-16x16.png' %}">--> <!-- <link rel="icon" type="image/png" sizes="16x16" href="{% static 'img/favicons/favicon-16x16.png' %}"> -->
<link rel="icon" type="image/png" sizes="16x16" href="{% static 'img/fet_logo_white.png' %}"> <link rel="icon" type="image/png" sizes="16x16" href="{% static 'img/fet_logo_white.png' %}">
<link rel="manifest" href="{% static 'img/favicons/site.webmanifest' %}"> <link rel="manifest" href="{% static 'img/favicons/site.webmanifest' %}">
<link rel="mask-icon" href="{% static 'img/favicons/safari-pinned-tab.svg' %}" color="#000000"> <link rel="mask-icon" href="{% static 'img/favicons/safari-pinned-tab.svg' %}" color="#006599">
<link rel="shortcut icon" href="{% static 'img/fet_logo_white.png' %}"> <link rel="shortcut icon" href="{% static 'img/fet_logo_white.png' %}">
<meta name="apple-mobile-web-app-title" content="FET - Fachschaft Elektrotechnik"> <meta name="apple-mobile-web-app-title" content="FET - Fachschaft Elektrotechnik">
<meta name="application-name" content="FET - Fachschaft Elektrotechnik"> <meta name="application-name" content="FET - Fachschaft Elektrotechnik">
<meta name="msapplication-TileColor" content="#ffffff"> <meta name="msapplication-TileColor" content="#2b5797">
<meta name="theme-color" content="#ffffff">
<link rel="stylesheet" href="{% static 'css/flowbite@1.5.5.css' %}" type="text/css"> <link rel="stylesheet" href="{% static 'css/flowbite@1.5.5.css' %}" type="text/css">
@@ -56,11 +55,12 @@
{% endblock %} {% endblock %}
</head> </head>
<body x-data="search" x-ref="overflow" @keyup.escape="closeShowSearch"> <body x-bind="documentBody">
{% if request.user.is_authenticated %} {% if request.user.is_authenticated %}
<!-- SEARCH-BAR --> <!-- SEARCH-BAR -->
<div class="fixed w-screen h-screen z-30 backdrop-blur-sm backdrop-saturate-50" <div class="fixed w-screen h-screen z-30 backdrop-blur-sm backdrop-saturate-50"
x-show="showSearch" x-show="showSearch"
x-cloak
x-transition:enter="transition ease-out duration-300" x-transition:enter="transition ease-out duration-300"
x-transition:enter-start="transform backdrop-blur-none backdrop-saturate-100" x-transition:enter-start="transform backdrop-blur-none backdrop-saturate-100"
x-transition:enter-end="transform backdrop-blur-sm backdrop-saturate-50" x-transition:enter-end="transform backdrop-blur-sm backdrop-saturate-50"
@@ -68,8 +68,7 @@
x-transition:leave-start="transform backdrop-blur-sm backdrop-saturate-50" x-transition:leave-start="transform backdrop-blur-sm backdrop-saturate-50"
x-transition:leave-end="transform backdrop-blur-none backdrop-saturate-100" 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" <form action="{% url 'search:index' %}" @click.outside="closeSearch" 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-show="showSearch"
x-transition:enter="transition transform ease-out duration-300" x-transition:enter="transition transform ease-out duration-300"
x-transition:enter-start="scale-0 opacity-0" x-transition:enter-start="scale-0 opacity-0"
@@ -78,7 +77,7 @@
x-transition:leave-start="scale-100 opacity-90" x-transition:leave-start="scale-100 opacity-90"
x-transition:leave-end="scale-0 opacity-0" 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..." autofocus> <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"> <button type="submit" class="flex-none">
<i class="fa-solid fa-magnifying-glass text-gray-500 dark:text-gray-600"></i> <i class="fa-solid fa-magnifying-glass text-gray-500 dark:text-gray-600"></i>
</button> </button>
@@ -87,33 +86,25 @@
{% endif %} {% endif %}
<!-- NAVBAR --> <!-- NAVBAR -->
{% if not request.user.is_authenticated %} <nav class="navBar-md" x-data="navBar">
<nav class="navBar-md" x-data="myNavBar">
{% else %}
<nav class="navBar-lg" x-data="myNavBar">
{% endif %}
<div> <div>
{% if request.user.is_authenticated %} {% if request.user.is_authenticated %}
<button class="searchbar-toggle" <button class="searchbar-toggle"
@click.prevent="openShowSearch" @click="openSearch"
> >
<i class="fa-solid fa-magnifying-glass"></i> <i class="fa-solid fa-magnifying-glass"></i>
</button> </button>
{% endif %} {% endif %}
<a href="{% url 'home' %}"> <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_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"> <img src="{% static 'img/FET-Logo-2014_64_dark.svg' %}" alt="FET-Logo" class="navbar-logo p-2 hidden dark:block">
</a> </a>
<button class="navbar-toggle" <button class="navbar-toggle"
@click="toggleShowNavBar" @click="toggleNav"
> >
<i class="fa-solid fa-bars"></i> <i class="fa-solid fa-bars"></i>
</button> </button>
{% if not request.user.is_authenticated %} <ul id="navBarContent" class="navbar-content" x-bind="navBarContent" x-collapse.min.0px>
<ul id="navBarContent" class="navbar-content" x-show="getShowNavBarMd" x-collapse.min.0px>
{% else %}
<ul id="navBarContent" class="navbar-content" x-show="getShowNavBarLg" x-collapse.min.0px>
{% endif %}
<li class="{% if 'posts' in request.path %}active{% endif %}"><a href="{% url 'posts:index' %}">News</a></li> <li class="{% if 'posts' in request.path %}active{% endif %}"><a href="{% url 'posts:index' %}">News</a></li>
<li class="{% if 'members' in request.path %}active{% endif %}"><a href="{% url 'members:index' %}">Fachschaft</a></li> <li class="{% if 'members' in request.path %}active{% endif %}"><a href="{% url 'members:index' %}">Fachschaft</a></li>
<li class="{% if 'gallery' in request.path %}active{% endif %}"><a href="{% url 'gallery:index' %}">Galerie</a></li> <li class="{% if 'gallery' in request.path %}active{% endif %}"><a href="{% url 'gallery:index' %}">Galerie</a></li>
@@ -124,34 +115,33 @@
<li class="{% if '/kontakt/' in request.path %}active{% endif %}"><a href="{{ pages.first.url }}">{{ pages.first.title }}</a></li> <li class="{% if '/kontakt/' in request.path %}active{% endif %}"><a href="{{ pages.first.url }}">{{ pages.first.title }}</a></li>
{% endif %} {% endif %}
{% if request.user.is_authenticated %} <li class="relative visible-expandedOnly" x-bind="navBarThemeContent">
<li class="visible-expandedOnly"><button @click.prevent="openShowSearch"><span class="hidden md:inline"><i class="fa-solid fa-magnifying-glass"></i></span></button></li> <button class="relative" @click="toggleThemePopup">
{% endif %} <i x-show="isThemeLight" class="fa-solid fa-sun"></i>
<i x-show="isThemeDark" class="fa-solid fa-moon"></i>
<li class="visible-expandedOnly">
<button class="theme-toggle">
<span id="theme-icon-when-auto">
<i class="fa-solid fa-circle-half-stroke"></i>
</span>
<span id="theme-icon-when-dark">
<i class="fa-solid fa-moon"></i>
</span>
<span id="theme-icon-when-light">
<i class="fa-solid fa-sun"></i>
</span>
</button> </button>
<ul id="expandedThemeSwitcher"
x-show="themePopupVisible"
@click="closeThemePopup"
@click.outside="closeThemePopup"
x-cloak
>
<li class="hover:bg-gray-200 dark:hover:bg-gray-600"><button class="!px-2 !py-1 !m-0 text-left" @click="setThemeLight">Light</button></li>
<li class="hover:bg-gray-200 dark:hover:bg-gray-600"><button class="!px-2 !py-1 !m-0 text-left" @click="setThemeDark">Dark</button></li>
<li class="hover:bg-gray-200 dark:hover:bg-gray-600"><button class="!px-2 !py-1 !m-0 text-left" @click="setThemeSystem">System</button></li>
</ul>
</li> </li>
{% if not request.user.is_authenticated %} {% if not request.user.is_authenticated %}
<li><a href="{% url 'authentications:login' %}?next={{ request.path }}">Anmelden</a></li> <li><a href="{% url 'authentications:login' %}?next={{ request.path }}"><span class="visible-collapsedOnly mr-2">Anmelden</span><i class="fa-solid fa-right-to-bracket"></i></a></li>
{% else %} {% else %}
<hr class="border-proprietary"> <hr class="border-proprietary">
<div href="#" class="navbar-subcontent" <div href="#" class="navbar-subcontent"
x-data="popupNav" @click.outside="closePopupNav"
@click.outside="closeShowPopupNav"
> >
<div class="navbar-subcontentButton"> <div class="navbar-subcontentButton">
<a class="rounded-l" href="#" <a class="rounded-l" href="#"
@click="toggleShowPopupNav" @click="togglePopupNav"
> >
{% if request.user.first_name %} {% if request.user.first_name %}
Hallo {{ request.user.first_name }} Hallo {{ request.user.first_name }}
@@ -162,7 +152,7 @@
<a class="rounded-r" href="{% url 'authentications:logout' %}?next={{ request.path }}"><i class="fa-solid fa-power-off"></i></a> <a class="rounded-r" href="{% url 'authentications:logout' %}?next={{ request.path }}"><i class="fa-solid fa-power-off"></i></a>
</div> </div>
<div class="navbar-subcontentList" <div class="navbar-subcontentList"
x-show="getNotShowPopupNavLg" x-bind="popupNavContentLg"
x-transition:enter="transition ease-out duration-300" x-transition:enter="transition ease-out duration-300"
x-transition:enter-start="transform origin-top opacity-0 scale-95" x-transition:enter-start="transform origin-top opacity-0 scale-95"
x-transition:enter-end="transform origin-top opacity-100 scale-100" x-transition:enter-end="transform origin-top opacity-100 scale-100"
@@ -178,11 +168,32 @@
<li class="navInternal"><a href="https://ticket.fet.at"><i class="fa-fw fa-solid fa-ticket mr-2"></i></i>Ticket</a></li> <li class="navInternal"><a href="https://ticket.fet.at"><i class="fa-fw fa-solid fa-ticket mr-2"></i></i>Ticket</a></li>
<li class="navInternal"><a href="https://legacy.fet.at/home/intern"><i class="fa-fw fa-solid fa-box-archive mr-2"></i>Legacy</a></li> <li class="navInternal"><a href="https://legacy.fet.at/home/intern"><i class="fa-fw fa-solid fa-box-archive mr-2"></i>Legacy</a></li>
<li class="navInternal" <li class="navInternal"
x-show="getNotScreenLg" x-show="showPopupNavLogout"
><a href="{% url 'authentications:logout' %}?next={{ request.path }}"><i class="fa-fw fa-solid fa-power-off mr-2"></i>Abmelden</a></li> ><a href="{% url 'authentications:logout' %}?next={{ request.path }}"><i class="fa-fw fa-solid fa-power-off mr-2"></i>Abmelden</a></li>
</div> </div>
</div> </div>
{% endif %} {% endif %}
{% if request.user.is_authenticated %}
<li class="visible-expandedOnly"><button @click="openSearch"><span class="hidden md:inline"><i class="fa-solid fa-magnifying-glass"></i></span></button></li>
{% endif %}
<li class="visible-collapsedOnly w-fit mx-auto py-1">
<div class="flex items-center">
<span class="mr-2">Theme:</span>
<ul id="mobileThemeSwitcher">
<li class="rounded" x-bind="navBarThemeContentLight">
<button class="!px-2 !py-0.5 !m-0 rounded-sm text-left bg-inherit" @click="setThemeLight">Light</button>
</li>
<li class="rounded" x-bind="navBarThemeContentDark">
<button class="!px-2 !py-0.5 !m-0 rounded-sm text-left bg-inherit" @click="setThemeDark">Dark</button>
</li>
<li class="rounded" x-bind="navBarThemeContentSystem">
<button class="!px-2 !py-0.5 !m-0 rounded-sm text-left bg-inherit" @click="setThemeSystem">System</button>
</li>
</ul>
</div>
</li>
</ul> </ul>
</div> </div>
</nav> </nav>
@@ -218,24 +229,13 @@
<p class="copyright">© {% now 'Y' %} FET - Alle Rechte vorbehalten.</p> <p class="copyright">© {% now 'Y' %} FET - Alle Rechte vorbehalten.</p>
<p class="text-center">{% version %}.</p> <p class="text-center">{% version %}.</p>
</footer> </footer>
<div class="super-duper-awesome-signature" x-data="counter"> <div class="super-duper-awesome-signature font-normal" x-data="footerCounter">
<span x-ref="countFour">Handcrafted </span> <span x-bind="footerFirst">Handcrafted </span><span x-bind="footerSecond">with </span><i class="fa-solid fa-heart" aria-label="love" @click="increase" x-bind="footerThird"></i><span x-bind="footerFourth"> by</span><span x-bind="footerFifth"> fet</span>
<span x-ref="countFive">with </span>
<i class="fa-solid fa-heart text-red-600 hover:text-red-700" aria-label="love" @click="increment" x-ref="countTwo"></i>
<span x-ref="countSix"> by</span>
<span class="font-normal" x-ref="countThree"> FET</span>
</div> </div>
<script src="{% static 'js/alpine-csp.js' %}"></script>
<script src="{% static 'js/dark-mode.js' %}"></script>
<script src="{% static 'js/flowbite@1.5.5.js' %}"></script> <script src="{% static 'js/flowbite@1.5.5.js' %}"></script>
<script src="{% static 'js/gumshoe@5.1.1.js' %}"></script> <script defer src="{% static 'js/vendor.js' %}"></script>
<script src="{% static 'js/smooth-scroll@16.1.2.js' %}"></script>
<script defer src="{% static 'js/scripts.js' %}"></script> <script defer src="{% static 'js/scripts.js' %}"></script>
<!-- Prism.js Code syntax highlighting -->
<script src="{% static 'js/prism-core@1.25.0.js' %}"></script>
<script src="{% static 'js/prism-autoloader@1.25.0.js' %}"></script>
</body> </body>
</html> </html>

1
fet2020/templates/gallery/index.html
View File

@@ -29,7 +29,6 @@
</a> </a>
{% endif %} {% endif %}
{% endfor %} {% endfor %}
</div> </div>
</main> </main>
{% endblock %} {% endblock %}

219
fet2020/templates/home.html
View File

@@ -3,135 +3,110 @@
{% load static %} {% load static %}
{% block content %} {% block content %}
<!--Hero section--> <!--Hero section-->
<section class="xl:h-[30rem] relative z-0 w-full h-56 sm:h-80 lg:h-96 bg-cover bg-center bg-no-repeat flex-none" style="background-image: url('{% static 'img/cover-image.jpeg' %}');"> <section class="xl:h-[30rem] relative z-0 w-full h-56 sm:h-80 lg:h-96 bg-cover bg-center bg-no-repeat flex-none" style="background-image: url('{% static 'img/cover-image.jpeg' %}');">
<div class="absolute z-10 w-full h-full bg-blue-50 dark:bg-black opacity-60"></div> <div class="absolute z-10 w-full h-full bg-blue-50 dark:bg-black opacity-60"></div>
<div class="relative container px-4 mx-auto z-20 w-full h-full flex flex-wrap items-center gap-x-2"> <div class="relative container px-4 mx-auto z-20 w-full h-full flex flex-wrap items-center gap-x-2">
<h1 class="w-3/5 flex-1 uppercase font-semibold text-xl sm:text-2xl lg:text-3xl text-center text-gray-900 dark:text-gray-100"> <div class="w-3/5 flex-1">
<span class="hidden">Willkommen bei der </span><span>Fachschaft</span><br> <h1 class="w-fit mx-auto uppercase font-semibold lg:font-bold text-xl sm:text-2xl lg:text-4xl text-center lg:bg-clip-text lg:text-transparent lg:bg-gradient-to-r lg:from-sky-500 lg:to-sky-900 lg:dark:from-sky-100 lg:dark:to-sky-400">
<span class="text-proprietary-darker dark:text-proprietary-lightest">Elektrotechnik</span> <span class="text-gray-900 dark:text-gray-100 lg:text-transparent">Fachschaft</span><br>
</h1> <span class="text-proprietary-darker dark:text-proprietary-lightest lg:text-transparent">Elektrotechnik</span>
</h1>
<div class="hidden sm:block flex-none w-2/5 lg:w-1/3 bg-white dark:bg-gray-800 p-2 lg:p-4 rounded shadow-xl dark:border-2 dark:border-gray-700"> </div>
<h2 class="section-title sm:text-left"><i class="fa-solid fa-comments text-gray-300 dark:text-gray-400 mr-2"></i>Events</h2> <div class="hidden sm:block flex-none w-2/5 lg:w-1/3 bg-white dark:bg-gray-800 p-2 lg:p-4 rounded shadow-xl dark:border-2 dark:border-gray-700">
<div class="-mb-2 text-gray-700 dark:text-gray-200 text-sm md:text-base"> <h2 class="section-title sm:text-left"><i class="fa-solid fa-comments text-gray-300 dark:text-gray-400 mr-2"></i>Events</h2>
{% if featured_event %} <div class="-mb-2 text-gray-700 dark:text-gray-200 text-sm md:text-base">
{% with post=featured_event %}
{% include 'posts/partials/_meeting_row.html' %}
{% endwith %}
{% endif %}
{% for post in featured_meeting %}
{% if post %}
{% include 'posts/partials/_meeting_row.html' %}
{% endif %}
{% endfor %}
</div>
</div>
</div>
</section>
<!-- Main Content -->
<main class="container mx-auto w-full px-4 my-8 flex-1">
{% if request.user.is_authenticated %}
<div data-dial-init class="fixed bottom-6 right-6 group">
<div id="speed-dial-menu-dropdown" class="flex hidden flex-col justify-end py-1 mb-4 space-y-2 bg-white rounded-lg border border-gray-100 shadow-sm dark:border-gray-600 dark:bg-gray-700">
<ul class="text-sm text-gray-500 dark:text-gray-300">
<li>
<a href="{% url 'posts:fetmeeting_create' %}" class="flex items-center py-2 px-5 hover:bg-gray-100 dark:hover:bg-gray-600 hover:text-gray-900 dark:hover:text-white">
<i class="fa-solid fa-plus mr-2"></i>
<span class="text-sm font-medium">Neue Fachschaftssitzung</span>
</a>
</li>
<li>
<a href="{% url 'finance:bill_create' %}" class="flex items-center py-2 px-5 hover:bg-gray-100 dark:hover:bg-gray-600 hover:text-gray-900 dark:hover:text-white">
<i class="fa-solid fa-plus mr-2"></i>
<span class="text-sm font-medium">Neue Rechnung einreichen</span>
</a>
</li>
<li>
<a href="{% url 'finance:bill_list' %}" class="flex items-center py-2 px-5 hover:bg-gray-100 dark:hover:bg-gray-600 hover:text-gray-900 dark:hover:text-white">
<i class="fa-solid fa-list mr-2"></i>
<span class="text-sm font-medium">Übersicht über alle von dir eingereichten Rechnungen</span>
</a>
</li>
</ul>
</div>
<button type="button" data-dial-toggle="speed-dial-menu-dropdown" aria-controls="speed-dial-menu-dropdown" aria-expanded="false" class="flex justify-center items-center ml-auto w-14 h-14 text-white bg-blue-700 rounded-full hover:bg-blue-800 dark:bg-blue-600 dark:hover:bg-blue-700 focus:ring-4 focus:ring-blue-300 focus:outline-none dark:focus:ring-blue-800">
<i class="fa-solid fa-pen-to-square"></i>
</button>
</div>
{% endif %}
<section class="sm:hidden">
<h2 class="section-title section-title-margins">Events</h2>
<div class="flex flex-col gap-4">
{% if featured_event %} {% if featured_event %}
{% with post=featured_event %} {% with post=featured_event %}
{% include 'posts/partials/_article_row.html' %} {% include 'posts/partials/_meeting_row.html' %}
{% endwith %} {% endwith %}
{% endif %} {% endif %}
{% for post in featured_meeting %} {% for post in featured_meeting %}
{% if post %} {% if post %}
{% include 'posts/partials/_article_row.html' %} {% include 'posts/partials/_meeting_row.html' %}
{% endif %} {% endif %}
{% endfor %} {% endfor %}
</div> </div>
</section>
<div class="sm:flex sm:flex-row-reverse justify-center">
<aside class="calendar-preview sm:w-2/5 xl:w-1/4 sm:pl-4 my-8 sm:my-0">
<div>
<h2 class="section-title section-title-margins">Kalender</h2>
<div class="calendar-entries">
{% for post in events %}
{% include 'posts/partials/_date_box.html' %}
{% endfor %}
<a href="{% url 'posts:calendar' %}" class="btn btn-secondary block w-full"><i class="fa-solid fa-calendar-days mr-2"></i>Kalender abonnieren</a>
</div>
</div>
</aside>
<section class="my-8 sm:my-0 sm:w-3/5 xl:w-2/5 flex flex-col gap-4">
<h2 class="section-title section-title-margins">Zuletzt veröffentlicht</h2>
{% if featured_post %}
{% with post=featured_post %}
{% include 'posts/partials/_posts_pinned.html' %}
{% endwith %}
{% endif %}
{% for post in posts %}
{% include 'posts/partials/_posts_hero.html' %}
{% endfor %}
<a href="{% url 'posts:index' %}" class="btn btn-primary block w-full"><i class="fa-solid fa-plus-square mr-2"></i>Mehr anzeigen</a>
</section>
</div>
<!--
<div id="infoBox" class="sticky bottom-4 mt-8 p-4 rounded-lg shadow-lg bg-gray-600 dark:bg-gray-800 text-gray-200 dark:text-gray-300 flex gap-x-4 items-center leading-none dark:border-2 dark:border-gray-700"
x-data="infoBox"
x-show="consent"
x-transition:leave="transition ease-in-out duration-500"
x-transition:leave-start="transform origin-bottom opacity-100 scale-100 translate-y-0"
x-transition:leave-end="transform origin-bottom opacity-0 scale-100 translate-y-14"
>
<div class="flex-none relative">
<span class="absolute flex h-3 w-3 right-0 top-0">
<span class="animate-ping absolute inline-flex h-full w-full rounded-full bg-sky-600 dark:bg-proprietary opacity-80"></span>
<span class="relative inline-flex rounded-full h-3 w-3 bg-sky-600 dark:bg-proprietary"></span>
</span>
<i class="fa-brands fa-discord text-4xl"></i>
</div>
<a href="{% url 'discord' %}" class="flex-1">
FET Discord-Server<br>
<span class="hidden lg:inline text-sm text-gray-300 dark:text-gray-400">Du hast Fragen zum Studium oder möchtest dich einfach mich anderen Studierenden austauschen? </span><span class="text-sm text-gray-300 dark:text-gray-400">Klicke hier zum Beitreten <span class="hidden sm:inline"><i class="fa-solid fa-angle-right"></i></span></span>
</a>
<button id="infoBox-closeButton" class="flex-none self-stretch px-2 -mr-2" onclick="hideInfoBox('m', 1)"
@click="closeBox"
><i class="fa-solid fa-xmark text-gray-300 dark:text-gray-500"></i></button>
</div> </div>
--> </div>
</main> </section>
<!-- Main Content -->
<main class="container mx-auto w-full px-4 my-8 flex-1">
{% if request.user.is_authenticated %}
<div data-dial-init class="fixed bottom-6 right-6 group">
<div id="speed-dial-menu-dropdown" class="flex hidden flex-col justify-end py-1 mb-4 space-y-2 bg-white rounded-lg border border-gray-100 shadow-sm dark:border-gray-600 dark:bg-gray-700">
<ul class="text-sm text-gray-500 dark:text-gray-300">
<li>
<a href="{% url 'posts:fetmeeting_create' %}" class="flex items-center py-2 px-5 hover:bg-gray-100 dark:hover:bg-gray-600 hover:text-gray-900 dark:hover:text-white">
<i class="fa-solid fa-plus mr-2"></i>
<span class="text-sm font-medium">Neue Fachschaftssitzung</span>
</a>
</li>
<li>
<a href="{% url 'finance:bill_create' %}" class="flex items-center py-2 px-5 hover:bg-gray-100 dark:hover:bg-gray-600 hover:text-gray-900 dark:hover:text-white">
<i class="fa-solid fa-plus mr-2"></i>
<span class="text-sm font-medium">Neue Rechnung einreichen</span>
</a>
</li>
<li>
<a href="{% url 'finance:bill_list' %}" class="flex items-center py-2 px-5 hover:bg-gray-100 dark:hover:bg-gray-600 hover:text-gray-900 dark:hover:text-white">
<i class="fa-solid fa-list mr-2"></i>
<span class="text-sm font-medium">Übersicht über alle von dir eingereichten Rechnungen</span>
</a>
</li>
</ul>
</div>
<button type="button" data-dial-toggle="speed-dial-menu-dropdown" aria-controls="speed-dial-menu-dropdown" aria-expanded="false" class="flex justify-center items-center ml-auto w-14 h-14 text-white bg-blue-700 rounded-full hover:bg-blue-800 dark:bg-blue-600 dark:hover:bg-blue-700 focus:ring-4 focus:ring-blue-300 focus:outline-none dark:focus:ring-blue-800">
<i class="fa-solid fa-pen-to-square"></i>
</button>
</div>
{% endif %}
<section class="sm:hidden">
<h2 class="section-title section-title-margins">Events</h2>
<div class="flex flex-col gap-4">
{% if featured_event %}
{% with post=featured_event %}
{% include 'posts/partials/_article_row.html' %}
{% endwith %}
{% endif %}
{% for post in featured_meeting %}
{% if post %}
{% include 'posts/partials/_article_row.html' %}
{% endif %}
{% endfor %}
</div>
</section>
<div class="sm:flex sm:flex-row-reverse justify-center">
<aside class="calendar-preview sm:w-2/5 xl:w-1/4 sm:pl-4 my-8 sm:my-0">
<div>
<h2 class="section-title section-title-margins">Kalender</h2>
<div class="calendar-entries">
{% for post in events %}
{% include 'posts/partials/_date_box.html' %}
{% endfor %}
<a href="{% url 'posts:calendar' %}" class="btn btn-secondary block w-full"><i class="fa-solid fa-calendar-days mr-2"></i>Kalender abonnieren</a>
</div>
</div>
</aside>
<section class="my-8 sm:my-0 sm:w-3/5 xl:w-2/5 flex flex-col gap-4">
<h2 class="section-title section-title-margins">Zuletzt veröffentlicht</h2>
{% if featured_post %}
{% with post=featured_post %}
{% include 'posts/partials/_posts_pinned.html' %}
{% endwith %}
{% endif %}
{% for post in posts %}
{% include 'posts/partials/_posts_hero.html' %}
{% endfor %}
<a href="{% url 'posts:index' %}" class="btn btn-primary block w-full"><i class="fa-solid fa-plus-square mr-2"></i>Mehr anzeigen</a>
</section>
</div>
</main>
{% endblock %} {% endblock %}

34
fet2020/templates/intern/index.html
View File

@@ -9,16 +9,16 @@
<div class="flex flex-col gap-y-4 max-w-prose mx-auto text-gray-700 dark:text-gray-300"> <div class="flex flex-col gap-y-4 max-w-prose mx-auto text-gray-700 dark:text-gray-300">
{% regroup topic by topic_group as topic_group_list %} {% regroup topic by topic_group as topic_group_list %}
{% for topic_group in topic_group_list %} {% for topic_group in topic_group_list %}
<section x-data="internExpandList"> <section x-data="toggleList" data-title="{{ topic_group.grouper.title }}">
<div class="flex gap-x-6"> <div class="flex gap-x-6">
<h2 class="text-lg font-medium text-gray-900 dark:text-gray-100 cursor-pointer" @click="toggleExpandList"> <h2 class="text-lg font-medium text-gray-900 dark:text-gray-100 cursor-pointer" @click="toggleItem">
<i class="fa-fw fa-solid fa-angle-right transition transform origin-center" <i class="fa-fw fa-solid fa-angle-right transition transform origin-center"
x-ref="rotate" x-bind="iconContent"
></i> ></i>
{{ topic_group.grouper.title }} {{ topic_group.grouper.title }}
</h2> </h2>
<button class="border border-gray-700 dark:border-gray-300 rounded px-1.5 text-sm hidden sm:block" <button class="border border-gray-700 dark:border-gray-300 rounded px-1.5 text-sm hidden sm:block"
x-show="getExpandList" x-show="expandList"
x-transition:enter="transition ease-out duration-300" x-transition:enter="transition ease-out duration-300"
x-transition:enter-start="transform origin-top opacity-0 -translate-x-6" x-transition:enter-start="transform origin-top opacity-0 -translate-x-6"
x-transition:enter-end="transform origin-top opacity-100 translate-x-0" x-transition:enter-end="transform origin-top opacity-100 translate-x-0"
@@ -27,7 +27,7 @@
x-transition:leave-end="transform origin-top opacity-0 -translate-x-6" x-transition:leave-end="transform origin-top opacity-0 -translate-x-6"
><a href="{% url 'intern:topic_create' topic_group.grouper.slug %}"><i class="fa-solid fa-plus mr-1"></i>Eintrag hinzufügen</a></button> ><a href="{% url 'intern:topic_create' topic_group.grouper.slug %}"><i class="fa-solid fa-plus mr-1"></i>Eintrag hinzufügen</a></button>
</div> </div>
<ul class="ml-7 w-fit" x-show="getExpandList" x-collapse> <ul class="ml-7 w-fit" x-show="expandList" x-collapse>
{% for topic in topic_group.list %} {% for topic in topic_group.list %}
<li><a href="{% url 'intern:topic' topic.topic_group.slug topic.slug %}" class="w-full py-1 inline-block">{{ topic.title }}</a></li> <li><a href="{% url 'intern:topic' topic.topic_group.slug topic.slug %}" class="w-full py-1 inline-block">{{ topic.title }}</a></li>
{% endfor %} {% endfor %}
@@ -41,11 +41,11 @@
{% endfor %} {% endfor %}
{% for topic_group in empty_topic_groups %} {% for topic_group in empty_topic_groups %}
<section x-data="internExpandList"> <section x-data="toggleList" data-title="{{ topic_group.title }}">
<div class="flex gap-x-6"> <div class="flex gap-x-6">
<h2 class="text-lg font-medium text-gray-900 dark:text-gray-100 cursor-pointer" @click="toggleExpandList"> <h2 class="text-lg font-medium text-gray-900 dark:text-gray-100 cursor-pointer" @click="toggleItem">
<i class="fa-fw fa-solid fa-angle-right transition transform origin-center" <i class="fa-fw fa-solid fa-angle-right transition transform origin-center"
xref="rotate" x-bind="iconContent"
></i> ></i>
{{ topic_group.title }} {{ topic_group.title }}
</h2> </h2>
@@ -59,7 +59,7 @@
x-transition:leave-end="transform origin-top opacity-0 -translate-x-6" x-transition:leave-end="transform origin-top opacity-0 -translate-x-6"
><a href="{% url 'intern:topic_create' topic_group.slug %}"><i class="fa-solid fa-plus mr-1"></i>Eintrag hinzufügen</a></button> ><a href="{% url 'intern:topic_create' topic_group.slug %}"><i class="fa-solid fa-plus mr-1"></i>Eintrag hinzufügen</a></button>
</div> </div>
<ul class="ml-7 w-fit" x-show="getExpandList" x-collapse> <ul class="ml-7 w-fit" x-show="expandList" x-collapse>
<li class="py-1"> <li class="py-1">
<a href="{% url 'intern:topic_create' topic_group.slug %}" class="border border-gray-700 dark:border-gray-300 rounded px-1.5 py-1 text-sm sm:hidden"> <a href="{% url 'intern:topic_create' topic_group.slug %}" class="border border-gray-700 dark:border-gray-300 rounded px-1.5 py-1 text-sm sm:hidden">
<i class="fa-solid fa-plus mr-1"></i>Eintrag hinzufügen <i class="fa-solid fa-plus mr-1"></i>Eintrag hinzufügen
@@ -70,19 +70,21 @@
{% endfor %} {% endfor %}
{% if archive_topic %} {% if archive_topic %}
<section x-data="internExpandList"> <section x-data="toggleList" data-title="archive">
<div class="flex gap-x-6"> <div class="flex gap-x-6">
<h2 class="text-lg font-medium text-gray-900 dark:text-gray-100 cursor-pointer" @click="toggleExpandList"> <h2 class="text-lg font-medium text-gray-900 dark:text-gray-100 cursor-pointer" @click="toggleItem">
<i class="fa-fw fa-solid fa-angle-right transition transform origin-center" <i class="fa-fw fa-solid fa-angle-right transition transform origin-center"
xref="rotate" x-bind="iconContent"
></i> ></i>
Archiv Archiv
</h2> </h2>
</div> </div>
<ul class="ml-7 w-fit" x-show="getExpandList" x-collapse> <ul class="ml-7 w-fit" x-show="expandList" x-collapse>
{% for topic in archive_topic %} <li class="py-1">
<li><a href="{% url 'intern:topic' topic.topic_group.slug topic.slug %}" class="w-full py-1 inline-block">{{ topic.title }}</a></li> {% for topic in archive_topic %}
{% endfor %} <li><a href="{% url 'intern:topic' topic.topic_group.slug topic.slug %}" class="w-full py-1 inline-block">{{ topic.title }}</a></li>
{% endfor %}
</li>
</ul> </ul>
</section> </section>
{% endif %} {% endif %}

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

@@ -6,104 +6,103 @@
{% load static %} {% load static %}
{% block content %} {% block content %}
<!-- Main Content --> <!-- Main Content -->
<main x-data="modal" class="container mx-auto w-full px-4 mt-8 flex-1"> <main class="container mx-auto w-full px-4 mt-8 flex-1">
<h1 class="page-title">Über uns</h1> <h1 class="page-title">Über uns</h1>
<div class="sm:flex sm:flex-row justify-center my-8"> <div class="sm:flex sm:flex-row justify-center my-8">
<aside class="flex-none max-w-min sm:mr-8"> <!-- Modal Content -->
<div class="fixed sm:sticky top-0 sm:top-4 left-0 w-full h-full sm:h-auto bg-black sm:bg-transparent bg-opacity-70 flex sm:block items-center justify-center" <aside class="flex-none max-w-min sm:mr-8">
x-show="getShowModal" <div class="fixed sm:sticky top-0 sm:top-4 left-0 w-full h-full sm:h-auto bg-black sm:bg-transparent bg-opacity-70 flex sm:block items-center justify-center"
x-transition:enter="transition duration-300 ease-out" x-bind="modalContent"
x-transition:enter-start="opacity-0" x-cloak
x-transition:enter-end="opacity-100" x-transition:enter="transition duration-300 ease-out"
x-transition:leave="transition duration-150 ease-in" x-transition:enter-start="opacity-0"
x-transition:leave-start="opacity-100" x-transition:enter-end="opacity-100"
x-transition:leave-end="opacity-0" x-transition:leave="transition duration-150 ease-in"
x-transition:leave-start="opacity-100"
x-transition:leave-end="opacity-0"
>
<div class="max-w-sm sm:w-full mx-4 sm:mx-0 p-4 sm:p-0 bg-white dark:bg-gray-700 sm:bg-transparent sm:dark:bg-transparent rounded sm:rounded-none"
@click.outside="toggleModal"
x-transition:enter="transition transform ease-out duration-300"
x-transition:enter-start="scale-110 opacity-0"
x-transition:enter-end="scale-100 opacity-100"
x-transition:leave="transition transform ease-in duration-150"
x-transition:leave-start="scale-100 opacity-100"
x-transition:leave-end="scale-110 opacity-0"
> >
<div class="max-w-sm sm:w-full mx-4 sm:mx-0 p-4 sm:p-0 bg-white dark:bg-gray-700 sm:bg-transparent rounded sm:rounded-none" <div class="flex justify-between items-center mb-2 sm:hidden">
@click.outside="toggle" <h2 class="text-gray-800 dark:text-gray-100 sm:section-title sm_section-title-margins sm:w-full">
x-show="getShowModal" <span class="mr-1 text-gray-400 sm:hidden">
x-transition:enter="transition transform ease-out duration-300" <i class="fa-solid fa-bars"></i>
x-transition:enter-start="scale-110 opacity-0" </span>
x-transition:enter-end="scale-100 opacity-100" Kategorien
x-transition:leave="transition transform ease-in duration-150" </h2>
x-transition:leave-start="scale-100 opacity-100" <div class="ml-4 -mr-2 px-2 rounded text-xl text-gray-600 dark:text-gray-400 sm:hidden cursor-pointer" @click="closeModal">
x-transition:leave-end="scale-110 opacity-0" <i class="fa-solid fa-xmark"></i>
>
<div class="flex justify-between items-center mb-2 sm:hidden">
<h2 class="text-gray-800 dark:text-gray-100 sm:section-title sm_section-title-margins sm:w-full">
<span class="mr-1 text-gray-400 sm:hidden">
<i class="fa-solid fa-bars"></i>
</span>
Kategorien
</h2>
<div class="ml-4 -mr-2 px-2 rounded text-xl text-gray-600 dark:text-gray-400 sm:hidden cursor-pointer" @click="closeModal">
<i class="fa-solid fa-xmark"></i>
</div>
</div> </div>
<ul class="sideBarNav"> </div>
{% get_jobs_sidebar request.resolver_match.kwargs.slug %} <ul class="sideBarNav">
{% get_jobs_sidebar request.resolver_match.kwargs.slug %}
<hr>
<hr class=""> <li class="{% if '/members/' == request.path %}active{% endif %}">
<a href="{% url 'members:index' %}">Fachschaft</a>
</li>
<li class="{% if 'pension' in request.path %}active{% endif %}">
<a href="{% url 'members:members' 'pension' %}">Pension</a>
</li>
<li class="{% if '/all/' in request.path %}active{% endif %}">
<a href="{% url 'members:members' 'all' %}">Alle Mitglieder</a>
</li>
<li class="{% if '/members/' == request.path %}active{% endif %}"> {% if request.user.is_authenticated %}
<a href="{% url 'members:index' %}">Fachschaft</a> {% if active_job_group %}
</li> <li class="internalLI">
<a href="{% url 'admin:members_jobgroup_change' active_job_group.id %}">
<i class="fa-solid fa-pen-to-square mr-1"></i>{{ active_job_group.name|softhyphen|safe }} bearbeiten
</a>
</li>
{% endif %}
<li class="{% if 'pension' in request.path %}active{% endif %}"> {% if members %}
<a href="{% url 'members:members' 'pension' %}">Pension</a> {% get_flatpages '/fachschaft/' as pages %}
</li> {% if pages %}
<li class="{% if '/all/' in request.path %}active{% endif %}">
<a href="{% url 'members:members' 'all' %}">Alle Mitglieder</a>
</li>
{% if request.user.is_authenticated %}
{% if active_job_group %}
<li class="internalLI"> <li class="internalLI">
<a href="{% url 'admin:members_jobgroup_change' active_job_group.id %}"> <a href="{% url 'admin:core_customflatpage_change' pages.first.id %}">
<i class="fa-solid fa-pen-to-square mr-1"></i>{{ active_job_group.name|softhyphen|safe }} bearbeiten <i class="fa-solid fa-pen-to-square mr-1"></i>Fachschaft-Text bearbeiten
</a>
</li>
{% endif %}
{% if members %}
{% get_flatpages '/fachschaft/' as pages %}
{% if pages %}
<li class="internalLI">
<a href="{% url 'admin:core_customflatpage_change' pages.first.id %}">
<i class="fa-solid fa-pen-to-square mr-1"></i>Fachschaft-Text bearbeiten
</a>
</li>
{% endif %}
{% endif %}
{% if member %}
<li class="internalLI">
<a href="{% url 'admin:members_member_change' member.id %}">
<i class="fa-solid fa-pen-to-square mr-1"></i>Profil bearbeiten
</a> </a>
</li> </li>
{% endif %} {% endif %}
{% endif %} {% endif %}
</ul>
</div> {% if member %}
<li class="internalLI">
<a href="{% url 'admin:members_member_change' member.id %}">
<i class="fa-solid fa-pen-to-square mr-1"></i>Profil bearbeiten
</a>
</li>
{% endif %}
{% endif %}
</ul>
</div> </div>
<button class="z-10 trigger fixed bottom-4 right-4 bg-proprietary-darker dark:bg-sky-500 text-blue-50 dark:text-sky-900 shadow-lg text-2xl rounded sm:hidden" </div>
@click="openModal"
x-show="getNotShowModal" <button class="z-10 trigger fixed bottom-4 right-4 bg-proprietary-darker dark:bg-sky-500 text-blue-50 dark:text-sky-900 shadow-lg text-2xl rounded sm:hidden"
@click="openModal"
x-show="displayNoModal"
x-transition:enter="transition duration-100 ease-in" x-transition:enter="transition duration-100 ease-in"
x-transition:enter-start="opacity-0" x-transition:enter-start="opacity-0"
x-transition:enter-end="opacity-100" x-transition:enter-end="opacity-100"
x-transition:leave="transition duration-100 ease-out" x-transition:leave="transition duration-100 ease-out"
x-transition:leave-start="opacity-100" x-transition:leave-start="opacity-100"
x-transition:leave-end="opacity-0" x-transition:leave-end="opacity-0"
> >
<i class="fa-solid fa-bars px-2 py-1"></i> <i class="fa-solid fa-bars px-2 py-1"></i>
</button> </button>
</aside> </aside>
<section class="flex-grow max-w-prose my-8 sm:my-0"> <section class="flex-grow max-w-prose my-8 sm:my-0">
{% if member %} {% if member %}
<!-- show details of a member --> <!-- show details of a member -->
{% block member_content %} {% block member_content %}
@@ -121,7 +120,7 @@
{% block jobs_content %} {% block jobs_content %}
{% endblock %} {% endblock %}
{% endif %} {% endif %}
</section> </section>
</div> </div>
</main> </main>
{% endblock %} {% endblock %}

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

@@ -50,7 +50,7 @@
{% endfor %} {% endfor %}
</ul> </ul>
<ul class="flex flex-col gap-1 mt-1" <ul class="flex flex-col gap-1 mt-1"
x-show="getExpandList" x-show="contentIsVisible"
x-transition:enter="transition duration-100 ease-in" x-transition:enter="transition duration-100 ease-in"
x-transition:enter-start="opacity-0" x-transition:enter-start="opacity-0"
x-transition:enter-end="opacity-100" x-transition:enter-end="opacity-100"

34
fet2020/templates/posts/event/detail.html
View File

@@ -19,10 +19,10 @@
{% endblock %} {% endblock %}
{% block event_details_desktop %} {% block event_details_desktop %}
<div class="hidden lg:block absolute top-0 right-0 bg-white dark:bg-gray-900 rounded-bl p-2 bg-opacity-80 dark:bg-opacity-70 gap-2"> <div class="hidden lg:block absolute top-0 right-0 bg-white dark:bg-gray-950 rounded-bl p-2 bg-opacity-60 dark:bg-opacity-60 gap-2 backdrop-blur">
<div class="items-center lg:flex gap-2"> <div class="items-center lg:flex gap-2">
<i class="flex-none fa-solid fa-calendar-day fa-fw text-gray-800 dark:text-gray-200"></i> <i class="flex-none fa-solid fa-calendar-day fa-fw text-gray-800 dark:text-gray-200"></i>
<span class="flex-1 text-sm text-gray-800 dark:text-gray-200"> <span class="flex-1 text-sm text-gray-800 dark:text-gray-100">
Event-Start: {{ post.event_start|date }} um {{ post.event_start|time }} Uhr<br> Event-Start: {{ post.event_start|date }} um {{ post.event_start|time }} Uhr<br>
Event-Ende: {{ post.event_end|date }} um {{ post.event_end|time }} Uhr Event-Ende: {{ post.event_end|date }} um {{ post.event_end|time }} Uhr
</span> </span>
@@ -68,36 +68,6 @@
</div> </div>
{% endblock %} {% endblock %}
{% block files_buttons %}
{% for file in files %}
<div class="w-full my-2 flex items-center gap-4 text-gray-700 dark:text-gray-300" x-data="options">
<span class="flex-1">{{ file.title }}</span>
<div class="relative">
<button class="sm:hidden px-2 py-1 border border-gray-300 dark:border-gray-700 rounded" @click="openShowOptions">
<i class="fa-solid fa-ellipsis-vertical fa-fw"></i>
</button>
<ul class="z-10 absolute top-0 right-0 sm:flex flex-row sm:static flex-none border dark:border-2 border-gray-300 dark:border-gray-700 rounded divide-y-2 sm:divide-y-0 sm:divide-x divide-gray-300 dark:divide-gray-700 bg-gray-100 dark:bg-gray-800 shadow sm:bg-transparent sm:shadow-none"
@click.outside="closeShowOptions"
x-show="getShowOptions"
x-transition:enter="transition ease-out duration-300"
x-transition:enter-start="transform origin-right opacity-0 scale-95"
x-transition:enter-end="transform origin-right opacity-100 scale-100"
x-transition:leave="transition ease-in duration-150"
x-transition:leave-start="transform origin-right opacity-100 scale-100"
x-transition:leave-end="transform origin-right opacity-0 scale-95"
>
<li class="block sm:inline-block group hover:bg-gray-200 dark:hover:bg-gray-800 hover:text-gray-800 dark:hover:text-gray-200">
<a href="{{ file.file_field.url }}" class="inline-flex items-center px-2 py-1" target="_blank">
<i class="fa-solid fa-file-pdf fa-fw text-red-800 dark:text-red-500 md:text-inherit group-hover:text-red-800 dark:group-hover:text-red-500"></i>
<span class="ml-2 sm:ml-1">Download</span>
</a>
</li>
</ul>
</div>
</div>
{% endfor %}
{% endblock %}
{% block update_button_mobile %} {% block update_button_mobile %}
{% if request.user.is_authenticated %} {% if request.user.is_authenticated %}
<a href="{% url 'posts:post_update' post.slug %}" class="sm:hidden block w-full btn btn-primary mt-4"> <a href="{% url 'posts:post_update' post.slug %}" class="sm:hidden block w-full btn btn-primary mt-4">

58
fet2020/templates/posts/fetmeeting/detail.html
View File

@@ -19,10 +19,10 @@
{% endblock %} {% endblock %}
{% block event_details_desktop %} {% block event_details_desktop %}
<div class="hidden lg:block absolute top-0 right-0 bg-white dark:bg-gray-900 rounded-bl p-2 bg-opacity-80 dark:bg-opacity-70 gap-2"> <div class="hidden lg:block absolute top-0 right-0 bg-white dark:bg-gray-950 rounded-bl p-2 bg-opacity-60 dark:bg-opacity-60 gap-2 backdrop-blur">
<div class="items-center lg:flex gap-2"> <div class="items-center lg:flex gap-2">
<i class="flex-none fa-solid fa-calendar-day fa-fw text-gray-800 dark:text-gray-200"></i> <i class="flex-none fa-solid fa-calendar-day fa-fw text-gray-800 dark:text-gray-200"></i>
<span class="flex-1 text-sm text-gray-800 dark:text-gray-200"> <span class="flex-1 text-sm text-gray-800 dark:text-gray-100">
Event-Start: {{ post.event_start|date }} um {{ post.event_start|time }} Uhr<br> Event-Start: {{ post.event_start|date }} um {{ post.event_start|time }} Uhr<br>
Event-Ende: {{ post.event_end|date }} um {{ post.event_end|time }} Uhr Event-Ende: {{ post.event_end|date }} um {{ post.event_end|time }} Uhr
</span> </span>
@@ -83,15 +83,15 @@
{% endif %} {% endif %}
{% if post.has_agenda %} {% if post.has_agenda %}
<div class="w-full my-2 flex items-center gap-4 text-gray-700 dark:text-gray-300" x-data="options"> <div class="w-full my-2 flex items-center gap-4 text-gray-700 dark:text-gray-300" x-data="optionsToggle">
<span class="flex-1">Agenda</span> <span class="flex-1">Agenda</span>
<div class="relative"> <div class="relative">
<button class="sm:hidden px-2 py-1 border border-gray-300 dark:border-gray-700 rounded" @click="openShowOptions"> <button class="sm:hidden px-2 py-1 border border-gray-300 dark:border-gray-700 rounded" @click="showOptions">
<i class="fa-solid fa-ellipsis-vertical fa-fw"></i> <i class="fa-solid fa-ellipsis-vertical fa-fw"></i>
</button> </button>
<ul class="z-10 absolute top-0 right-0 sm:flex flex-row sm:static flex-none border dark:border-2 border-gray-300 dark:border-gray-700 rounded divide-y-2 sm:divide-y-0 sm:divide-x divide-gray-300 dark:divide-gray-700 bg-gray-100 dark:bg-gray-800 shadow sm:bg-transparent sm:shadow-none" <ul class="z-10 absolute top-0 right-0 sm:flex flex-row sm:static flex-none border dark:border-2 border-gray-300 dark:border-gray-700 rounded divide-y-2 sm:divide-y-0 sm:divide-x divide-gray-300 dark:divide-gray-700 bg-gray-100 dark:bg-gray-800 shadow sm:bg-transparent sm:shadow-none"
@click.outside="closeShowOptions" @click.outside="hideOptions"
x-show="getShowOptions" x-show="optionsVisible"
x-transition:enter="transition ease-out duration-300" x-transition:enter="transition ease-out duration-300"
x-transition:enter-start="transform origin-right opacity-0 scale-95" x-transition:enter-start="transform origin-right opacity-0 scale-95"
x-transition:enter-end="transform origin-right opacity-100 scale-100" x-transition:enter-end="transform origin-right opacity-100 scale-100"
@@ -119,15 +119,15 @@
{% endif %} {% endif %}
{% if post.has_protocol %} {% if post.has_protocol %}
<div class="w-full my-2 flex items-center gap-4 text-gray-700 dark:text-gray-300" x-data="options"> <div class="w-full my-2 flex items-center gap-4 text-gray-700 dark:text-gray-300" x-data="optionsToggle">
<span class="flex-1">Protokoll</span> <span class="flex-1">Protokoll</span>
<div class="relative"> <div class="relative">
<button class="sm:hidden px-2 py-1 border border-gray-300 dark:border-gray-700 rounded" @click="openShowOptions"> <button class="sm:hidden px-2 py-1 border border-gray-300 dark:border-gray-700 rounded" @click="showOptions">
<i class="fa-solid fa-ellipsis-vertical fa-fw"></i> <i class="fa-solid fa-ellipsis-vertical fa-fw"></i>
</button> </button>
<ul class="z-10 absolute top-0 right-0 sm:flex flex-row sm:static flex-none border dark:border-2 border-gray-300 dark:border-gray-700 rounded divide-y-2 sm:divide-y-0 sm:divide-x divide-gray-300 dark:divide-gray-700 bg-gray-100 dark:bg-gray-800 shadow sm:bg-transparent sm:shadow-none" <ul class="z-10 absolute top-0 right-0 sm:flex flex-row sm:static flex-none border dark:border-2 border-gray-300 dark:border-gray-700 rounded divide-y-2 sm:divide-y-0 sm:divide-x divide-gray-300 dark:divide-gray-700 bg-gray-100 dark:bg-gray-800 shadow sm:bg-transparent sm:shadow-none"
@click.outside="closeShowOptions" @click.outside="hideOptions"
x-show="getShowOptions" x-show="optionsVisible"
x-transition:enter="transition ease-out duration-300" x-transition:enter="transition ease-out duration-300"
x-transition:enter-start="transform origin-right opacity-0 scale-95" x-transition:enter-start="transform origin-right opacity-0 scale-95"
x-transition:enter-end="transform origin-right opacity-100 scale-100" x-transition:enter-end="transform origin-right opacity-100 scale-100"
@@ -155,15 +155,15 @@
{% get_flatpages '/bs/' for user as pages %} {% get_flatpages '/bs/' for user as pages %}
{% if pages %} {% if pages %}
<div class="w-full my-2 flex items-center gap-4 text-gray-700 dark:text-gray-300" x-data="options"> <div class="w-full my-2 flex items-center gap-4 text-gray-700 dark:text-gray-300" x-data="optionsToggle">
<span class="flex-1">{{ pages.first.title }}</span> <span class="flex-1">{{ pages.first.title }}</span>
<div class="relative"> <div class="relative">
<button class="sm:hidden px-2 py-1 border border-gray-300 dark:border-gray-700 rounded" @click="openShowOptions"> <button class="sm:hidden px-2 py-1 border border-gray-300 dark:border-gray-700 rounded" @click="showOptions">
<i class="fa-solid fa-ellipsis-vertical fa-fw"></i> <i class="fa-solid fa-ellipsis-vertical fa-fw"></i>
</button> </button>
<ul class="z-10 absolute top-0 right-0 sm:flex flex-row sm:static flex-none border dark:border-2 border-gray-300 dark:border-gray-700 rounded divide-y-2 sm:divide-y-0 sm:divide-x divide-gray-300 dark:divide-gray-700 bg-gray-100 dark:bg-gray-800 shadow sm:bg-transparent sm:shadow-none" <ul class="z-10 absolute top-0 right-0 sm:flex flex-row sm:static flex-none border dark:border-2 border-gray-300 dark:border-gray-700 rounded divide-y-2 sm:divide-y-0 sm:divide-x divide-gray-300 dark:divide-gray-700 bg-gray-100 dark:bg-gray-800 shadow sm:bg-transparent sm:shadow-none"
@click.outside="closeShowOptions" @click.outside="hideOptions"
x-show="getShowOptions" x-show="optionsVisible"
x-transition:enter="transition ease-out duration-300" x-transition:enter="transition ease-out duration-300"
x-transition:enter-start="transform origin-right opacity-0 scale-95" x-transition:enter-start="transform origin-right opacity-0 scale-95"
x-transition:enter-end="transform origin-right opacity-100 scale-100" x-transition:enter-end="transform origin-right opacity-100 scale-100"
@@ -183,36 +183,6 @@
{% endif %} {% endif %}
{% endblock %} {% endblock %}
{% block files_buttons %}
{% for file in files %}
<div class="w-full my-2 flex items-center gap-4 text-gray-700 dark:text-gray-300" x-data="options">
<span class="flex-1">{{ file.title }}</span>
<div class="relative">
<button class="sm:hidden px-2 py-1 border border-gray-300 dark:border-gray-700 rounded" @click="openShowOptions">
<i class="fa-solid fa-ellipsis-vertical fa-fw"></i>
</button>
<ul class="z-10 absolute top-0 right-0 sm:flex flex-row sm:static flex-none border dark:border-2 border-gray-300 dark:border-gray-700 rounded divide-y-2 sm:divide-y-0 sm:divide-x divide-gray-300 dark:divide-gray-700 bg-gray-100 dark:bg-gray-800 shadow sm:bg-transparent sm:shadow-none"
@click.outside="closeShowOptions"
x-show="getShowOptions"
x-transition:enter="transition ease-out duration-300"
x-transition:enter-start="transform origin-right opacity-0 scale-95"
x-transition:enter-end="transform origin-right opacity-100 scale-100"
x-transition:leave="transition ease-in duration-150"
x-transition:leave-start="transform origin-right opacity-100 scale-100"
x-transition:leave-end="transform origin-right opacity-0 scale-95"
>
<li class="block sm:inline-block group hover:bg-gray-200 dark:hover:bg-gray-800 hover:text-gray-800 dark:hover:text-gray-200">
<a href="{{ file.file_field.url }}" class="inline-flex items-center px-2 py-1" target="_blank">
<i class="fa-solid fa-file-pdf fa-fw text-red-800 dark:text-red-500 md:text-inherit group-hover:text-red-800 dark:group-hover:text-red-500"></i>
<span class="ml-2 sm:ml-1">Download</span>
</a>
</li>
</ul>
</div>
</div>
{% endfor %}
{% endblock %}
{% block update_button_mobile %} {% block update_button_mobile %}
{% if request.user.is_authenticated %} {% if request.user.is_authenticated %}
<a href="{% url 'posts:post_update' post.slug %}" class="sm:hidden block w-full btn btn-primary mt-4"> <a href="{% url 'posts:post_update' post.slug %}" class="sm:hidden block w-full btn btn-primary mt-4">

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

@@ -3,123 +3,117 @@
{% block title %}News{% endblock %} {% block title %}News{% endblock %}
{% block content %} {% block content %}
<!-- Main Content --> <!-- Main Content -->
<main x-data="modal" class="container mx-auto w-full px-4 my-8 flex-1"> <main class="container mx-auto w-full px-4 my-8 flex-1">
<h1 class="page-title">News</h1> <h1 class="page-title">News</h1>
<div class="sm:flex sm:flex-row-reverse justify-center"> <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"> <aside class="sm:w-2/5 sm:max-w-xs sm:pl-4 lg:pl-8 my-8 sm:my-0">
<div class="z-10 fixed sm:sticky top-0 sm:top-4 lg:top-8 left-0 w-full h-full sm:h-auto bg-black sm:bg-transparent bg-opacity-70 flex sm:block items-center justify-center" <div class="z-10 fixed sm:sticky top-0 sm:top-4 lg:top-8 left-0 w-full h-full sm:h-auto bg-black sm:bg-transparent bg-opacity-70 flex sm:block items-center justify-center"
x-show="getShowModal" x-bind="modalContent"
x-transition:enter="transition duration-300 ease-out" x-cloak
x-transition:enter-start="opacity-0" x-transition:enter="transition duration-300 ease-out"
x-transition:enter-end="opacity-100" x-transition:enter-start="opacity-0"
x-transition:leave="transition duration-150 ease-in" x-transition:enter-end="opacity-100"
x-transition:leave-start="opacity-100" x-transition:leave="transition duration-150 ease-in"
x-transition:leave-end="opacity-0" x-transition:leave-start="opacity-100"
> x-transition:leave-end="opacity-0"
<div class="max-w-sm sm:w-full mx-4 sm:mx-0 p-4 rounded bg-white dark:bg-gray-800 sm:shadow-lg sm:dark:border-2 sm:dark:border-gray-700" >
@click.outside="toggle" <div class="max-w-sm sm:w-full mx-4 sm:mx-0 p-4 rounded bg-white dark:bg-gray-800 sm:shadow-lg sm:dark:border-2 sm:dark:border-gray-700"
x-show="getShowModal" @click.outside="toggleModal"
x-transition:enter="transition transform ease-out duration-300" x-transition:enter="transition transform ease-out duration-300"
x-transition:enter-start="scale-110 opacity-0" x-transition:enter-start="scale-110 opacity-0"
x-transition:enter-end="scale-100 opacity-100" x-transition:enter-end="scale-100 opacity-100"
x-transition:leave="transition transform ease-in duration-150" x-transition:leave="transition transform ease-in duration-150"
x-transition:leave-start="scale-100 opacity-100" x-transition:leave-start="scale-100 opacity-100"
x-transition:leave-end="scale-110 opacity-0" x-transition:leave-end="scale-110 opacity-0"
> >
<div class="flex justify-between items-center mb-2"> <div class="flex justify-between items-center mb-2">
<h2 class="text-gray-800 dark:text-gray-100 sm:section-title sm:section-title-margins sm:w-full"> <h2 class="text-gray-800 dark:text-gray-100 sm:section-title sm:section-title-margins sm:w-full">
<span class="mr-1 text-gray-400 sm:hidden"> <span class="mr-1 text-gray-400 sm:hidden">
<i class="fa-solid fa-filter"></i> <i class="fa-solid fa-filter"></i>
</span> </span>
Auswahl einschränken Auswahl einschränken
</h2> </h2>
<div class="ml-4 -mr-2 px-2 rounded text-xl text-gray-600 dark:text-gray-400 sm:hidden cursor-pointer" @click="closeModal"> <div class="ml-4 -mr-2 px-2 rounded text-xl text-gray-600 dark:text-gray-400 sm:hidden cursor-pointer" @click="closeModal">
<i class="fa-solid fa-xmark"></i> <i class="fa-solid fa-xmark"></i>
</div>
</div> </div>
<form action="" method="POST" class="grid grid-cols-1 gap-2 sm:gap-4"> </div>
{% csrf_token %} <form action="" method="POST" class="grid grid-cols-1 gap-2 sm:gap-4">
{% csrf_token %}
{% for message in messages %} {% for message in messages %}
<div class="alert alert-danger"> <div class="alert alert-danger">
<i class="alert-icon fa-solid fa-exclamation-circle"></i> <i class="alert-icon fa-solid fa-exclamation-circle"></i>
<h2 class="alert-title">Fehler:</h2> <h2 class="alert-title">Fehler:</h2>
<div class="alert-body">{{ message }}</div> <div class="alert-body">{{ message }}</div>
</div> </div>
{% endfor %} {% endfor %}
<label class="block"> <label>
<span class="text-gray-700 dark:text-gray-200">Jahr</span> <span>Jahr</span>
<select class="block w-full mt-1 rounded-md border-gray-300 dark:border-none shadow-sm focus:border-none focus:ring focus:ring-blue-200 dark:focus:ring-sky-700 focus:ring-opacity-50" <select id="id_year" name="year">
id="id_year" {% for elem in formset.year %}
name="year" {{ elem }}
> {% endfor %}
{% for elem in formset.year %} </select>
{{ elem }} </label>
{% endfor %} <label>
</select> <span>Monat</span>
</label> <select id="id_month" name="month">
{% for elem in formset.month %}
<label {{ elem }}
x-show="!getSelectedYear" {% endfor %}
x-transition:enter="transition ease-out duration-300" </select>
x-transition:enter-start="opacity-0" </label>
x-transition:enter-end="opacity-100" <label>
x-transition:leave="transition ease-in duration-150" <input
x-transition:leave-start="opacity-100" type="checkbox"
x-transition:leave-end="opacity-0" id="id_compact_view"
name="compact_view"
{% if formset.compact_view.value %}checked{% endif %}
class="rounded border-gray-300 dark:border-none text-proprietary shadow-sm focus:border-blue-300 focus:ring focus:ring-offset-0 focus:ring-blue-200 dark:focus:ring-sky-700 focus:ring-opacity-50"
> >
<span class="text-gray-700 dark:text-gray-200">Monat</span> <span>{{ formset.compact_view.label }}</span>
<select class="block w-full mt-1 rounded-md border-gray-300 dark:border-none shadow-sm focus:border-sky-700 focus:ring focus:ring-blue-200 dark:focus:ring-sky-700 focus:ring-opacity-50" </label>
id="id_month" <label>
name="month" <input
> type="checkbox"
{% for elem in formset.month %} id="id_fet_meeting_only"
{{ elem }} name="fet_meeting_only"
{% endfor %} {% if formset.fet_meeting_only.value %}checked{% endif %}
</select> class="rounded border-gray-300 dark:border-none text-proprietary shadow-sm focus:border-blue-300 focus:ring focus:ring-offset-0 focus:ring-blue-200 dark:focus:ring-sky-700 focus:ring-opacity-50"
</label> >
<span>{{ formset.fet_meeting_only.label }}</span>
</label>
<input type="submit" class="block btn btn-primary" value="Anzeigen" name="btn_input">
</form>
</div>
</div>
<button class="z-10 trigger fixed bottom-4 right-4 bg-proprietary-darker dark:bg-sky-500 text-blue-50 dark:text-sky-900 shadow-lg text-2xl rounded sm:hidden"
@click="openModal"
x-show="displayNoModal"
x-transition:enter="transition duration-100 ease-in"
x-transition:enter-start="opacity-0"
x-transition:enter-end="opacity-100"
x-transition:leave="transition duration-100 ease-out"
x-transition:leave-start="opacity-100"
x-transition:leave-end="opacity-0"
>
<i class="fa-solid fa-filter px-2 py-1"></i>
</button>
</aside>
<label class="inline-flex items-center"> <section class="my-8 sm:my-0 sm:w-3/5 xl:w-2/5 flex flex-col gap-4">
<input type="checkbox" id="id_compact_view" name="compact_view" {% if formset.compact_view.value %}checked{% endif %} class="rounded border-gray-300 dark:border-none text-proprietary shadow-sm focus:border-blue-300 focus:ring focus:ring-offset-0 focus:ring-blue-200 dark:focus:ring-sky-700 focus:ring-opacity-50"> {% if formset.compact_view.value %}
<span class="ml-2 text-gray-700 dark:text-gray-200">{{ formset.compact_view.label }}</span> {% for post in posts %}
</label> {% include 'posts/partials/_posts_hero_compact.html' %}
{% endfor %}
<label class="inline-flex items-center"> {% else %}
<input type="checkbox" id="id_fet_meeting_only" name="fet_meeting_only" {% if formset.fet_meeting_only.value %}checked{% endif %} class="rounded border-gray-300 dark:border-none text-proprietary shadow-sm focus:border-blue-300 focus:ring focus:ring-offset-0 focus:ring-blue-200 dark:focus:ring-sky-700 focus:ring-opacity-50"> {% for post in posts %}
<span class="ml-2 text-gray-700 dark:text-gray-200">{{ formset.fet_meeting_only.label }}</span> {% include 'posts/partials/_posts_hero.html' %}
</label> {% endfor %}
{% endif %}
<input type="submit" class="block btn btn-primary" value="Anzeigen" name="btn_input"> </section>
</form> </div>
</div> </main>
</div>
<button id="modal-trigger-1" class="z-10 trigger fixed bottom-4 right-4 bg-proprietary-darker dark:bg-sky-500 text-blue-50 dark:text-sky-900 shadow-lg text-2xl rounded sm:hidden"
@click="openModal"
x-show="getNotShowModal"
x-transition:enter="transition duration-100 ease-in"
x-transition:enter-start="opacity-0"
x-transition:enter-end="opacity-100"
x-transition:leave="transition duration-100 ease-out"
x-transition:leave-start="opacity-100"
x-transition:leave-end="opacity-0"
>
<i class="fa-solid fa-filter p-2"></i>
</button>
</aside>
<section class="my-8 sm:my-0 sm:w-3/5 xl:w-2/5 flex flex-col gap-4">
{% if formset.compact_view.value %}
{% for post in posts %}
{% include 'posts/partials/_posts_hero_compact.html' %}
{% endfor %}
{% else %}
{% for post in posts %}
{% include 'posts/partials/_posts_hero.html' %}
{% endfor %}
{% endif %}
</section>
</div>
</main>
{% endblock %} {% endblock %}

8
fet2020/templates/posts/news/detail.html
View File

@@ -24,15 +24,15 @@
<h2 class="text-gray-800 dark:text-gray-200 font-medium"><i class="fa-solid fa-inbox mr-2 text-gray-400 dark:text-gray-500"></i>Dokument(e):</h2> <h2 class="text-gray-800 dark:text-gray-200 font-medium"><i class="fa-solid fa-inbox mr-2 text-gray-400 dark:text-gray-500"></i>Dokument(e):</h2>
{% for file in files %} {% for file in files %}
<div class="w-full my-2 flex items-center gap-4 text-gray-700 dark:text-gray-300" x-data="options"> <div class="w-full my-2 flex items-center gap-4 text-gray-700 dark:text-gray-300" x-data="optionsToggle">
<span class="flex-1">{{ file.title }}</span> <span class="flex-1">{{ file.title }}</span>
<div class="relative"> <div class="relative">
<button class="sm:hidden px-2 py-1 border border-gray-300 dark:border-gray-700 rounded" @click="openShowOptions"> <button class="sm:hidden px-2 py-1 border border-gray-300 dark:border-gray-700 rounded" @click="showOptions">
<i class="fa-solid fa-ellipsis-vertical fa-fw"></i> <i class="fa-solid fa-ellipsis-vertical fa-fw"></i>
</button> </button>
<ul class="z-10 absolute top-0 right-0 sm:flex flex-row sm:static flex-none border dark:border-2 border-gray-300 dark:border-gray-700 rounded divide-y-2 sm:divide-y-0 sm:divide-x divide-gray-300 dark:divide-gray-700 bg-gray-100 dark:bg-gray-800 shadow sm:bg-transparent sm:shadow-none" <ul class="z-10 absolute top-0 right-0 sm:flex flex-row sm:static flex-none border dark:border-2 border-gray-300 dark:border-gray-700 rounded divide-y-2 sm:divide-y-0 sm:divide-x divide-gray-300 dark:divide-gray-700 bg-gray-100 dark:bg-gray-800 shadow sm:bg-transparent sm:shadow-none"
@click.outside="closeShowOptions" @click.outside="hideOptions"
x-show="getShowOptions" x-show="optionsVisible"
x-transition:enter="transition ease-out duration-300" x-transition:enter="transition ease-out duration-300"
x-transition:enter-start="transform origin-right opacity-0 scale-95" x-transition:enter-start="transform origin-right opacity-0 scale-95"
x-transition:enter-end="transform origin-right opacity-100 scale-100" x-transition:enter-end="transform origin-right opacity-100 scale-100"

35
fet2020/templates/posts/partials/_posts_hero.html
View File

@@ -1,31 +1,28 @@
<article class="article-cover-image" style="background-image: url('{{ post.imageurl }}');" onclick="openArticle('{{ post.get_absolute_url }}')"> <a href="{{ post.get_absolute_url }}" class="article-cover-image" style="background-image: url('{{ post.imageurl }}');">
<div class="article-cover-desc"> <div class="article-cover-desc">
<div class="article-cover-desc-items"> <div class="w-full">
<ul class="article-cover-tags"> <h3 class="text-gray-50">{{ post.title|safe }}</h3>
{% for t in post.three_tag_names %} <div class="flex justify-between items-center">
<li><a href="{% url 'posts:tags' t %}">#{{ t }}</a></li> <div class="text-gray-200"><i class="fa-solid fa-clock"></i> {{ post.date|date:"d. F Y" }}</div>
{% endfor %}
</ul> {% if post.status == post.Status.DRAFT %}
<div> <div class="inline-flex">
<a href="{{ post.get_absolute_url }}"><h3 class="text-gray-50">{{ post.title|safe }}</h3></a>
<div class="flex justify-between">
<div class="text-gray-200"><i class="fa-solid fa-clock"></i> {{ post.date|date:"d. F Y" }}</div>
{% if post.status == post.Status.DRAFT %}
<div> <div>
<div class="h-7 w-7 aspect-square rounded-full bg-blue-200 text-blue-700 inline-flex justify-center items-center" title="Draft"> <div class="h-7 w-7 aspect-square rounded-full bg-blue-800 text-blue-200 inline-flex justify-center items-center" title="Draft">
<i class="fa-fw fa-solid fa-pen-to-square"></i> <i class="fa-fw fa-solid fa-pen-to-square"></i>
</div> </div>
</div> </div>
{% endif %} </div>
{% if post.status == post.Status.ONLY_INTERN %} {% elif post.status == post.Status.ONLY_INTERN %}
<div class="inline-flex">
<div> <div>
<div class="h-7 w-7 aspect-square rounded-full bg-red-200 text-red-700 inline-flex justify-center items-center" title="Intern only"> <div class="h-7 w-7 aspect-square rounded-full bg-red-800 text-red-200 inline-flex justify-center items-center" title="Intern only">
<i class="fa-fw fa-solid fa-eye-slash"></i> <i class="fa-fw fa-solid fa-eye-slash"></i>
</div> </div>
</div> </div>
{% endif %} </div>
</div> {% endif %}
</div> </div>
</div> </div>
</div> </div>
</article> </a>

36
fet2020/templates/posts/partials/_posts_pinned.html
View File

@@ -1,26 +1,18 @@
<article class="article-cover-image" style="background-image: url('{{ post.imageurl }}');" onclick="openArticle('{{ post.get_absolute_url }}')"> <a href="{{ post.get_absolute_url }}" class="article-cover-image" style="background-image: url('{{ post.imageurl }}');">
<div class="article-cover-desc"> <div class="article-cover-desc">
<div class="article-cover-desc-items"> <div class="pinnedPost"
<div class="absolute rounded-full px-2 py-1 bg-gray-800 text-gray-200 bg-opacity-90 capitalize" x-data="pinnedPost"
x-data="pin" @mouseover="showPin"
@mouseover="openShowPin" @mouseover.away="hidePin"
@mouseover.away="closeShowPin" >
> <i class="fa-solid fa-thumbtack rotate-45 mx-0.5"></i>
<i class="fa-solid fa-thumbtack rotate-45 mx-0.5"></i> <span class="ml-0.5" x-show="pin">Angeheftet</span>
<span class="ml-0.5" x-show="getShowPin">Angeheftet</span> </div>
</div> <div class="w-full">
<ul class="article-cover-tags"> <h3 class="text-gray-50">{{ post.title|safe }}</h3>
{% for t in post.three_tag_names %} <div class="flex justify-between items-center">
<li><a href="{% url 'posts:tags' t %}">#{{ t }}</a></li> <div class="text-gray-200"><i class="fa-solid fa-clock"></i> {{ post.date|date:"d. F Y" }}</div>
{% endfor %}
</ul>
<div>
<a href="{{ post.get_absolute_url }}"><h3 class="text-gray-50">{{ post.title|safe }}</h3></a>
<div class="text-gray-200">
<i class="fa-solid fa-clock"></i>
{{ post.date|date:"d. F Y" }}
</div>
</div> </div>
</div> </div>
</div> </div>
</article> </a>

264
fet2020/templates/posts/show.html
View File

@@ -10,136 +10,140 @@
{% endblock %} {% endblock %}
{% block content %} {% block content %}
<!-- Main Content --> <!-- Main Content -->
<main class="container mx-auto w-full flex-1 my-8 sm:flex flex-col sm:px-4"> <main class="container mx-auto w-full flex-1 my-8 sm:flex flex-col sm:px-4">
<a href="{% url 'posts:post' prev %}" class="hidden z-20 fixed left-0 top-1/2 -mt-8 p-2 xl:flex items-center text-gray-400 dark:text-gray-300 rounded-md" <a href="{% url 'posts:post' prev %}" class="hidden z-20 fixed left-0 top-1/2 -mt-8 p-2 xl:flex items-center text-gray-400 dark:text-gray-300 rounded-md"
x-data="prevArticleButton" x-data="postNavigateArticle"
@mouseleave="closeShowPrevArticleButton" @mouseleave="hideButton"
@mouseover="openShowPrevArticleButton" @mouseover="showButton"
> >
<i class="fa-solid fa-chevron-left text-5xl -m-2 p-2 bg-gray-100 dark:bg-gray-700 rounded-md"></i> <svg xmlns="http://www.w3.org/2000/svg" class="h-16 w-12 -m-2 p-2 bg-gray-100 dark:bg-gray-700 rounded-md" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
<span class="text-gray-600 dark:text-gray-300 font-medium bg-gray-100 dark:bg-gray-700 -m-2 p-2 rounded-r-md origin-left" <path stroke-linecap="round" stroke-linejoin="round" d="M15 19l-7-7 7-7" />
x-show="getShowPrevArticleButton" </svg>
x-transition:enter="transition ease-out duration-300" <span class="text-gray-600 dark:text-gray-300 font-medium bg-gray-100 dark:bg-gray-700 -m-2 p-2 rounded-r-md origin-left"
x-transition:enter-start="opacity-0 bg-opacity-0 transform scale-90" x-show="buttonVisible"
x-transition:enter-end="opacity-100 transform scale-100" x-transition:enter="transition ease-out duration-300"
x-transition:leave="transition ease-in duration-150" x-transition:enter-start="opacity-0 bg-opacity-0 transform scale-90"
x-transition:leave-start="opacity-100 transform scale-100" x-transition:enter-end="opacity-100 transform scale-100"
x-transition:leave-end="opacity-0 bg-opacity-0 transform scale-100" x-transition:leave="transition ease-in duration-150"
>{% block prev_text_big %}Vorheriger<br>Artikel{% endblock %}</span> x-transition:leave-start="opacity-100 transform scale-100"
</a> x-transition:leave-end="opacity-0 bg-opacity-0 transform scale-100"
<a href="{% url 'posts:post' next %}" class="hidden z-20 fixed right-0 top-1/2 -mt-8 p-2 xl:flex items-center text-gray-400 dark:text-gray-300 rounded-md" >{% block prev_text_big %}Vorheriger<br>Artikel{% endblock %}</span>
x-data="nextArticleButton" </a>
@mouseleave="closeShowNextArticleButton" <a href="{% url 'posts:post' next %}" class="hidden z-20 fixed right-0 top-1/2 -mt-8 p-2 xl:flex items-center text-gray-400 dark:text-gray-300 rounded-md"
@mouseover="openShowNextArticleButton" x-data="postNavigateArticle"
> @mouseleave="hideButton"
<span class="z-30 text-gray-600 dark:text-gray-300 font-medium bg-gray-100 dark:bg-gray-700 -m-2 p-2 rounded-l-md text-right origin-right" @mouseover="showButton"
x-show="getShowNextArticleButton" >
x-transition:enter="transition ease-out duration-300" <span class="z-30 text-gray-600 dark:text-gray-300 font-medium bg-gray-100 dark:bg-gray-700 -m-2 p-2 rounded-l-md text-right origin-right"
x-transition:enter-start="opacity-0 bg-opacity-0 transform scale-90" x-show="buttonVisible"
x-transition:enter-end="opacity-100 transform scale-100" x-transition:enter="transition ease-out duration-300"
x-transition:leave="transition ease-in duration-150" x-transition:enter-start="opacity-0 bg-opacity-0 transform scale-90"
x-transition:leave-start="opacity-100 transform scale-100" x-transition:enter-end="opacity-100 transform scale-100"
x-transition:leave-end="opacity-0 bg-opacity-0 transform scale-100" x-transition:leave="transition ease-in duration-150"
>{% block next_text_big %}Nächster<br>Artikel{% endblock %}</span> x-transition:leave-start="opacity-100 transform scale-100"
<i class="fa-solid fa-chevron-right text-5xl -m-2 p-2 bg-gray-100 dark:bg-gray-700 rounded-md"></i> x-transition:leave-end="opacity-0 bg-opacity-0 transform scale-100"
</a> >{% block next_text_big %}Nächster<br>Artikel{% endblock %}</span>
<section> <svg xmlns="http://www.w3.org/2000/svg" class="h-16 w-12 -m-2 p-2 bg-gray-100 dark:bg-gray-700 rounded-md" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
<div class="mb-4 flex flex-col sm:flex-col gap-2 mx-auto"> <path stroke-linecap="round" stroke-linejoin="round" d="M9 5l7 7-7 7" />
<ul class="px-4 sm:px-0 mb-2 flex flex-row justify-center gap-2 sm:gap-4 flex-wrap text-sky-700 dark:text-blue-200 text-sm uppercase tracking-wide sm:font-medium"> </svg>
{% for t in post.tag_names %} </a>
<li class="inline-block py-1 px-2 bg-sky-100 dark:bg-sky-900 rounded-full"><a href="{% url 'posts:tags' t %}">#{{ t }}</a></li> <section>
{% endfor %} <div class="mb-4 flex flex-col sm:flex-col gap-2 mx-auto">
</ul> <ul class="px-4 sm:px-0 mb-2 flex flex-row justify-center gap-2 sm:gap-4 flex-wrap text-sky-700 dark:text-blue-200 text-sm uppercase tracking-wide sm:font-medium">
<h1 class="px-4 sm:px-0 text-lg sm:text-xl lg:text-3xl text-center sm:text-left font-medium text-gray-900 dark:text-gray-100 font-serif tracking-wider leading-normal" style="line-height: 1.5;">{{ post.title }}</h1> {% for t in post.tag_names %}
<div class="mx-auto max-w-max sm:mx-0 sm:max-w-none sm:flex justify-between items-center"> <li class="inline-block py-1 px-2 bg-sky-100 hover:bg-sky-200 dark:bg-sky-900 dark:hover:bg-sky-950 rounded-full"><a href="{% url 'posts:tags' t %}">#{{ t }}</a></li>
<div class="max-w-max flex flex-row justify-center sm:justify-start gap-2 self-center md:self-start">
{% if author_image and author %}
<img class="hidden sm:block w-12 rounded-full" src="{{ author_image }}" alt="Portraitfoto von {{ author.firstname }}">
<div class="sm:flex flex-col justify-evenly text-gray-600 dark:text-gray-300 text-sm sm:text-base">
<a href="{% url 'members:member' author.id %}" class="underline">{{ author.firstname }}</a>
<span class="sm:hidden"> am </span>
<span>{{ post.date|date:"d. F Y" }}</span>
</div>
{% elif post.author %}
<div class="sm:flex flex-col justify-evenly text-gray-600 dark:text-gray-300 text-sm sm:text-base">
<a class="underline">{{ post.author|capfirst }}</a>
<span class="sm:hidden"> am </span>
<span>{{ post.date|date:"d. F Y" }}</span>
</div>
{% else %}
<div class="sm:flex flex-col justify-evenly text-gray-600 dark:text-gray-300 text-sm sm:text-base">
<a class="underline">fet.at Redaktion</a>
<span class="sm:hidden"> am </span>
<span>{{ post.date|date:"d. F Y" }}</span>
</div>
{% endif %}
</div>
{% block update_button_desktop %}
{% endblock %}
</div>
</div>
<div class="relative w-full h-44 sm:h-56 md:h-60 lg:h-64 xl:h-96 bg-center bg-no-repeat bg-cover sm:rounded-md mx-auto" style="background-image: url('{{ post.imageurl }}');">
{% block event_details_desktop %}
{% endblock %}
</div>
</section>
<section class="mx-4 z-10">
<article class="p-4 mt-4 sm:-mt-16 xl:-mt-24 w-full max-w-prose mx-auto bg-white dark:bg-gray-900 rounded dark:border-2 dark:border-gray-800">
<div class="db-page-content-left">
<!-- Content from DB here: -->
{% block post_body %}
{% endblock %}
</div>
{% block event_details_mobile %}
{% endblock %}
{% block docu_buttons %}
{% endblock %}
{% block files_buttons %}
{% endblock %}
<hr class="-mx-4 border-gray-200 dark:border-gray-800 dark:border my-4">
<div class="-m-4 flex divide-x divide-gray-200 dark:divide-gray-800 dark:divide-x-2 text-sm sm:text-base">
<a href="{% url 'posts:post' prev %}" class="w-1/2 p-4 flex items-center gap-2">
<i class="fa-solid fa-chevron-left text-gray-600 dark:text-gray-400"></i>
<span class="text-gray-700 dark:text-gray-300 font-medium">{% block prev_text %}Vorheriger Artikel{% endblock %}</span>
</a>
<a href="{% url 'posts:post' next %}" class="w-1/2 p-4 flex flex-row-reverse items-center gap-2">
<i class="fa-solid fa-chevron-right text-gray-600 dark:text-gray-400"></i>
<span class="text-gray-700 dark:text-gray-300 font-medium">{% block next_text %}Nächster Artikel{% endblock %}</span>
</a>
</div>
</article>
{% block update_button_mobile %}
{% endblock %}
</section>
{% if related_posts and related_posts|length > 1 %}
<section class="mx-auto w-full px-4">
<h2 class="my-4 sm:my-8 text-proprietary dark:text-proprietary-lighter text-xl text-center uppercase tracking-wider">Weiterlesen</h2>
<div class="flex justify-evenly flex-wrap gap-4">
{% for post in related_posts %}
{% if forloop.counter0 == 2 %}
<a href="{{ post.get_absolute_url }}" class="w-full sm:w-auto sm:flex-1 hidden lg:block rounded-md bg-white dark:bg-gray-500 shadow-md bg-no-repeat bg-center aspect-video transition-all ease-in-out duration-500 bg-scale-100 hover:bg-scale-120" style="background-image: url('{{ post.imageurl }}');">
{% include 'posts/partials/_posts_related.html' %}
</a>
{% elif forloop.last %}
<a href="{{ post.get_absolute_url }}" class="w-full sm:w-auto sm:flex-1 hidden 2xl:block rounded-md bg-white dark:bg-gray-500 shadow-md bg-no-repeat bg-center aspect-video transition-all ease-in-out duration-500 bg-scale-100 hover:bg-scale-120" style="background-image: url('{{ post.imageurl }}');">
{% include 'posts/partials/_posts_related.html' %}
</a>
{% else %}
<a href="{{ post.get_absolute_url }}" class="w-full sm:w-auto sm:flex-1 block rounded-md bg-white dark:bg-gray-500 shadow-md bg-no-repeat bg-center aspect-video transition-all ease-in-out duration-500 bg-scale-100 hover:bg-scale-120" style="background-image: url('{{ post.imageurl }}');">
{% include 'posts/partials/_posts_related.html' %}
</a>
{% endif %}
{% endfor %} {% endfor %}
</ul>
<h1 class="px-4 sm:px-0 text-lg sm:text-xl lg:text-3xl text-center sm:text-left font-medium text-gray-900 dark:text-gray-100 font-serif tracking-wider leading-normal" style="line-height: 1.5;">{{ post.title }}</h1>
<div class="mx-auto max-w-max sm:mx-0 sm:max-w-none sm:flex justify-between items-center">
<div class="max-w-max flex flex-row justify-center sm:justify-start gap-2 self-center md:self-start">
{% if author_image and author %}
<img class="hidden sm:block w-12 rounded-full" src="{{ author_image }}" alt="Portraitfoto von {{ author.firstname }}">
<div class="sm:flex flex-col justify-evenly text-gray-600 dark:text-gray-300 text-sm sm:text-base">
<a href="{% url 'members:member' author.id %}" class="underline">{{ author.firstname }}</a>
<span class="sm:hidden"> am </span>
<span>{{ post.date|date:"d. F Y" }}</span>
</div>
{% elif post.author %}
<div class="sm:flex flex-col justify-evenly text-gray-600 dark:text-gray-300 text-sm sm:text-base">
<a class="underline">{{ post.author|capfirst }}</a>
<span class="sm:hidden"> am </span>
<span>{{ post.date|date:"d. F Y" }}</span>
</div>
{% else %}
<div class="sm:flex flex-col justify-evenly text-gray-600 dark:text-gray-300 text-sm sm:text-base">
<a class="underline">fet.at Redaktion</a>
<span class="sm:hidden"> am </span>
<span>{{ post.date|date:"d. F Y" }}</span>
</div>
{% endif %}
</div> </div>
</section>
{% endif %} {% block update_button_desktop %}
</main> {% endblock %}
</div>
</div>
<div class="relative w-full h-44 sm:h-56 md:h-60 lg:h-64 xl:h-96 bg-center bg-no-repeat bg-cover sm:rounded-md mx-auto" style="background-image: url('{{ post.imageurl }}');">
{% block event_details_desktop %}
{% endblock %}
</div>
</section>
<section class="mx-4 z-10">
<article class="p-4 mt-4 sm:-mt-16 w-full max-w-4xl mx-auto bg-white dark:bg-gray-900 rounded dark:border-2 dark:border-gray-800">
<div class="db-page-content-left">
<!-- Content from DB here: -->
{% block post_body %}
{% endblock %}
</div>
{% block event_details_mobile %}
{% endblock %}
{% block docu_buttons %}
{% endblock %}
{% block files_buttons %}
{% endblock %}
<hr class="-mx-4 border-gray-200 dark:border-gray-800 dark:border my-4">
<div class="-m-4 flex divide-x divide-gray-200 dark:divide-gray-800 dark:divide-x-2 text-sm sm:text-base">
<a href="{% url 'posts:post' prev %}" class="w-1/2 p-4 flex items-center gap-2">
<i class="fa-solid fa-chevron-left text-gray-600 dark:text-gray-400"></i>
<span class="text-gray-700 dark:text-gray-300 font-medium">{% block prev_text %}Vorheriger Artikel{% endblock %}</span>
</a>
<a href="{% url 'posts:post' next %}" class="w-1/2 p-4 flex flex-row-reverse items-center gap-2">
<i class="fa-solid fa-chevron-right text-gray-600 dark:text-gray-400"></i>
<span class="text-gray-700 dark:text-gray-300 font-medium">{% block next_text %}Nächster Artikel{% endblock %}</span>
</a>
</div>
</article>
{% block update_button_mobile %}
{% endblock %}
</section>
{% if related_posts and related_posts|length > 1 %}
<section class="mx-auto w-full px-4">
<h2 class="my-4 sm:my-8 text-proprietary dark:text-proprietary-lighter text-xl text-center uppercase tracking-wider">Weiterlesen</h2>
<div class="flex justify-evenly flex-wrap gap-4">
{% for post in related_posts %}
{% if forloop.counter0 == 2 %}
<a href="{{ post.get_absolute_url }}" class="w-full sm:w-auto sm:flex-1 hidden lg:block rounded-md bg-white dark:bg-gray-500 shadow-md bg-no-repeat bg-center aspect-video transition-all ease-in-out duration-500 bg-scale-100 hover:bg-scale-120" style="background-image: url('{{ post.imageurl }}');">
{% include 'posts/partials/_posts_related.html' %}
</a>
{% elif forloop.last %}
<a href="{{ post.get_absolute_url }}" class="w-full sm:w-auto sm:flex-1 hidden 2xl:block rounded-md bg-white dark:bg-gray-500 shadow-md bg-no-repeat bg-center aspect-video transition-all ease-in-out duration-500 bg-scale-100 hover:bg-scale-120" style="background-image: url('{{ post.imageurl }}');">
{% include 'posts/partials/_posts_related.html' %}
</a>
{% else %}
<a href="{{ post.get_absolute_url }}" class="w-full sm:w-auto sm:flex-1 block rounded-md bg-white dark:bg-gray-500 shadow-md bg-no-repeat bg-center aspect-video transition-all ease-in-out duration-500 bg-scale-100 hover:bg-scale-120" style="background-image: url('{{ post.imageurl }}');">
{% include 'posts/partials/_posts_related.html' %}
</a>
{% endif %}
{% endfor %}
</div>
</section>
{% endif %}
</main>
{% endblock %} {% endblock %}

22
fet2020/templates/posts/tag.html
View File

@@ -3,15 +3,15 @@
{% block title %}News{% endblock %} {% block title %}News{% endblock %}
{% block content %} {% block content %}
<!-- Main Content --> <!-- Main Content -->
<main class="container mx-auto w-full px-4 my-8 flex-1"> <main class="container mx-auto w-full px-4 my-8 flex-1">
<h1 class="page-title">News zu #{{ tag }}</h1> <h1 class="page-title">News zu #{{ tag }}</h1>
<div class="sm:flex sm:flex-row-reverse justify-center"> <div class="sm:flex sm:flex-row-reverse justify-center">
<section class="my-8 sm:my-0 sm:w-3/5 xl:w-2/5 flex flex-col gap-4"> <section class="my-8 sm:my-0 sm:w-3/5 xl:w-2/5 flex flex-col gap-4">
{% for post in posts %} {% for post in posts %}
{% include 'posts/partials/_posts_hero.html' %} {% include 'posts/partials/_posts_hero.html' %}
{% endfor %} {% endfor %}
</section> </section>
</div> </div>
</main> </main>
{% endblock %} {% endblock %}

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

@@ -3,19 +3,27 @@
{% block title %}Suche{% endblock %} {% block title %}Suche{% endblock %}
{% block content %} {% block content %}
<!-- Main Content --> <!-- Main Content -->
<main class="container mx-auto w-full px-4 my-8 flex-1"> <main class="container mx-auto w-full px-4 my-8 flex-1">
<h1 class="page-title">Suchergebnisse</h1> <h1 class="page-title">Suchergebnisse</h1>
<section> <section>
<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"> <div class="w-full sticky px-4 py-4 md:py-8 -mt-4 md:-mt-8 top-0 z-10 bg-gray-100/80 dark:bg-gray-900/80 backdrop-blur">
<form class="flex gap-x-2 mx-auto max-w-prose"> <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
<input type="submit" class="flex-grow-0 btn btn-primary" value="Suchen"> type="text"
</form> id="id_q"
</div> name="{{ form.q.name }}"
value="{{ form.q.value|default:'' }}"
autofocus
placeholder="Frag mich etwas..."
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"
>
<input type="submit" class="flex-grow-0 btn btn-primary" value="Suchen">
</form>
</div>
{% if form.q.value %} {% if form.q.value %}
<div class="mx-auto max-w-prose flex flex-col gap-4"> <div class="mx-auto max-w-prose flex flex-col gap-4">
{% for result in object_list %} {% for result in object_list %}
{% if result.get_model_name == 'post' %} {% if result.get_model_name == 'post' %}
{% include 'search/post.html' %} {% include 'search/post.html' %}
@@ -33,8 +41,8 @@
<i class="fa-solid fa-ban mr-2"></i> Keine Ergebnisse gefunden! <i class="fa-solid fa-ban mr-2"></i> Keine Ergebnisse gefunden!
</div> </div>
{% endfor %} {% endfor %}
</div> </div>
{% endif %} {% endif %}
</section> </section>
</main> </main>
{% endblock %} {% endblock %}