diff options
author | hellekin <hellekin@cepheide.org> | 2021-01-23 15:35:49 +0100 |
---|---|---|
committer | hellekin <hellekin@cepheide.org> | 2021-01-23 15:35:49 +0100 |
commit | 73b3fffdbe730c33480682c40e7e8271e75ddf59 (patch) | |
tree | 94c60464d43c6d39150802e8110cf51be2c326ee /app/javascript/scss/components/_user_info.scss | |
parent | b54d7d8aa172f85d53f44b601e4e81660d148342 (diff) | |
download | incommon-map-73b3fffdbe730c33480682c40e7e8271e75ddf59.tar.gz |
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...
Diffstat (limited to 'app/javascript/scss/components/_user_info.scss')
-rw-r--r-- | app/javascript/scss/components/_user_info.scss | 70 |
1 files changed, 70 insertions, 0 deletions
diff --git a/app/javascript/scss/components/_user_info.scss b/app/javascript/scss/components/_user_info.scss new file mode 100644 index 0000000..765be0a --- /dev/null +++ b/app/javascript/scss/components/_user_info.scss @@ -0,0 +1,70 @@ +/* + * SPDX-FileCopyrightText: 2020 IN COMMON Collective <collective@incommon.cc + * + * SPDX-License-Identifier: LAL-1.3 + */ + +/* ----------------------------------------------------------------------------- +User Info +----------------------------------------------------------------------------- */ + +#user_info { + position: absolute; + right: 0.8rem; + + nav { + top: 0; + padding: 0.7rem; + + ul { + display: none; + position: absolute; + right: 0; + background-color: var(--header-background); + box-shadow: 0 2px 4px -1px rgba(0,0,0,0.25); + margin: 0; + list-style: none; + padding-left: 0; + z-index: 1000; + + li { + padding: 0.25em 1em; + width: 12rem; + } + } + + &:focus, &:hover { + padding-left: 6rem; + ul { + display: block; + margin-top: 0.4em; + padding-top: 1em; + } + } + + > a { + display: block; + height: 100%; + width: 2.2857em; + height: 2.2857em; + padding: 0.2143em; + text-decoration: none; + cursor: pointer; + border-top: 1px solid transparent; + border-left: 1px solid transparent; + border-right: 1px solid transparent; + transition: all linear 0.15s; + outline: none; + + > img { + border-radius: 50%; + } + } + } + + &.authenticated { + + } + &.anonymous { + } +} |