Merge branch 'css' into 'restructure'

Work on CSS

See merge request uniworx/uniworx.de!3
This commit is contained in:
Gregor Kleen 2023-07-26 11:56:14 +00:00
commit ea6ed885bf
7 changed files with 715 additions and 185 deletions

View File

@ -1,11 +1,13 @@
{ {
"name": "my-webpack-project", "name": "uniworx.de",
"version": "1.0.0", "version": "1.0.0",
"main": "index.js", "main": "index.js",
"private": true, "private": true,
"dependencies": { "dependencies": {
"@fortawesome/fontawesome-free": "^6.4.0",
"@popperjs/core": "^2.11.7", "@popperjs/core": "^2.11.7",
"bootstrap": "^5.2.3" "bootstrap": "^5.2.3",
"typeface-source-sans-pro": "^1.1.13"
}, },
"scripts": { "scripts": {
"build": "webpack" "build": "webpack"

View File

@ -1,3 +1,3 @@
import 'bootstrap/scss/bootstrap.scss' import * as bootstrap from 'bootstrap'
import {} from 'bootstrap' import {} from './main.sass'

30
frontend/src/main.sass Normal file
View File

@ -0,0 +1,30 @@
@use "sass:string"
@use "~@fortawesome/fontawesome-free/scss/fontawesome" as * with ( $fa-font-path: "~@fortawesome/fontawesome-pro/webfonts" )
@forward "~@fortawesome/fontawesome-free/scss/fontawesome"
@use "~@fortawesome/fontawesome-free/scss/solid"
@use "~typeface-source-sans-pro" as source-sans-pro
@use "~bootstrap/scss/bootstrap" with ( $primary: hsl(128, 100%, 20%), $navbar-toggler-padding-y: 0.5rem, $navbar-padding-x: 1rem, $font-family-sans-serif: string.unquote("\"Source Sans Pro\", system-ui, sans-serif") )
.custom-navbar-toggler-icon
@include fa-icon-solid($fa-var-times)
.collapsed &
@include fa-icon-solid($fa-var-bars)
main
margin: 1rem
footer > nav > ul
margin: 1rem
padding: 0
display: flex
justify-content: center
gap: 1rem
& > li
display: block

View File

@ -24,7 +24,8 @@ const config = {
chunkFilename: '[chunkhash].js', chunkFilename: '[chunkhash].js',
filename: '[chunkhash].js', filename: '[chunkhash].js',
path: path.resolve(__dirname, 'dist', `wp-${webpackVersion}`), path: path.resolve(__dirname, 'dist', `wp-${webpackVersion}`),
publicPath: `/wp-${webpackVersion}/`, // publicPath: `/wp-${webpackVersion}/`,
publicPath: `./`,
hashFunction: 'shake256', hashFunction: 'shake256',
hashDigestLength: 36 hashDigestLength: 36
}, },

File diff suppressed because it is too large Load Diff

View File

@ -12,18 +12,26 @@
<body> <body>
<header> <header>
<nav> <nav class="navbar navbar-expand-md navbar-dark bg-primary">
<ul> <button class="navbar-toggler collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#navbarMain">
$for(tags-nav)$ <span class="custom-navbar-toggler-icon"></span>
$body$ </button>
$endfor$ <a class="navbar-brand" href="/">
</ul> UniWorX Systems
</a>
<div class="collapse navbar-collapse" id="navbarMain">
<ul class="navbar-nav">
$for(tags-nav)$
$body$
$endfor$
</ul>
</div>
</nav> </nav>
</header> </header>
<main> <main>
$body$ $body$
</main> </main>
<footer> <footer class="text-center">
<nav> <nav>
<ul> <ul>
$for(special-nav)$ $for(special-nav)$

View File

@ -1,10 +1,12 @@
<li> <li class="nav-link dropdown">
<a href="$route$">$title$</a> <a class="nav-link dropdown-toggle" href="$route$" data-bs-toggle="dropdown";>
$title$
</a>
<ul> <ul class="dropdown-menu dropdown-menu-dark bg-primary">
$for(posts)$ $for(posts)$
<li> <li class="dropdown-item">
<a href="$route$#$identifier$">$title$</a> <a class="nav-link" href="$route$#$identifier$">$title$</a>
</li> </li>
$endfor$ $endfor$
</ul> </ul>