diff options
Diffstat (limited to 'app/javascript')
-rw-r--r-- | app/javascript/core/common.js | 3 | ||||
-rw-r--r-- | app/javascript/core/settings.js | 6 | ||||
-rw-r--r-- | app/javascript/core/theme.yml | 4 | ||||
-rw-r--r-- | app/javascript/packs/common.js | 4 | ||||
-rw-r--r-- | app/javascript/skins/vanilla/win95.scss | 1 | ||||
-rw-r--r-- | app/javascript/styles/mastodon/components.scss | 8 | ||||
-rw-r--r-- | app/javascript/styles/win95.scss | 48 | ||||
-rw-r--r-- | app/javascript/themes/glitch/packs/common.js | 2 | ||||
-rw-r--r-- | app/javascript/themes/glitch/packs/public.js | 1 | ||||
-rw-r--r-- | app/javascript/themes/win95/index.js | 10 | ||||
-rw-r--r-- | app/javascript/themes/win95/theme.yml | 18 |
11 files changed, 42 insertions, 63 deletions
diff --git a/app/javascript/core/common.js b/app/javascript/core/common.js index 24c0fdf61..bb4b97935 100644 --- a/app/javascript/core/common.js +++ b/app/javascript/core/common.js @@ -1,5 +1,8 @@ // This file will be loaded on all pages, regardless of theme. import { start } from 'rails-ujs'; +import 'font-awesome/css/font-awesome.css'; + +require.context('images/', true); start(); diff --git a/app/javascript/core/settings.js b/app/javascript/core/settings.js index 7fb1d8e77..bc5f9ed1d 100644 --- a/app/javascript/core/settings.js +++ b/app/javascript/core/settings.js @@ -3,6 +3,8 @@ const { length } = require('stringz'); const { delegate } = require('rails-ujs'); +import { processBio } from 'themes/glitch/util/bio_metadata'; + delegate(document, '.account_display_name', 'input', ({ target }) => { const nameCounter = document.querySelector('.name-counter'); @@ -35,3 +37,7 @@ delegate(document, '#account_header', 'change', ({ target }) => { header.style.backgroundImage = `url(${url})`; }); + +delegate(document, '#user_setting_theme', 'change', ({ target }) => { + target.form.submit(); +}); diff --git a/app/javascript/core/theme.yml b/app/javascript/core/theme.yml index 17e8e66b3..0dc05a149 100644 --- a/app/javascript/core/theme.yml +++ b/app/javascript/core/theme.yml @@ -4,7 +4,9 @@ pack: about: admin: admin.js auth: - common: common.js + common: + filename: common.js + stylesheet: true embed: embed.js error: home: diff --git a/app/javascript/packs/common.js b/app/javascript/packs/common.js index f3156c1c6..5d42509c5 100644 --- a/app/javascript/packs/common.js +++ b/app/javascript/packs/common.js @@ -1,3 +1 @@ -import 'font-awesome/css/font-awesome.css'; -import 'styles/application.scss' -require.context('../images/', true); +import 'styles/application.scss'; diff --git a/app/javascript/skins/vanilla/win95.scss b/app/javascript/skins/vanilla/win95.scss new file mode 100644 index 000000000..298f6ee9d --- /dev/null +++ b/app/javascript/skins/vanilla/win95.scss @@ -0,0 +1 @@ +@import 'styles/win95'; diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss index 0ded6f159..8566585c5 100644 --- a/app/javascript/styles/mastodon/components.scss +++ b/app/javascript/styles/mastodon/components.scss @@ -2075,7 +2075,7 @@ .getting-started { box-sizing: border-box; padding-bottom: 235px; - background: url('../images/mastodon-getting-started.png') no-repeat 0 100%; + background: url('~images/mastodon-getting-started.png') no-repeat 0 100%; flex: 1 0 auto; p { @@ -2270,7 +2270,7 @@ button.icon-button.active i.fa-retweet { justify-content: center; & > div { - background: url('../images/mastodon-not-found.png') no-repeat center -50px; + background: url('~images/mastodon-not-found.png') no-repeat center -50px; padding-top: 210px; width: 100%; } @@ -3143,7 +3143,7 @@ button.icon-button.active i.fa-retweet { img, canvas { display: block; - background: url('../images/void.png') repeat; + background: url('~images/void.png') repeat; object-fit: contain; } @@ -3390,7 +3390,7 @@ button.icon-button.active i.fa-retweet { } .onboarding-modal__page-one__elephant-friend { - background: url('../images/elephant-friend-1.png') no-repeat center center / contain; + background: url('~images/elephant-friend-1.png') no-repeat center center / contain; width: 155px; height: 193px; margin-right: 15px; diff --git a/app/javascript/styles/win95.scss b/app/javascript/styles/win95.scss index 6c89fc5bf..d683218b0 100644 --- a/app/javascript/styles/win95.scss +++ b/app/javascript/styles/win95.scss @@ -1,7 +1,7 @@ // win95 theme from cybrespace. -// Modified to inherit glitch styles (themes/glitch/styles/index.scss) -// instead of vanilla ones (./application.scss) +// Modified by kibi! to use webpack package syntax for urls (eg, +// `url(~images/…)`) for easy importing into skins. $win95-bg: #bfbfbf; $win95-dark-grey: #404040; @@ -73,10 +73,10 @@ $ui-highlight-color: $win95-window-header; @font-face { font-family:"premillenium"; - src: url('../fonts/premillenium/MSSansSerif.ttf') format('truetype'); + src: url('~fonts/premillenium/MSSansSerif.ttf') format('truetype'); } -@import '../themes/glitch/styles/index'; // Imports glitch themes +@import 'application'; /* borrowed from cybrespace style: wider columns and full column width images */ @@ -179,7 +179,7 @@ body.admin { font-size:0px; color:$win95-bg; - background-image: url("../images/start.png"); + background-image: url("~images/start.png"); background-repeat:no-repeat; background-position:8%; background-clip:padding-box; @@ -716,7 +716,7 @@ body.admin { font-size:0px; color:$win95-bg; - background-image: url("../images/start.png"); + background-image: url("~images/start.png"); background-repeat:no-repeat; background-position:8%; background-clip:padding-box; @@ -1055,40 +1055,40 @@ body.admin { } .column-link[href="/web/timelines/public"] { - background-image: url("../images/icon_public.png"); - &:hover { background-image: url("../images/icon_public.png"); } + background-image: url("~images/icon_public.png"); + &:hover { background-image: url("~images/icon_public.png"); } } .column-link[href="/web/timelines/public/local"] { - background-image: url("../images/icon_local.png"); - &:hover { background-image: url("../images/icon_local.png"); } + background-image: url("~images/icon_local.png"); + &:hover { background-image: url("~images/icon_local.png"); } } .column-link[href="/web/pinned"] { - background-image: url("../images/icon_pin.png"); - &:hover { background-image: url("../images/icon_pin.png"); } + background-image: url("~images/icon_pin.png"); + &:hover { background-image: url("~images/icon_pin.png"); } } .column-link[href="/web/favourites"] { - background-image: url("../images/icon_likes.png"); - &:hover { background-image: url("../images/icon_likes.png"); } + background-image: url("~images/icon_likes.png"); + &:hover { background-image: url("~images/icon_likes.png"); } } .column-link[href="/web/blocks"] { - background-image: url("../images/icon_blocks.png"); - &:hover { background-image: url("../images/icon_blocks.png"); } + background-image: url("~images/icon_blocks.png"); + &:hover { background-image: url("~images/icon_blocks.png"); } } .column-link[href="/web/mutes"] { - background-image: url("../images/icon_mutes.png"); - &:hover { background-image: url("../images/icon_mutes.png"); } + background-image: url("~images/icon_mutes.png"); + &:hover { background-image: url("~images/icon_mutes.png"); } } .column-link[href="/settings/preferences"] { - background-image: url("../images/icon_settings.png"); - &:hover { background-image: url("../images/icon_settings.png"); } + background-image: url("~images/icon_settings.png"); + &:hover { background-image: url("~images/icon_settings.png"); } } .column-link[href="/about/more"] { - background-image: url("../images/icon_about.png"); - &:hover { background-image: url("../images/icon_about.png"); } + background-image: url("~images/icon_about.png"); + &:hover { background-image: url("~images/icon_about.png"); } } .column-link[href="/auth/sign_out"] { - background-image: url("../images/icon_logout.png"); - &:hover { background-image: url("../images/icon_logout.png"); } + background-image: url("~images/icon_logout.png"); + &:hover { background-image: url("~images/icon_logout.png"); } } .getting-started__footer { diff --git a/app/javascript/themes/glitch/packs/common.js b/app/javascript/themes/glitch/packs/common.js index f4fa129e1..fd4254a0e 100644 --- a/app/javascript/themes/glitch/packs/common.js +++ b/app/javascript/themes/glitch/packs/common.js @@ -1,3 +1 @@ -import 'font-awesome/css/font-awesome.css'; -require.context('images/', true); import 'themes/glitch/styles/index.scss'; diff --git a/app/javascript/themes/glitch/packs/public.js b/app/javascript/themes/glitch/packs/public.js index d9a1b9655..410e66716 100644 --- a/app/javascript/themes/glitch/packs/public.js +++ b/app/javascript/themes/glitch/packs/public.js @@ -1,5 +1,4 @@ import loadPolyfills from 'themes/glitch/util/load_polyfills'; -import { processBio } from 'themes/glitch/util/bio_metadata'; import ready from 'themes/glitch/util/ready'; function main() { diff --git a/app/javascript/themes/win95/index.js b/app/javascript/themes/win95/index.js deleted file mode 100644 index bed6a1ef3..000000000 --- a/app/javascript/themes/win95/index.js +++ /dev/null @@ -1,10 +0,0 @@ -// These lines are the same as in glitch: -import 'font-awesome/css/font-awesome.css'; -require.context('../../images/', true); - -// …But we want to use our own styles instead. -import 'styles/win95.scss'; - -// Be sure to make this style file import from -// `themes/glitch/styles/index.scss` (the glitch styling), and not -// `application.scss` (which are the vanilla styles). diff --git a/app/javascript/themes/win95/theme.yml b/app/javascript/themes/win95/theme.yml deleted file mode 100644 index c4ac8aa55..000000000 --- a/app/javascript/themes/win95/theme.yml +++ /dev/null @@ -1,18 +0,0 @@ -# win95 theme. - -# Ported over from `cybrespace:mastodon/theme_win95`. -# <https://github.com/cybrespace/mastodon/tree/theme_win95> - -# You can use this theme file as inspiration for porting over -# a preëxisting Mastodon theme. - -# We only modify the `common` pack, which contains our styling. -pack: - common: - filename: index.js - stylesheet: true - # All unspecified packs will inherit from glitch. - -# The `fallback` parameter tells us to use glitch files for everything -# we haven't specified. -fallback: glitch |