From 7cee514acbac3c1a0d4123421c59f0e4c972c50d Mon Sep 17 00:00:00 2001 From: Prozilla Date: Wed, 5 Jun 2024 21:46:34 +0200 Subject: [PATCH] Updated CSS class naming convention --- docs/README.md | 3 +- index.html | 4 +- package.json | 2 +- public/apple-touch-icon.png | Bin 0 -> 17030 bytes .../_utils/button/Button.module.css | 4 +- src/components/_utils/button/Button.tsx | 2 +- .../dropdown-button/DropdownButton.module.css | 2 +- .../_utils/dropdown-button/DropdownButton.tsx | 10 +- .../progress-bar/ProgressBar.module.css | 4 +- .../_utils/progress-bar/ProgressBar.tsx | 2 +- src/components/actions/Actions.module.css | 54 +++++------ src/components/actions/Actions.tsx | 13 +-- .../actions/actions/ClickAction.tsx | 2 +- .../actions/actions/DropdownAction.tsx | 4 +- .../_utils/header-menu/HeaderMenu.module.css | 2 +- .../apps/_utils/header-menu/HeaderMenu.tsx | 5 +- .../apps/_utils/web-view/WebView.module.css | 4 +- .../apps/_utils/web-view/WebView.tsx | 3 +- .../apps/browser/Browser.module.css | 20 ++-- src/components/apps/browser/Browser.tsx | 16 ++-- .../apps/calculator/Calculator.module.css | 12 +-- src/components/apps/calculator/Calculator.tsx | 14 +-- .../file-explorer/FileExplorer.module.css | 24 ++--- .../apps/file-explorer/FileExplorer.tsx | 20 ++-- .../apps/file-explorer/ImportButton.tsx | 2 +- .../apps/file-explorer/QuickAccessButton.tsx | 2 +- .../directory-list/DirectoryList.module.css | 26 +++--- .../directory-list/DirectoryList.tsx | 12 +-- .../directory-list/ImagePreview.module.css | 6 +- .../directory-list/ImagePreview.tsx | 2 +- .../apps/logic-sim/CircuitView.module.css | 2 +- src/components/apps/logic-sim/CircuitView.tsx | 2 +- .../apps/logic-sim/LogicSim.module.css | 2 +- src/components/apps/logic-sim/LogicSim.tsx | 2 +- .../apps/media-viewer/MediaViewer.module.css | 4 +- .../apps/media-viewer/MediaViewer.tsx | 2 +- .../apps/settings/Settings.module.css | 60 ++++++------ src/components/apps/settings/Settings.tsx | 30 +++--- .../apps/settings/tabs/AboutSettings.tsx | 12 +-- .../apps/settings/tabs/AppOption.tsx | 14 +-- .../apps/settings/tabs/AppearanceSettings.tsx | 18 ++-- .../apps/settings/tabs/AppsSettings.tsx | 4 +- .../apps/settings/tabs/StorageSettings.tsx | 18 ++-- .../apps/text-editor/TextEditor.module.css | 10 +- .../apps/text-editor/TextEditor.tsx | 2 +- src/components/desktop/Desktop.module.css | 2 +- src/components/desktop/Desktop.tsx | 2 +- src/components/modals/ModalView.module.css | 4 +- src/components/modals/ModalView.tsx | 2 +- src/components/modals/ModalsView.module.css | 2 +- src/components/modals/ModalsView.tsx | 2 +- .../modals/_utils/WindowedModal.module.css | 2 +- .../modals/_utils/WindowedModal.tsx | 4 +- .../modals/dialog-box/DialogBox.module.css | 88 +----------------- .../modals/dialog-box/DialogBox.tsx | 2 +- .../file-properties/FileProperties.module.css | 8 +- .../modals/file-properties/FileProperties.tsx | 28 +++--- src/components/modals/share/Share.module.css | 6 +- src/components/modals/share/Share.tsx | 6 +- src/components/taskbar/Taskbar.module.css | 62 ++++++------ src/components/taskbar/Taskbar.tsx | 18 ++-- .../taskbar/menus/AppList.module.css | 14 +-- .../taskbar/menus/HomeMenu.module.css | 4 +- src/components/taskbar/menus/HomeMenu.tsx | 12 +-- .../taskbar/menus/SearchMenu.module.css | 14 +-- src/components/taskbar/menus/SearchMenu.tsx | 8 +- .../taskbar/menus/UtilMenu.module.css | 10 +- src/components/taskbar/menus/UtilMenu.tsx | 4 +- src/components/windows/WindowView.tsx | 2 +- src/config/actions.config.ts | 7 ++ src/features/_utils/classNames.utils.ts | 15 +++ src/features/_utils/time.utils.ts | 13 +++ .../apps/terminal/commands/neofetch.ts | 5 +- src/features/apps/terminal/commands/uptime.ts | 5 +- src/hooks/modals/contextMenu.tsx | 3 +- src/index.tsx | 11 +-- src/reportWebVitals.ts | 15 --- src/styles/utils.module.css | 8 +- 78 files changed, 384 insertions(+), 462 deletions(-) create mode 100644 public/apple-touch-icon.png create mode 100644 src/config/actions.config.ts create mode 100644 src/features/_utils/classNames.utils.ts create mode 100644 src/features/_utils/time.utils.ts delete mode 100644 src/reportWebVitals.ts diff --git a/docs/README.md b/docs/README.md index 07c672a..2c9a76c 100644 --- a/docs/README.md +++ b/docs/README.md @@ -68,9 +68,10 @@ Type | Case | Example Folders | kebab-case | `virtual-drive` `.ts` files | camelCase | `virtualRoot.ts` `.tsx` files | PascalCase | `Desktop.tsx` -`.css` files & files in `public` dir | kebab-case | `global.css` +`.css` files & static assets | kebab-case | `global.css` Local `.module.css` files | PascalCase | `Desktop.module.css` Global `.module.css` files | kebab-case | `utils.module.css` +CSS class names | PascalCase | ```.WindowsView``` Variables | camelCase | ```const fooBar = true;``` Global constant variables | MACRO_CASE | ```export const NAME = "ProzillaOS";``` Classes | PascalCase | ```class WindowsManager { }``` diff --git a/index.html b/index.html index b988fde..5723649 100644 --- a/index.html +++ b/index.html @@ -9,13 +9,13 @@ - + - + diff --git a/package.json b/package.json index dd7d1f6..ed881e1 100644 --- a/package.json +++ b/package.json @@ -7,7 +7,7 @@ "repository": "https://github.com/Prozilla/ProzillaOS", "type": "module", "scripts": { - "start": "vite --port 3000", + "start": "vite --port 3000 --host", "build": "tsc && vite build", "serve": "vite preview", "predeploy": "npm run build", diff --git a/public/apple-touch-icon.png b/public/apple-touch-icon.png new file mode 100644 index 0000000000000000000000000000000000000000..a25a24f2c42f7e2e6eddc8edbc49b9080d3d7d01 GIT binary patch literal 17030 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 literal 0 HcmV?d00001 diff --git a/src/components/_utils/button/Button.module.css b/src/components/_utils/button/Button.module.css index d633b6f..0dc34d2 100644 --- a/src/components/_utils/button/Button.module.css +++ b/src/components/_utils/button/Button.module.css @@ -16,10 +16,10 @@ background-color: var(--hover-color); } -.Button-link { +.ButtonLink { text-decoration: none; } -.Button-link > svg { +.ButtonLink > svg { margin-left: 0.5rem; } \ No newline at end of file diff --git a/src/components/_utils/button/Button.tsx b/src/components/_utils/button/Button.tsx index 789c044..bc91c50 100644 --- a/src/components/_utils/button/Button.tsx +++ b/src/components/_utils/button/Button.tsx @@ -17,7 +17,7 @@ export function Button(props: ButtonProps) { className = `${styles.Button} ${className}`; if (href != null) { - className = `${styles["Button-link"]} ${className}`; + className = `${styles.ButtonLink} ${className}`; return (} props.options - * @param {Object} props.shortcuts - */ -export function DropdownButton({ label, options, shortcuts }) { +export function DropdownButton({ label, options, shortcuts }: { label: string; options: { [s: string]: Function; }; shortcuts: { [s: string]: string[]; }; }) { const [open, setOpen] = useState(false); const [tabIndex, setTabIndex] = useState(-1); @@ -19,7 +13,7 @@ export function DropdownButton({ label, options, shortcuts }) { return ( { setOpen(false); }}> -
+
diff --git a/src/components/_utils/progress-bar/ProgressBar.module.css b/src/components/_utils/progress-bar/ProgressBar.module.css index e0c949b..6a555fc 100644 --- a/src/components/_utils/progress-bar/ProgressBar.module.css +++ b/src/components/_utils/progress-bar/ProgressBar.module.css @@ -1,10 +1,10 @@ -.Container { +.ProgressBar { position: relative; width: 15rem; max-width: 100%; min-height: 2rem; max-height: 100%; - background-color: var(--background-color-3); + background-color: var(--background-color-4); } .Fill { diff --git a/src/components/_utils/progress-bar/ProgressBar.tsx b/src/components/_utils/progress-bar/ProgressBar.tsx index 62db103..84cd993 100644 --- a/src/components/_utils/progress-bar/ProgressBar.tsx +++ b/src/components/_utils/progress-bar/ProgressBar.tsx @@ -21,7 +21,7 @@ interface ProgressBarProps { export function ProgressBar({ fillPercentage, fillColor, backgroundColor, align = "left", className = "" }: ProgressBarProps) { return ( -
+
svg { +.ContextMenu .Icon > svg { width: 100%; height: 100%; object-fit: contain; } -.Context-menu .Image-icon { +.ContextMenu .ImageIcon { position: absolute; width: 1rem; height: auto; aspect-ratio: 1; } -.Context-menu .Image-icon div { +.ContextMenu .ImageIcon div { display: flex; width: 100%; height: 100%; } -.Context-menu .Image-icon div > svg { +.ContextMenu .ImageIcon div > svg { width: 100%; height: 100%; object-fit: contain; } -.Context-menu .Shortcut { +.ContextMenu .Shortcut { color: var(--foreground-color-1); } -.Context-menu .Dropdown { +.ContextMenu .Dropdown { position: relative; } -.Context-menu .Dropdown .Dropdown-content { +.ContextMenu .Dropdown .DropdownContent { opacity: 1; position: absolute; top: calc(var(--padding) * -1); @@ -132,12 +132,12 @@ cursor: auto; } -.Context-menu .Dropdown:not(.Active) .Dropdown-content { +.ContextMenu .Dropdown:not(.Active) .DropdownContent { opacity: 0; pointer-events: none; } -.Context-menu .Divider { +.ContextMenu .Divider { width: calc(100% - 0.5rem); height: 2px; border-radius: var(--border-radius-99); @@ -174,11 +174,11 @@ height: 100%; } -.Header-menu .Dropdown-arrow { +.Header-menu .DropdownArrow { display: none; } -.Header-menu .Dropdown-content { +.Header-menu .DropdownContent { display: flex; flex-direction: column; position: absolute; @@ -190,7 +190,7 @@ border-bottom-right-radius: 0.5rem; } -.Header-menu .Dropdown:not(.Active) .Dropdown-content { +.Header-menu .Dropdown:not(.Active) .DropdownContent { opacity: 0; pointer-events: none; } diff --git a/src/components/actions/Actions.tsx b/src/components/actions/Actions.tsx index d0fe1d5..7d49428 100644 --- a/src/components/actions/Actions.tsx +++ b/src/components/actions/Actions.tsx @@ -2,12 +2,7 @@ import { Children, cloneElement, isValidElement, ReactElement, ReactNode, Ref } import { useShortcuts } from "../../hooks/_utils/keyboard"; import styles from "./Actions.module.css"; import { useScreenBounds } from "../../hooks/_utils/screen"; - -export const STYLES = { - CONTEXT_MENU: styles["Context-menu"], - SHORTCUTS_LISTENER: styles["Shortcuts-listener"], - HEADER_MENU: styles["Header-menu"] -}; +import { STYLES } from "../../config/actions.config"; export interface ActionProps { actionId?: string; @@ -84,13 +79,13 @@ export function Actions({ children, className, onAnyTrigger, triggerParams, avoi if (isListener) return iterateOverChildren(children) as ReactElement; - const classNames = [styles.Container]; + const classNames = [styles.Actions]; if (className != null) classNames.push(className); if (alignLeft) - classNames.push(styles["Align-left"]); + classNames.push(styles.AlignLeft); if (alignTop) - classNames.push(styles["Align-top"]); + classNames.push(styles.AlignTop); if (!initiated) classNames.push(styles.Uninitiated); diff --git a/src/components/actions/actions/ClickAction.tsx b/src/components/actions/actions/ClickAction.tsx index b5d4db7..67f9f94 100644 --- a/src/components/actions/actions/ClickAction.tsx +++ b/src/components/actions/actions/ClickAction.tsx @@ -15,7 +15,7 @@ export const ClickAction = memo(({ actionId, label, shortcut, onTrigger, icon }: {icon &&
{typeof icon == "string" - ? + ? : }
} diff --git a/src/components/actions/actions/DropdownAction.tsx b/src/components/actions/actions/DropdownAction.tsx index 730094b..1e08a79 100644 --- a/src/components/actions/actions/DropdownAction.tsx +++ b/src/components/actions/actions/DropdownAction.tsx @@ -32,8 +32,8 @@ export function DropdownAction({ label, icon, children, showOnHover = true }: Dr {icon &&
}

{label}

 -
-
+
+
{children}
diff --git a/src/components/apps/_utils/header-menu/HeaderMenu.module.css b/src/components/apps/_utils/header-menu/HeaderMenu.module.css index 40dc069..6dced08 100644 --- a/src/components/apps/_utils/header-menu/HeaderMenu.module.css +++ b/src/components/apps/_utils/header-menu/HeaderMenu.module.css @@ -1,4 +1,4 @@ -.Container { +.HeaderMenu { display: flex; width: 100%; height: 1.5rem; diff --git a/src/components/apps/_utils/header-menu/HeaderMenu.tsx b/src/components/apps/_utils/header-menu/HeaderMenu.tsx index 549c18c..71917c4 100644 --- a/src/components/apps/_utils/header-menu/HeaderMenu.tsx +++ b/src/components/apps/_utils/header-menu/HeaderMenu.tsx @@ -1,9 +1,10 @@ import styles from "./HeaderMenu.module.css"; -import { ActionsProps, Actions, STYLES } from "../../../actions/Actions"; +import { ActionsProps, Actions } from "../../../actions/Actions"; +import { STYLES } from "../../../../config/actions.config"; export function HeaderMenu({ children, ...props }: ActionsProps) { - return
+ return
{children} diff --git a/src/components/apps/_utils/web-view/WebView.module.css b/src/components/apps/_utils/web-view/WebView.module.css index 7f82bf1..e1a43c8 100644 --- a/src/components/apps/_utils/web-view/WebView.module.css +++ b/src/components/apps/_utils/web-view/WebView.module.css @@ -1,4 +1,4 @@ -.Container { +.WebView { display: flex; justify-content: center; align-items: center; @@ -6,7 +6,7 @@ height: 100%; } -.Web-view { +.WebView > iframe { width: 100%; height: 100%; border: none; diff --git a/src/components/apps/_utils/web-view/WebView.tsx b/src/components/apps/_utils/web-view/WebView.tsx index 899c356..c50f613 100644 --- a/src/components/apps/_utils/web-view/WebView.tsx +++ b/src/components/apps/_utils/web-view/WebView.tsx @@ -35,12 +35,11 @@ export const WebView: FC = forwardRef(({ source setHovered(false); }; - return
+ return