Skip to content

Releases: matteioo/fet-webpage-redesign

v2.0.1 - Updated dependencies and added dynamic logo/favicon

29 Jan 19:11
Compare
Choose a tag to compare

General Changes

  • This release updated the dependencies in order to fix known security vulnerabilities.
  • The favicon and logos (csv files) were updated to dynamically change based on the active theme of the browser. The new dynamic csv favicon was added in the <head> of each page and therefore changing all .html pages.
  • Switched from the manually built alpine CSP version to the pre-built CSP module which can now be installed directly via npm. Finally 🎉 !

Changed files since last Release

  • [build/img/*.svg] added new dynamic version of light/dark themed svg's.
  • [build/*.html] linked the new dynamic favicon.csv file in the <head> of each page. The browser now picks the dynamic csv if that file is supported as a favicon: Progressive Enhancement.
  • [build/favicon.svg] added dynamic favicon automatically switching between light and dark theme of the browser.
  • [build/vendor.js] updated compiled javascript taking the updated dependencies as well as the new CSP module into consideration.
  • [/package.json] removed deprecated custom postinstall and update npm-scripts because alpine CSP is no longer included as manually built module but rather as regular NPM module.

Full Changelog: v2.0.0...v2.0.1

v2.0.0 - Switched to CSP safe Alpine.js

22 Aug 15:27
Compare
Choose a tag to compare

Changes since last Release

Pages added

  • 404.html
  • suche.html
  • social-media.html Fully responsive and minimal - ideally linked via a QR-code.

Dependencies

  • Switched from Alpine.js to the csp safe version of Alpine.js

Other changes

  • Added dark mode support for all input elements such as <input>, <select>, <textarea>, etc.
  • Refined style variants of buttons and implemented button colors applied via css-classes: (green: btn-success, red: btn-error). Now labels and many other elements are not styled using css classes anymore. Such stylings are applied globally via the dev/tailwind.css file (and used from the compiled css file).
  • Added more complex overlay shadow for text above article-preview image with the help of Easing Gradients
  • Certain page names got updated to reflect the new paths on fet.at Further details: commit 1 and commit 2
  • Updated FontAwesome icons to the free ones #

Changed files since last Release

  • [build/fonts/*] Changed font files - replace files to reflect all changes
  • [build/form-test.html] Added form test page which displays the styling of all input field types (incl. buttons) as well as their disabled state.
  • [build/fotos.html] Added 'Ordner hinzufügen' button
  • [build/fotos-details.html] Added 'Album bearbeiten' button
  • [build/index.html]
    • Fixed spacing caused by alert box (see comment in the code for more info)
    • Increased font size of header-text (FACHSCHAFT ELEKTROTECHNIK) #
    • Removed tags from article previews and therefore preview container rewritten (also updated on other pages where article preview is used) # and #
  • [build/member.html] Added class sm:dark:bg-transparent to fix the issue with the wrong background color of the modal on screen-sizes where the modal is always shown as a sidebar #
  • [build/members.html] Added class sm:dark:bg-transparent to fix the issue with the wrong background color of the modal on screen-sizes where the modal is always shown as a sidebar #
  • [build/post.html]
    • Added hover effect on tags #
    • Added blurred background of location and date container #
  • [build/section.html] Added class sm:dark:bg-transparent to fix the issue with the wrong background color of the modal on screen-sizes where the modal is always shown as a sidebar #
  • [build/social-media.html] Added social media page
  • [build/suche.html]
    • Added text if there are no results from that search query #
    • switched <p> to <div> #
    • Switched z-index #
    • Fixed hidden avatar image on certain browsers (chrome) #
  • [build/404.html] Added new 404 page - including a svg displayed on that page

Changes due to CSP safe Alpine.js

<html>

The <html> is now switched to this tag on every page:

<html lang="de" x-data="bodyData" x-bind="documentRoot">

<body>

The <body> is now switched to this tag on every page:

<body x-bind="documentBody">

Search feature (Commit with changes: #)

Above the navBar (<!-- NAVBAR -->) is now the following search code snippet:

<!-- SEARCH-BAR -->
<div class="fixed w-screen h-screen z-30 backdrop-blur-sm backdrop-saturate-50"
	 x-show="showSearch"
	 x-cloak
	 x-transition:enter="transition ease-out duration-300"
	 x-transition:enter-start="transform backdrop-blur-none backdrop-saturate-100"
	 x-transition:enter-end="transform backdrop-blur-sm backdrop-saturate-50"
	 x-transition:leave="transition ease-in duration-150"
	 x-transition:leave-start="transform backdrop-blur-sm backdrop-saturate-50"
	 x-transition:leave-end="transform backdrop-blur-none backdrop-saturate-100"
>
	<form action="suche.html" @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"
		  x-show="showSearch"
		  x-transition:enter="transition transform ease-out duration-300"
		  x-transition:enter-start="scale-0 opacity-0"
		  x-transition:enter-end="scale-100 opacity-90"
		  x-transition:leave="transition transform ease-in duration-150"
		  x-transition:leave-start="scale-100 opacity-90"
		  x-transition:leave-end="scale-0 opacity-0"
	>
		<input class="flex-grow bg-inherit text-inherit h-10 p-0 border-0 focus:outline-none focus:border-transparent focus:ring-0" type="search" name="search" placeholder="Nach Person, Artikel oder Fotoalbum suchen...">
		<button type="submit" class="flex-none">
			<i class="fa-solid fa-magnifying-glass text-gray-500 dark:text-gray-600"></i>
		</button>
	</form>
</div>

Note

The search bar is currently placed on each page except the search results page, as there is already a search bar.

Theme switcher

Inside the navBar is now a theme switcher which needs two additional containers inside the navBar. This is the same for the navBar in admin pages.

NavBar

The navBar got updated #.

Modal

Changes in the modal can be viewed here. This is the same for the modal on other pages.

Full Changelog: v1.1.0...v2.0.0

v1.1.0 - Added internal pages and corresponding sub-pages

06 Feb 17:58
Compare
Choose a tag to compare

Changes since last Release

  • Added npm-scrollspy and bundled using esbuild #
  • Aminated Discord-Infobox in [build/index.html] #
  • Changed Inter fontface to Inter var #
  • Store AlpineJS states of the expandable lists in [build/admin-intern.html] using the AlpineJS Persist-Plugin #

Changed files since last Release

  • [build/fotos-details.html] Added detailed 'fotos'-page
  • [build/admin-intern.html] Added page
  • [build/admin-intern-sub1.html] Added page
  • [build/admin-intern-sub2.html] Added page
  • [build/admin-tasks.html] Added page
  • [build/admin-tasks-add.html] Added page
  • [build/admin-tasks-details.html] Added page
  • [build/index.html] Changed in-class bg-image reference, Added Discord-Infobox animation
  • [build/jobs.html] Changed scrollspy functionality
  • [index.html] Removed page because not needed anymore using Netlify #
  • [build/js/vendor.js] Added npm packages
  • [dev/bundle.jsx] Added npm packages
  • [build/styles.css] Changed stylings
  • [dev/tailwind.css] Changed stylings

Full Changelog: v1.0.0...v1.1.0

v1.0.0 - Added big initial letter in articles and default image-backgrounds in article-previews

07 Jan 00:14
cbe3951
Compare
Choose a tag to compare

Changes since last Release

  • Fixed default text-color issue in [build/post.html] #
  • Added default backgrounds for images in the article-preview #
  • Changed background-image location to inline #
  • Added big initial letter in paragraphs in [build/post.html] #
  • Split [build/members.html] into [build/members.html] and [build/jobs.html] #

Changed files since last Release

  • [build/index.html] Changed inline-css background-image location to in-class declaration using TailwindCSS arbitrary values
  • [build/post.html] Added class for styling the first letter in the first paragraph
  • [build/jobs.html] Added page
  • [build/members.html] Decremented header-hierarchy (h2 -> h3, etc.)
  • [build/styles.css] Changed stylings
  • [dev/tailwind.css] Changed stylings

Full Changelog: v0.5.3-beta...v1.0.0

  • Merge: Dev by @M00nD3v in #15

Issues with previous two releases

06 Jan 15:46
fb01103
Compare
Choose a tag to compare
Pre-release

Issues with previous two releases. This release contains the source code from the last two releases. (v0.5.0-beta and v0.5.1-beta). This release also contains the latest accepted pull request:

  • Dev by @M00nD3v in #14

Full Changelog: v0.5.1-beta...v0.5.3-beta

Added "location"-strings, file-links, pinned posts and local fonts

06 Jan 12:15
86dc06c
Compare
Choose a tag to compare

Changes since last Release

  • Added links to the Etherpad and PDF Version of certain posts (within the post itself)
  • Added Location-strings
  • Added pinned-badge on first article-preview in [build/index.html] in order to mark a post as pinned and out of order
  • Changed height of article-previews to video-like aspect ratio (16:9)
  • Changed Post-Image size on bigger screens
  • Added local fonts (Inter, Poppins, Besley, Fira Code) in order to break free from CDNs
  • Added local stylesheet for code-blocks in [build/post.html]

Changed files since last Release

  • [build/index.html] Added styling and hover-functionality of pinned posts
  • [build/post.html] Changed banner image size, added location-strings, added file-link section, added aspect-ratio of other linked posts
  • [build/posts.html] Changed rounded corners from rounded to rounded-md
  • [build/styles.css] Changed stylings
  • [dev/tailwind.css] Changed stylings
  • [build/*.html] Added font dependencies in the <head> of every page
  • [build/fonts/*] Added fonts directory storing the local fonts
  • [build/css/prism-one-dark.min.css] Added local PrismJS theme "One Dark"

Full Changelog: v0.5.0-beta...v0.5.2-beta

  • Merge: Dev by @M00nD3v in #13

Added DarkMode version and simplified Modal functionality

04 Jan 20:56
86dc06c
Compare
Choose a tag to compare

Changes since last Release

  • Added DarkMode of every page
  • Simplified modal functionality in order to make it equally on every page that currently uses it
  • Added various favicons for different browser vendors
  • [build/post.html] added "place"-strings where needed in order to match the currently used design
  • [build/blackboard.html] tiny tweaks in the jobs-list styling (corners of top and last item rounded)

Changed files since last Release

  • [build/*.html] got changed due to DarkMode and diversified favicon-support implementation
  • [dev/tailwind.css] styling implementation
  • [build/styles.css] compiled file changed because of changes in [dev/tailwind.css]

Full Changelog: v0.5.0-beta...v0.5.1-beta

  • Merge: Dev by @M00nD3v in #13

Added esbuild as js-bundler and updated tailwind to v3

23 Dec 19:39
d7f8e88
Compare
Choose a tag to compare

Changes since last Release

  • [dev/bundle.jsx] this file will be used by esbuild in order to bundle multiple npm-modules into one combined javascript-file
  • [build/vendor.js] this file is the bundled output-file of esbuild
  • [package.json] added new bundle command executing the esbuild bundling process and compiling a new [build/vendor.js]-file

Changed files since last Release

  • changed file structure: dev | build
  • [build/post.html] added first DarkMode stylings (WIP)
  • [package.json] updated build command to reflect the commands used by the new tailwindcss version. Old version renamed `build-old"

Others

In this release tailwindcss got updated to the fresh and new version 3 - this doesn't use PostCSS anymore and therefore the [postcss.config.js] is deprecated. Some commands changed too, in order to reflect the new Tailwind JIT engine, which only places the used CSS classes in the output file. YAY!

Full Changelog: v0.4.0-beta...v0.4.1-beta

v0.4.1-beta

15 Oct 22:40
Compare
Choose a tag to compare
v0.4.1-beta Pre-release
Pre-release

Changes since last Release

  • [post.html] added <blockquote> styling
  • [post.html] added code styling using Prism.js
  • added monospace font for code-styling
  • changed default theme to One Dark

Changed files since last Release

  • post.html
  • tailwind.css
  • styles.css
  • tailwind.config.js

Full Changelog: v0.4.0-beta...v0.4.1-beta

Added [fotos.html] and edit-buttons as well as new stylings

08 Sep 10:05
Compare
Choose a tag to compare

Changes since last Release

  • added edit buttons for logged-in users
  • added alignment for .db-page-content-class as a suffix: left, right and justify by default
  • [post.html] added <mark> styling
  • [posts.html] animated showing/hiding month selector
  • renamed tailwind.css directory from css/tailwind.css to dev/tailwind.css to get a better visual understanding of it being a developer only file
  • added [fotos.html]-page

Changed files since last Release

  • README.md
  • admin.html
  • blackboard.html
  • fotos.html
  • impressum.html
  • member-details.html
  • members.html
  • post.html
  • posts.html
  • tailwind.css
  • styles.css
  • scripts.js (removed almost entire code because of transition to Alpine.js)
  • package.json
  • README.md