From e3c00545299faf1bbef9a5e42a3ab6308307c22d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?nicole=20miko=C5=82ajczyk?= <git@mkljczk.pl>
Date: Tue, 3 Mar 2026 20:22:45 +0100
Subject: [PATCH] nicolium: remove BackgroundShapes
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: nicole mikołajczyk <git@mkljczk.pl>
---
 .../components/site-preview.tsx               |  2 --
 .../src/features/preferences/index.tsx        | 15 ---------------
 .../ui/components/background-shapes.tsx       | 19 -------------------
 packages/nicolium/src/features/ui/index.tsx   |  5 -----
 packages/nicolium/src/locales/en.json         |  1 -
 .../nicolium/src/schemas/frontend-settings.ts |  1 -
 packages/nicolium/src/styles/new/layout.scss  | 15 ---------------
 7 files changed, 58 deletions(-)
 delete mode 100644 packages/nicolium/src/features/ui/components/background-shapes.tsx

diff --git a/packages/nicolium/src/features/frontend-config/components/site-preview.tsx b/packages/nicolium/src/features/frontend-config/components/site-preview.tsx
index 19ae8fdfc..8206e77bb 100644
--- a/packages/nicolium/src/features/frontend-config/components/site-preview.tsx
+++ b/packages/nicolium/src/features/frontend-config/components/site-preview.tsx
@@ -3,7 +3,6 @@ import React from 'react';
 import { FormattedMessage } from 'react-intl';
 
 import InlineStyle from '@/components/inline-style';
-import BackgroundShapes from '@/features/ui/components/background-shapes';
 import { useSystemTheme } from '@/hooks/use-system-theme';
 import { useThemeCss } from '@/hooks/use-theme-css';
 
@@ -40,7 +39,6 @@ const SitePreview: React.FC<ISitePreview> = ({ frontendConfig }) => {
   return (
     <div className={bodyClass}>
       <InlineStyle>{`.site-preview {${themeCss}}`}</InlineStyle>
-      <BackgroundShapes preview hidden={userTheme === 'black'} />
 
       <div className='absolute z-[2] self-center overflow-hidden rounded-lg bg-accent-500 p-2 text-white'>
         <FormattedMessage id='site_preview.preview' defaultMessage='Preview' />
diff --git a/packages/nicolium/src/features/preferences/index.tsx b/packages/nicolium/src/features/preferences/index.tsx
index 67dd687dd..2107af605 100644
--- a/packages/nicolium/src/features/preferences/index.tsx
+++ b/packages/nicolium/src/features/preferences/index.tsx
@@ -347,21 +347,6 @@ const Preferences = () => {
             />
           </div>
         </ListItem>
-        <ListItem
-          label={
-            <FormattedMessage
-              id='preferences.fields.theme.display_background_gradient'
-              defaultMessage='Display background gradient'
-            />
-          }
-        >
-          <SettingToggle
-            settings={settings}
-            settingPath={['theme', 'backgroundGradient']}
-            defaultValue
-            onChange={onToggleChange}
-          />
-        </ListItem>
         {settings.themeMode === 'system' && (
           <ListItem
             label={
diff --git a/packages/nicolium/src/features/ui/components/background-shapes.tsx b/packages/nicolium/src/features/ui/components/background-shapes.tsx
deleted file mode 100644
index 48e5ca16f..000000000
--- a/packages/nicolium/src/features/ui/components/background-shapes.tsx
+++ /dev/null
@@ -1,19 +0,0 @@
-import clsx from 'clsx';
-import React from 'react';
-
-interface IBackgroundShapes {
-  /** Whether the shapes should be absolute positioned or fixed. */
-  preview?: boolean;
-  /** Override visibility. */
-  hidden?: boolean;
-}
-
-/** Gradient that appears in the background of the UI. */
-const BackgroundShapes: React.FC<IBackgroundShapes> = ({ preview, hidden }) =>
-  hidden ? null : (
-    <div className={clsx('⁂-background-shapes', preview && '⁂-background-shapes--preview')}>
-      <div />
-    </div>
-  );
-
-export { BackgroundShapes as default };
diff --git a/packages/nicolium/src/features/ui/index.tsx b/packages/nicolium/src/features/ui/index.tsx
index 007ab72a8..8153538fa 100644
--- a/packages/nicolium/src/features/ui/index.tsx
+++ b/packages/nicolium/src/features/ui/index.tsx
@@ -26,13 +26,11 @@ import {
 } from '@/queries/notifications/use-notifications';
 import { useFilters } from '@/queries/settings/use-filters';
 import { scheduledStatusesQueryOptions } from '@/queries/statuses/scheduled-statuses';
-import { useSettings } from '@/stores/settings';
 import { useShoutboxSubscription } from '@/stores/shoutbox';
 import { useIsDropdownMenuOpen } from '@/stores/ui';
 import { getVapidKey } from '@/utils/auth';
 import { isStandalone } from '@/utils/state';
 
-import BackgroundShapes from './components/background-shapes';
 import {
   ModalRoot,
   AccountHoverCard,
@@ -55,7 +53,6 @@ const UI: React.FC = React.memo(() => {
   const vapidKey = useAppSelector((state) => getVapidKey(state));
   const client = useClient();
   const instance = useInstance();
-  const { theme } = useSettings();
 
   const isDropdownMenuOpen = useIsDropdownMenuOpen();
   const standalone = useAppSelector(isStandalone);
@@ -163,8 +160,6 @@ const UI: React.FC = React.memo(() => {
           })}
         />
 
-        {(theme?.backgroundGradient ?? true) && <BackgroundShapes />}
-
         <div className='⁂-layout__container'>
           <Layout fullWidth={fullWidth}>
             <Layout.Sidebar shrink={fullWidth}>
diff --git a/packages/nicolium/src/locales/en.json b/packages/nicolium/src/locales/en.json
index e33de3e46..c04f17633 100644
--- a/packages/nicolium/src/locales/en.json
+++ b/packages/nicolium/src/locales/en.json
@@ -1579,7 +1579,6 @@
   "preferences.fields.theme": "Theme",
   "preferences.fields.theme.dark_theme_preference_hint": "Select dark theme to be used when theme is set to \"System\"",
   "preferences.fields.theme.dark_theme_preference_label": "Dark theme preference",
-  "preferences.fields.theme.display_background_gradient": "Display background gradient",
   "preferences.fields.theme_reset": "Reset theme",
   "preferences.fields.underline_links_label": "Always underline links in posts",
   "preferences.fields.unfollow_modal_label": "Show confirmation dialog before unfollowing someone",
diff --git a/packages/nicolium/src/schemas/frontend-settings.ts b/packages/nicolium/src/schemas/frontend-settings.ts
index a7b10d841..725795c40 100644
--- a/packages/nicolium/src/schemas/frontend-settings.ts
+++ b/packages/nicolium/src/schemas/frontend-settings.ts
@@ -59,7 +59,6 @@ const settingsSchema = v.object({
       accentColor: v.optional(v.string()),
       colors: v.optional(v.any()),
       interfaceSize: v.fallback(v.picklist(['sm', 'md', 'lg', 'xl']), 'md'),
-      backgroundGradient: v.optional(v.boolean(), true),
       systemDarkThemePreference: v.fallback(v.picklist(['dark', 'black']), 'black'),
     }),
     undefined,
diff --git a/packages/nicolium/src/styles/new/layout.scss b/packages/nicolium/src/styles/new/layout.scss
index d493a8f3a..f60ef84bf 100644
--- a/packages/nicolium/src/styles/new/layout.scss
+++ b/packages/nicolium/src/styles/new/layout.scss
@@ -399,20 +399,6 @@ body {
   }
 }
 
-.⁂-background-shapes {
-  @apply fixed pointer-events-none inset-x-0 top-0 flex justify-center overflow-hidden black:hidden;
-
-  &--preview {
-    position: absolute;
-  }
-
-  > div {
-    height: 100vh;
-    width: 100vw;
-    @apply bg-gradient-sm lg:bg-gradient-light lg:dark:bg-gradient-dark;
-  }
-}
-
 .⁂-widget {
   @apply border-b border-solid border-gray-200 black:border-gray-800 dark:border-primary-800;
   display: flex;
@@ -445,7 +431,6 @@ body {
   }
 }
 
-div:has(.⁂-background-shapes),
 .dark {
   .⁂-widget {
     @include mixins.card($variant: rounded);