feat(frontend): load icons from svg files
This commit is contained in:
parent
ad71e165c6
commit
22781e1565
@ -9,6 +9,8 @@
|
|||||||
|
|
||||||
@use "~@fortawesome/fontawesome-pro/scss/solid"
|
@use "~@fortawesome/fontawesome-pro/scss/solid"
|
||||||
|
|
||||||
|
@use "icons.sass"
|
||||||
|
|
||||||
@font-face
|
@font-face
|
||||||
font-family: "FRADrive Sans"
|
font-family: "FRADrive Sans"
|
||||||
src: url('./../../static/wp-5.73/FRADriveSans-Regular.woff2') format('woff2'), url('./../../static/wp-5.73/FRADriveSans-Regular.woff') format('woff')
|
src: url('./../../static/wp-5.73/FRADriveSans-Regular.woff2') format('woff2'), url('./../../static/wp-5.73/FRADriveSans-Regular.woff') format('woff')
|
||||||
|
|||||||
@ -1,4 +1,4 @@
|
|||||||
// SPDX-FileCopyrightText: 2022-2023 Sarah Vaupel <sarah.vaupel@uniworx.de>, Gregor Kleen <gregor.kleen@ifi.lmu.de>,Sarah Vaupel <sarah.vaupel@ifi.lmu.de>,Sarah Vaupel <vaupel.sarah@campus.lmu.de>,Steffen Jost <jost@cip.ifi.lmu.de>,Wolfgang Witt <Wolfgang.Witt@campus.lmu.de>
|
// SPDX-FileCopyrightText: 2022-2024 Sarah Vaupel <sarah.vaupel@uniworx.de>, Gregor Kleen <gregor.kleen@ifi.lmu.de>,Sarah Vaupel <sarah.vaupel@ifi.lmu.de>,Sarah Vaupel <vaupel.sarah@campus.lmu.de>,Steffen Jost <jost@cip.ifi.lmu.de>,Wolfgang Witt <Wolfgang.Witt@campus.lmu.de>,David Mosbach <david.mosbach@uniworx.de>
|
||||||
//
|
//
|
||||||
// SPDX-License-Identifier: AGPL-3.0-or-later
|
// SPDX-License-Identifier: AGPL-3.0-or-later
|
||||||
// SPDX-License-Identifier: LicenseRef-Fraport-Corporate-Design
|
// SPDX-License-Identifier: LicenseRef-Fraport-Corporate-Design
|
||||||
@ -27,9 +27,9 @@
|
|||||||
--color-fontsec: #5b5861
|
--color-fontsec: #5b5861
|
||||||
|
|
||||||
// FONTS
|
// FONTS
|
||||||
--font-base: 'Arial', 'FRADrive Sans', sans-serif
|
--font-base: 'FRADrive Sans', 'Arial', sans-serif
|
||||||
--font-logo: var(--font-base)
|
--font-logo: var(--font-base)
|
||||||
--font-monospace: 'Arial Mono', 'FRADrive Mono', monospace
|
--font-monospace: 'FRADrive Mono', 'Arial Mono', monospace
|
||||||
|
|
||||||
// DIMENSIONS
|
// DIMENSIONS
|
||||||
--header-height: 100px
|
--header-height: 100px
|
||||||
|
|||||||
31
frontend/src/icons.sass
Normal file
31
frontend/src/icons.sass
Normal file
@ -0,0 +1,31 @@
|
|||||||
|
// SPDX-FileCopyrightText: 2024 David Mosbach <david.mosbach@uniworx.de>
|
||||||
|
//
|
||||||
|
// SPDX-License-Identifier: AGPL-3.0-or-later
|
||||||
|
// SPDX-License-Identifier: LicenseRef-Fraport-Corporate-Design
|
||||||
|
|
||||||
|
@function icon-file($name)
|
||||||
|
@return url('../../assets/icons/fradrive/' + $name + '.svg')
|
||||||
|
|
||||||
|
@mixin base-icon($name)
|
||||||
|
background-image: icon-file($name)
|
||||||
|
background-size: contain
|
||||||
|
background-repeat: no-repeat
|
||||||
|
background-position: center
|
||||||
|
height: 50px
|
||||||
|
width: 50px
|
||||||
|
aspect-ratio: 1/1
|
||||||
|
filter: invert(22%) sepia(84%) saturate(7448%) hue-rotate(357deg) brightness(102%) contrast(116%)
|
||||||
|
|
||||||
|
.inline-icon
|
||||||
|
display: inline-block
|
||||||
|
font-size: 2em
|
||||||
|
width: 2em
|
||||||
|
|
||||||
|
|
||||||
|
// Icons
|
||||||
|
|
||||||
|
.ico-check
|
||||||
|
@include base-icon(check)
|
||||||
|
|
||||||
|
.ico-close
|
||||||
|
@include base-icon(close)
|
||||||
@ -29,6 +29,7 @@ const packageVersion = require('./package.json').version;
|
|||||||
|
|
||||||
async function webpackConfig() {
|
async function webpackConfig() {
|
||||||
const faviconNixDirectory = path.resolve(__dirname, '.nix-well-known');
|
const faviconNixDirectory = path.resolve(__dirname, '.nix-well-known');
|
||||||
|
const assetsDirectory = path.resolve(__dirname, 'assets');
|
||||||
let faviconApiVersion = undefined;
|
let faviconApiVersion = undefined;
|
||||||
|
|
||||||
if (!fs.existsSync(faviconNixDirectory)) {
|
if (!fs.existsSync(faviconNixDirectory)) {
|
||||||
|
|||||||
Reference in New Issue
Block a user