diff --git a/app/application.ts b/app/application.ts index 38dc08993..111923abd 100644 --- a/app/application.ts +++ b/app/application.ts @@ -4,7 +4,7 @@ import loadPolyfills from './soapbox/load_polyfills'; require('./soapbox/iframe'); // @ts-ignore -require.context('./images/', true); +require.context('./assets/images/', true); // Load stylesheet require('react-datepicker/dist/react-datepicker.css'); diff --git a/app/fonts/OpenDyslexic/LICENSE b/app/assets/fonts/OpenDyslexic/LICENSE similarity index 100% rename from app/fonts/OpenDyslexic/LICENSE rename to app/assets/fonts/OpenDyslexic/LICENSE diff --git a/app/fonts/OpenDyslexic/OpenDyslexic-Bold-Italic.woff2 b/app/assets/fonts/OpenDyslexic/OpenDyslexic-Bold-Italic.woff2 similarity index 100% rename from app/fonts/OpenDyslexic/OpenDyslexic-Bold-Italic.woff2 rename to app/assets/fonts/OpenDyslexic/OpenDyslexic-Bold-Italic.woff2 diff --git a/app/fonts/OpenDyslexic/OpenDyslexic-Bold.woff2 b/app/assets/fonts/OpenDyslexic/OpenDyslexic-Bold.woff2 similarity index 100% rename from app/fonts/OpenDyslexic/OpenDyslexic-Bold.woff2 rename to app/assets/fonts/OpenDyslexic/OpenDyslexic-Bold.woff2 diff --git a/app/fonts/OpenDyslexic/OpenDyslexic-Italic.woff2 b/app/assets/fonts/OpenDyslexic/OpenDyslexic-Italic.woff2 similarity index 100% rename from app/fonts/OpenDyslexic/OpenDyslexic-Italic.woff2 rename to app/assets/fonts/OpenDyslexic/OpenDyslexic-Italic.woff2 diff --git a/app/fonts/OpenDyslexic/OpenDyslexic-Regular.woff2 b/app/assets/fonts/OpenDyslexic/OpenDyslexic-Regular.woff2 similarity index 100% rename from app/fonts/OpenDyslexic/OpenDyslexic-Regular.woff2 rename to app/assets/fonts/OpenDyslexic/OpenDyslexic-Regular.woff2 diff --git a/app/fonts/soapbox/soapbox.eot b/app/assets/fonts/soapbox/soapbox.eot similarity index 100% rename from app/fonts/soapbox/soapbox.eot rename to app/assets/fonts/soapbox/soapbox.eot diff --git a/app/fonts/soapbox/soapbox.svg b/app/assets/fonts/soapbox/soapbox.svg similarity index 100% rename from app/fonts/soapbox/soapbox.svg rename to app/assets/fonts/soapbox/soapbox.svg diff --git a/app/fonts/soapbox/soapbox.ttf b/app/assets/fonts/soapbox/soapbox.ttf similarity index 100% rename from app/fonts/soapbox/soapbox.ttf rename to app/assets/fonts/soapbox/soapbox.ttf diff --git a/app/fonts/soapbox/soapbox.woff b/app/assets/fonts/soapbox/soapbox.woff similarity index 100% rename from app/fonts/soapbox/soapbox.woff rename to app/assets/fonts/soapbox/soapbox.woff diff --git a/app/icons/COPYING.md b/app/assets/icons/COPYING.md similarity index 100% rename from app/icons/COPYING.md rename to app/assets/icons/COPYING.md diff --git a/app/icons/fediverse.svg b/app/assets/icons/fediverse.svg similarity index 100% rename from app/icons/fediverse.svg rename to app/assets/icons/fediverse.svg diff --git a/app/icons/verified.svg b/app/assets/icons/verified.svg similarity index 100% rename from app/icons/verified.svg rename to app/assets/icons/verified.svg diff --git a/app/images/audio-placeholder.png b/app/assets/images/audio-placeholder.png similarity index 100% rename from app/images/audio-placeholder.png rename to app/assets/images/audio-placeholder.png diff --git a/app/images/avatar-missing.png b/app/assets/images/avatar-missing.png similarity index 100% rename from app/images/avatar-missing.png rename to app/assets/images/avatar-missing.png diff --git a/app/images/avatar-missing.svg b/app/assets/images/avatar-missing.svg similarity index 100% rename from app/images/avatar-missing.svg rename to app/assets/images/avatar-missing.svg diff --git a/app/images/header-missing.png b/app/assets/images/header-missing.png similarity index 100% rename from app/images/header-missing.png rename to app/assets/images/header-missing.png diff --git a/app/images/soapbox-logo-white.svg b/app/assets/images/soapbox-logo-white.svg similarity index 100% rename from app/images/soapbox-logo-white.svg rename to app/assets/images/soapbox-logo-white.svg diff --git a/app/images/soapbox-logo.svg b/app/assets/images/soapbox-logo.svg similarity index 100% rename from app/images/soapbox-logo.svg rename to app/assets/images/soapbox-logo.svg diff --git a/app/images/video-placeholder.png b/app/assets/images/video-placeholder.png similarity index 100% rename from app/images/video-placeholder.png rename to app/assets/images/video-placeholder.png diff --git a/app/images/void.png b/app/assets/images/void.png similarity index 100% rename from app/images/void.png rename to app/assets/images/void.png diff --git a/app/images/web-push/web-push-icon_expand.png b/app/assets/images/web-push/web-push-icon_expand.png similarity index 100% rename from app/images/web-push/web-push-icon_expand.png rename to app/assets/images/web-push/web-push-icon_expand.png diff --git a/app/images/web-push/web-push-icon_favourite.png b/app/assets/images/web-push/web-push-icon_favourite.png similarity index 100% rename from app/images/web-push/web-push-icon_favourite.png rename to app/assets/images/web-push/web-push-icon_favourite.png diff --git a/app/images/web-push/web-push-icon_reblog.png b/app/assets/images/web-push/web-push-icon_reblog.png similarity index 100% rename from app/images/web-push/web-push-icon_reblog.png rename to app/assets/images/web-push/web-push-icon_reblog.png diff --git a/app/sounds/boop.mp3 b/app/assets/sounds/boop.mp3 similarity index 100% rename from app/sounds/boop.mp3 rename to app/assets/sounds/boop.mp3 diff --git a/app/sounds/boop.ogg b/app/assets/sounds/boop.ogg similarity index 100% rename from app/sounds/boop.ogg rename to app/assets/sounds/boop.ogg diff --git a/app/sounds/chat.mp3 b/app/assets/sounds/chat.mp3 similarity index 100% rename from app/sounds/chat.mp3 rename to app/assets/sounds/chat.mp3 diff --git a/app/sounds/chat.oga b/app/assets/sounds/chat.oga similarity index 100% rename from app/sounds/chat.oga rename to app/assets/sounds/chat.oga diff --git a/app/images/halloween/clouds.png b/app/images/halloween/clouds.png deleted file mode 100644 index 29962c104..000000000 Binary files a/app/images/halloween/clouds.png and /dev/null differ diff --git a/app/images/halloween/halloween-emblem.svg b/app/images/halloween/halloween-emblem.svg deleted file mode 100644 index ad23be14c..000000000 --- a/app/images/halloween/halloween-emblem.svg +++ /dev/null @@ -1,311 +0,0 @@ - - - - Flying Witch during Full Moon - - - - - image/svg+xml - - Flying Witch during Full Moon - 2017-10-10 - - - Urs Roesch - - - - - - OpenClipart - - - - - remix+287475 - remix+288242 - remix+170669 - yellow - moon - yellow moon - full moon - moon - witch - cat - silhouette - bat - bats - flying bat - flying witch - black - dark - night - halloween - walpurgis night - walpurgis - - - Flying witch with cat flying during full moon. - - - gnokii - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/app/images/halloween/spider.svg b/app/images/halloween/spider.svg deleted file mode 100644 index 077b60d65..000000000 --- a/app/images/halloween/spider.svg +++ /dev/null @@ -1,69 +0,0 @@ - - - - - - - - - - image/svg+xml - - - - - - - - - diff --git a/app/images/halloween/spiderweb.svg b/app/images/halloween/spiderweb.svg deleted file mode 100644 index 16ae81984..000000000 --- a/app/images/halloween/spiderweb.svg +++ /dev/null @@ -1,78 +0,0 @@ - - - - - Realistic spider web - - - - - - - image/svg+xml - - - - - Openclipart - - - Realistic spider web - - - - - - - - - diff --git a/app/images/halloween/starfield.png b/app/images/halloween/starfield.png deleted file mode 100644 index 1e7995895..000000000 Binary files a/app/images/halloween/starfield.png and /dev/null differ diff --git a/app/images/halloween/twinkle.svg b/app/images/halloween/twinkle.svg deleted file mode 100644 index 9869cb094..000000000 --- a/app/images/halloween/twinkle.svg +++ /dev/null @@ -1,34 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - image/svg+xml - - - - - - - - - - - diff --git a/app/images/sprite-post-functions.png b/app/images/sprite-post-functions.png deleted file mode 100644 index aea7f57ba..000000000 Binary files a/app/images/sprite-post-functions.png and /dev/null differ diff --git a/app/soapbox/components/sidebar-navigation.tsx b/app/soapbox/components/sidebar-navigation.tsx index 22ad8dfc9..4dd47efff 100644 --- a/app/soapbox/components/sidebar-navigation.tsx +++ b/app/soapbox/components/sidebar-navigation.tsx @@ -97,7 +97,7 @@ const SidebarNavigation = () => { if (features.publicTimeline && features.federating) { menu.push({ to: '/timeline/fediverse', - icon: require('icons/fediverse.svg'), + icon: require('assets/icons/fediverse.svg'), text: intl.formatMessage(messages.fediverse), }); } diff --git a/app/soapbox/components/sidebar_menu.tsx b/app/soapbox/components/sidebar_menu.tsx index 817e1f0d2..2c695e5a1 100644 --- a/app/soapbox/components/sidebar_menu.tsx +++ b/app/soapbox/components/sidebar_menu.tsx @@ -228,7 +228,7 @@ const SidebarMenu: React.FC = (): JSX.Element | null => { {features.federating && ( } onClick={onClose} /> diff --git a/app/soapbox/components/site-logo.tsx b/app/soapbox/components/site-logo.tsx index 56add1c19..90552d0bd 100644 --- a/app/soapbox/components/site-logo.tsx +++ b/app/soapbox/components/site-logo.tsx @@ -18,8 +18,8 @@ const SiteLogo: React.FC = ({ className, theme, ...rest }) => { /** Soapbox logo. */ const soapboxLogo = darkMode - ? require('images/soapbox-logo-white.svg') - : require('images/soapbox-logo.svg'); + ? require('assets/images/soapbox-logo-white.svg') + : require('assets/images/soapbox-logo.svg'); // Use the right logo if provided, then use fallbacks. const getSrc = () => { diff --git a/app/soapbox/components/verification_badge.tsx b/app/soapbox/components/verification_badge.tsx index ce1d3792a..766decb88 100644 --- a/app/soapbox/components/verification_badge.tsx +++ b/app/soapbox/components/verification_badge.tsx @@ -18,7 +18,7 @@ const VerificationBadge: React.FC = ({ className }) => { const soapboxConfig = useSoapboxConfig(); // Prefer a custom icon if found - const icon = soapboxConfig.verifiedIcon || require('icons/verified.svg'); + const icon = soapboxConfig.verifiedIcon || require('assets/icons/verified.svg'); // Render component based on file extension const Element = icon.endsWith('.svg') ? Icon : 'img'; diff --git a/app/soapbox/features/developers/settings-store.tsx b/app/soapbox/features/developers/settings-store.tsx index bd619a93f..c2fbf0cc9 100644 --- a/app/soapbox/features/developers/settings-store.tsx +++ b/app/soapbox/features/developers/settings-store.tsx @@ -132,13 +132,6 @@ const SettingsStore: React.FC = () => { - {/* } - hint={} - > - - */} - } hint={} diff --git a/app/soapbox/middleware/sounds.ts b/app/soapbox/middleware/sounds.ts index 94ba15313..1d600306f 100644 --- a/app/soapbox/middleware/sounds.ts +++ b/app/soapbox/middleware/sounds.ts @@ -39,21 +39,21 @@ export default function soundsMiddleware(): ThunkMiddleware { const soundCache: Record = { boop: createAudio([ { - src: require('../../sounds/boop.ogg'), + src: require('../../assets/sounds/boop.ogg'), type: 'audio/ogg', }, { - src: require('../../sounds/boop.mp3'), + src: require('../../assets/sounds/boop.mp3'), type: 'audio/mpeg', }, ]), chat: createAudio([ { - src: require('../../sounds/chat.oga'), + src: require('../../assets/sounds/chat.oga'), type: 'audio/ogg', }, { - src: require('../../sounds/chat.mp3'), + src: require('../../assets/sounds/chat.mp3'), type: 'audio/mpeg', }, ]), diff --git a/app/soapbox/normalizers/__tests__/account.test.ts b/app/soapbox/normalizers/__tests__/account.test.ts index 846c6f471..6c2abc2b3 100644 --- a/app/soapbox/normalizers/__tests__/account.test.ts +++ b/app/soapbox/normalizers/__tests__/account.test.ts @@ -2,8 +2,8 @@ import { Record as ImmutableRecord, fromJS } from 'immutable'; import { normalizeAccount } from '../account'; -const AVATAR_MISSING = require('images/avatar-missing.png'); -const HEADER_MISSING = require('images/header-missing.png'); +const AVATAR_MISSING = require('assets/images/avatar-missing.png'); +const HEADER_MISSING = require('assets/images/header-missing.png'); describe('normalizeAccount()', () => { it('adds base fields', () => { diff --git a/app/soapbox/normalizers/account.ts b/app/soapbox/normalizers/account.ts index 97c640886..07d3ec1e6 100644 --- a/app/soapbox/normalizers/account.ts +++ b/app/soapbox/normalizers/account.ts @@ -98,7 +98,7 @@ const normalizePleromaLegacyFields = (account: ImmutableMap) => { const normalizeAvatar = (account: ImmutableMap) => { const avatar = account.get('avatar'); const avatarStatic = account.get('avatar_static'); - const missing = require('images/avatar-missing.png'); + const missing = require('assets/images/avatar-missing.png'); return account.withMutations(account => { account.set('avatar', avatar || avatarStatic || missing); @@ -110,7 +110,7 @@ const normalizeAvatar = (account: ImmutableMap) => { const normalizeHeader = (account: ImmutableMap) => { const header = account.get('header'); const headerStatic = account.get('header_static'); - const missing = require('images/header-missing.png'); + const missing = require('assets/images/header-missing.png'); return account.withMutations(account => { account.set('header', header || headerStatic || missing); diff --git a/app/soapbox/service_worker/web_push_notifications.ts b/app/soapbox/service_worker/web_push_notifications.ts index fe3d8e652..787e60941 100644 --- a/app/soapbox/service_worker/web_push_notifications.ts +++ b/app/soapbox/service_worker/web_push_notifications.ts @@ -180,21 +180,21 @@ const handlePush = (event: PushEvent) => { /** Native action to open a status on the device. */ const actionExpand = (preferred_locale: string) => ({ action: 'expand', - icon: `/${require('../../images/web-push/web-push-icon_expand.png')}`, + icon: `/${require('../../assets/images/web-push/web-push-icon_expand.png')}`, title: formatMessage('status.show_more', preferred_locale), }); /** Native action to repost status. */ const actionReblog = (preferred_locale: string) => ({ action: 'reblog', - icon: `/${require('../../images/web-push/web-push-icon_reblog.png')}`, + icon: `/${require('../../assets/images/web-push/web-push-icon_reblog.png')}`, title: formatMessage('status.reblog', preferred_locale), }); /** Native action to like status. */ const actionFavourite = (preferred_locale: string) => ({ action: 'favourite', - icon: `/${require('../../images/web-push/web-push-icon_favourite.png')}`, + icon: `/${require('../../assets/images/web-push/web-push-icon_favourite.png')}`, title: formatMessage('status.favourite', preferred_locale), }); diff --git a/app/styles/application.scss b/app/styles/application.scss index 1b70c6982..e7974c887 100644 --- a/app/styles/application.scss +++ b/app/styles/application.scss @@ -72,9 +72,6 @@ @import 'components/radio-button'; @import 'components/directory'; -// Holiday -@import 'holiday/halloween'; - // Truth custom styles @import 'truth'; diff --git a/app/styles/components/compose-form.scss b/app/styles/components/compose-form.scss index 0d76263d3..50ffbc2fe 100644 --- a/app/styles/components/compose-form.scss +++ b/app/styles/components/compose-form.scss @@ -135,12 +135,12 @@ position: relative; &.video { - background-image: url('../images/video-placeholder.png'); + background-image: url('../assets/images/video-placeholder.png'); background-size: cover; } &.audio { - background-image: url('../images/audio-placeholder.png'); + background-image: url('../assets/images/audio-placeholder.png'); background-size: cover; } } diff --git a/app/styles/fonts.scss b/app/styles/fonts.scss index bd8f1bec5..fbb21c381 100644 --- a/app/styles/fonts.scss +++ b/app/styles/fonts.scss @@ -3,26 +3,26 @@ // OpenDyslexic @font-face { font-family: 'OpenDyslexic'; - src: url('../fonts/OpenDyslexic/OpenDyslexic-Regular.woff2') format('woff2'); + src: url('../assets/fonts/OpenDyslexic/OpenDyslexic-Regular.woff2') format('woff2'); } @font-face { font-family: 'OpenDyslexic'; font-weight: bold; - src: url('../fonts/OpenDyslexic/OpenDyslexic-Bold.woff2') format('woff2'); + src: url('../assets/fonts/OpenDyslexic/OpenDyslexic-Bold.woff2') format('woff2'); } @font-face { font-family: 'OpenDyslexic'; font-weight: bold; font-style: italic; - src: url('../fonts/OpenDyslexic/OpenDyslexic-Bold-Italic.woff2') format('woff2'); + src: url('../assets/fonts/OpenDyslexic/OpenDyslexic-Bold-Italic.woff2') format('woff2'); } @font-face { font-family: 'OpenDyslexic'; font-style: italic; - src: url('../fonts/OpenDyslexic/OpenDyslexic-Italic.woff2') format('woff2'); + src: url('../assets/fonts/OpenDyslexic/OpenDyslexic-Italic.woff2') format('woff2'); } // TYPEOGRAPHY MIXINS @@ -62,11 +62,11 @@ // Soapbox icon font @font-face { font-family: 'soapbox'; - src: url('../fonts/soapbox/soapbox.eot?pryg6i'); - src: url('../fonts/soapbox/soapbox.eot?pryg6i#iefix') format('embedded-opentype'), - url('../fonts/soapbox/soapbox.ttf?pryg6i') format('truetype'), - url('../fonts/soapbox/soapbox.woff?pryg6i') format('woff'), - url('../fonts/soapbox/soapbox.svg?pryg6i#soapbox') format('svg'); + src: url('../assets/fonts/soapbox/soapbox.eot?pryg6i'); + src: url('../assets/fonts/soapbox/soapbox.eot?pryg6i#iefix') format('embedded-opentype'), + url('../assets/fonts/soapbox/soapbox.ttf?pryg6i') format('truetype'), + url('../assets/fonts/soapbox/soapbox.woff?pryg6i') format('woff'), + url('../assets/fonts/soapbox/soapbox.svg?pryg6i#soapbox') format('svg'); font-weight: normal; font-style: normal; } diff --git a/app/styles/holiday/halloween.scss b/app/styles/holiday/halloween.scss deleted file mode 100644 index 9fcf96ae5..000000000 --- a/app/styles/holiday/halloween.scss +++ /dev/null @@ -1,144 +0,0 @@ -.halloween, -.site-preview.halloween { - // Set brand color to orange - --brand-color_h: 29.727272727272727; - --brand-color_s: 100%; - --brand-color_l: 43.13725490196079%; - - // Stars BG - background-color: #904700; // Color matches twinkle.svg - background-image: url('../images/halloween/starfield.png'); - background-size: cover; - background-attachment: fixed; - background-position: center; - - // Full-screen pseudo-elements to hold BG graphics - &::before, - &::after, - > .app-holder::before, - > .app-holder::after { - content: ''; - display: block; - position: fixed; - top: 0; - left: 0; - right: 0; - bottom: 0; - background-size: cover; - background-position: center; - width: 100%; - height: 100%; - z-index: -100; - } - - // Spiderweb BG - &::before { - background-image: url('../images/halloween/spiderweb.svg'); - } - - // Twinkle effect by masking with semi-transparent animated circles - &::after { - z-index: -101; - background: transparent url("../images/halloween/twinkle.svg") repeat top center; - animation: halloween-twinkle 200s linear infinite; - } - - > .app-holder { - // Vignette - &::before { - background-image: radial-gradient( - circle, - transparent 0%, - transparent 60%, - var(--vignette-color) 100% - ); - } - - // Floating clouds BG - &::after { - background: transparent url("../images/halloween/clouds.png") repeat top center; - animation: halloween-clouds 200s linear infinite; - } - - // Dangling spider - .ui .page__top::after, - .ui .page__columns::after { - content: ''; - display: block; - width: 100px; - height: 100px; - right: 20px; - background-image: url('../images/halloween/spider.svg'); - background-size: contain; - background-repeat: no-repeat; - background-position: top right; - z-index: -1; - pointer-events: none; - } - - .ui .page__columns::after { - position: fixed; - top: 50px; - } - - .ui .page__top::after { - position: absolute; - bottom: -100px; - } - - .ui .page__top + .page__columns::after { - display: none; - } - - .profile-info-panel { - color: #fff; - - &-content__name h1 { - span:first-of-type { - color: hsla(0, 0%, 100%, 0.6); - } - - small { - color: #fff; - } - } - - &-content__bio { - color: #fff; - } - - &-content__bio a, - &-content__fields a { - color: hsl( - var(--brand-color_h), - var(--brand-color_s), - calc(var(--brand-color_l) + 8%) - ); - } - } - } - - .column-header > button.grouped, - .column-header > .btn.grouped { - color: #fff; - - &:hover { - color: #fff; - } - - &::before { - background-color: var(--brand-color); - } - } -} - -// Animations -@keyframes halloween-twinkle { - from { background-position: 0 0; } - to { background-position: -10000px 5000px; } -} - -@keyframes halloween-clouds { - from { background-position: 0 0; } - to { background-position: 10000px 0; } -} diff --git a/app/styles/ui.scss b/app/styles/ui.scss index e11041089..b822b77f1 100644 --- a/app/styles/ui.scss +++ b/app/styles/ui.scss @@ -232,7 +232,7 @@ article:last-child > .domain { .image-loader__preview-canvas { max-width: $media-modal-media-max-width; max-height: $media-modal-media-max-height; - background: url('../images/void.png') repeat; + background: url('../assets/images/void.png') repeat; object-fit: contain; } diff --git a/webpack/rules/assets.ts b/webpack/rules/assets.ts index d8c8e3e18..e9dd0202a 100644 --- a/webpack/rules/assets.ts +++ b/webpack/rules/assets.ts @@ -11,7 +11,7 @@ const rules: RuleSetRule[] = [{ test: /\.(png|svg)/, type: 'asset/resource', include: [ - resolve('app', 'images'), + resolve('app', 'assets', 'images'), resolve('node_modules', 'emoji-datasource'), ], generator: { @@ -21,7 +21,7 @@ const rules: RuleSetRule[] = [{ test: /\.(ttf|eot|svg|woff|woff2)/, type: 'asset/resource', include: [ - resolve('app', 'fonts'), + resolve('app', 'assets', 'fonts'), resolve('node_modules', 'fork-awesome'), resolve('node_modules', 'line-awesome'), resolve('node_modules', '@fontsource'), @@ -32,7 +32,7 @@ const rules: RuleSetRule[] = [{ }, { test: /\.(ogg|oga|mp3)/, type: 'asset/resource', - include: resolve('app', 'sounds'), + include: resolve('app', 'assets', 'sounds'), generator: { filename: 'packs/sounds/[name]-[contenthash:8][ext]', }, @@ -46,7 +46,7 @@ const rules: RuleSetRule[] = [{ }, { test: /\.svg$/, type: 'asset/resource', - include: resolve('app', 'icons'), + include: resolve('app', 'assets', 'icons'), generator: { filename: 'packs/icons/[name]-[contenthash:8][ext]', },