refactor: move every stylesheet as sibling of their counterpart

Author: atyrode

src/frontend/src/styles/index.scss src/frontend/index.scsssrc/frontend/src/styles/index.scss renamed to src/frontend/index.scss

@@ -1,11 +1,11 @@
-@import './fonts.scss';
-@import './HtmlEditor.scss';
-@import './Editor.scss';
-@import './AuthDialog.scss';
-@import './FeedbackButton.scss';
-@import './DiscordButton.scss';
-@import './MainMenuLabel.scss';
-@import './CustomEmbeddableRenderer.scss';
+@font-face {
+    font-family: 'Roboto';
+    src: url('/assets/fonts/Roboto-VariableFont_wdth,wght.ttf') format('truetype-variations');
+    font-weight: 100 900;
+    font-stretch: 75% 100%;
+    font-style: normal;
+    font-display: swap;
+}
 
 /* Override Excalidraw styles */
 

src/frontend/index.tsx

@@ -9,7 +9,7 @@ import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
 import { queryClient } from './src/api/queryClient';
 
 import "@atyrode/excalidraw/index.css";
-import "./src/styles/index.scss";
+import "./index.scss";
 
 import type * as TExcalidraw from "@atyrode/excalidraw";
 

…src/styles/CustomEmbeddableRenderer.scss …ontend/src/CustomEmbeddableRenderer.scsssrc/frontend/src/styles/CustomEmbeddableRenderer.scss renamed to src/frontend/src/CustomEmbeddableRenderer.scss src/frontend/src/styles/CustomEmbeddableRenderer.scss renamed to src/frontend/src/CustomEmbeddableRenderer.scss

@@ -9,6 +9,7 @@ import {
   Editor,
 } from './pad';
 import { ActionButton } from './pad/buttons';
+import "./CustomEmbeddableRenderer.scss";
 
 export const renderCustomEmbeddable = (
   element: NonDeleted<ExcalidrawEmbeddableElement>,

src/frontend/src/CustomEmbeddableRenderer.tsx

@@ -1,10 +1,9 @@
 import React, { useState, useEffect, useRef } from 'react';
-import '../styles/index.scss';
 import { useWorkspaceState } from '../../api/hooks';
 // Import SVGs as modules - using relative paths from the action button location
 import { Terminal, Braces, Settings, Plus, ExternalLink, Monitor } from 'lucide-react';
 import { ActionType, TargetType, CodeVariant, ActionButtonProps } from './types';
-import '../styles/ActionButton.scss';
+import './ActionButton.scss';
 import { capture } from '../../utils/posthog';
 import { ExcalidrawElementFactory, PlacementMode } from '../../lib/ExcalidrawElementFactory';
 

…rontend/src/pad/styles/ActionButton.scss …ontend/src/pad/buttons/ActionButton.scsssrc/frontend/src/pad/styles/ActionButton.scss renamed to src/frontend/src/pad/buttons/ActionButton.scss src/frontend/src/pad/styles/ActionButton.scss renamed to src/frontend/src/pad/buttons/ActionButton.scss

@@ -1,7 +1,7 @@
 import React from 'react';
 import ActionButton from './ActionButton';
 import { TargetType, CodeVariant, ActionType } from './types';
-import '../styles/ActionButtonGrid.scss';
+import './ActionButtonGrid.scss';
 
 // Function to get button background color based on target and variant
 const getButtonColor = (target: TargetType, codeVariant?: CodeVariant): string => {

src/frontend/src/pad/buttons/ActionButton.tsx

@@ -5,8 +5,7 @@ import StateIndicator from '../controls/StateIndicator';
 import ControlButton from '../controls/ControlButton';
 import { ActionButtonGrid } from '../buttons';
 import { useWorkspaceState } from '../../api/hooks';
-import '../styles/index.scss';
-import '../styles/Dashboard.scss';
+import './Dashboard.scss';
 
 // Direct import from types
 type TargetType = 'terminal' | 'code';