From 73b3fffdbe730c33480682c40e7e8271e75ddf59 Mon Sep 17 00:00:00 2001 From: hellekin Date: Sat, 23 Jan 2021 15:35:49 +0100 Subject: Move CSS to Webpack Using both the asset pipeline and webpack is confusing and leads to unpredictable results in production. This commit moves all (S)CSS to Webpack under `app/javascript/scss` so that we can test whether the development interface results in a consistent production deployment. In order to load the ForkAwesome fonts we used a long path: `$fa-font-path: "../../../node_modules/fork-awesome/fonts";` Not sure whether this works... --- app/javascript/scss/components/_header.scss | 34 +++++++++++++++++++++++++++++ 1 file changed, 34 insertions(+) create mode 100644 app/javascript/scss/components/_header.scss (limited to 'app/javascript/scss/components/_header.scss') diff --git a/app/javascript/scss/components/_header.scss b/app/javascript/scss/components/_header.scss new file mode 100644 index 0000000..3c7d460 --- /dev/null +++ b/app/javascript/scss/components/_header.scss @@ -0,0 +1,34 @@ +/* + * SPDX-FileCopyrightText: 2020 IN COMMON Collective header { + position: fixed; + backface-visibility: hidden; + top: 0; + left: 0; + right: 0; + width: 100%; + margin: 0 auto; + height: 4em; + background-color: var(--header-background); + box-shadow: 0 2px 4px -1px rgba(0,0,0,0.25); + margin-bottom: 15px; + display: flex; + align-items: center; + z-index: 999; + + > h1 { + display: flex; + font-size: 1em; + img { + height: 2.667em; + } + } +} -- cgit v1.2.3