rmorawski/standardnotes-app-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: tailwind classname sorting (#1169)

Browse Source
This commit is contained in:
Aman Harwara
2022-06-28 13:37:38 +05:30
committed by GitHub
parent 15ca2d358b
commit ee5b6627da
159 changed files with 565 additions and 549 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/web/src/javascripts/Components/QuickSettingsMenu/FocusModeSwitch.tsx
View File

@@ -33,11 +33,11 @@ const FocusModeSwitch: FunctionComponent<Props> = ({ application, onToggle, onCl
return (
<>
<button
className="flex items-center border-0 cursor-pointer hover:bg-contrast hover:text-foreground text-text bg-transparent px-3 py-1.5 text-left w-full focus:bg-info-backdrop focus:shadow-none text-sm focus:bg-info-backdrop focus:shadow-none justify-between"
className="flex w-full cursor-pointer items-center justify-between border-0 bg-transparent px-3 py-1.5 text-left text-sm text-text hover:bg-contrast hover:text-foreground focus:bg-info-backdrop focus:bg-info-backdrop focus:shadow-none focus:shadow-none"
onClick={toggle}
>
<div className="flex items-center">
<Icon type="menu-close" className="text-neutral mr-2" />
<Icon type="menu-close" className="mr-2 text-neutral" />
Focused Writing
</div>
{isEntitled ? (

24
packages/web/src/javascripts/Components/QuickSettingsMenu/QuickSettingsMenu.tsx
View File

@@ -207,22 +207,22 @@ const QuickSettingsMenu: FunctionComponent<MenuProps> = ({ application, viewCont
return (
<div ref={mainRef} className="sn-component">
<div
className={`z-footer-bar-item-panel bottom-full left-0 cursor-auto absolute bg-default rounded shadow-main min-w-80 max-h-120 max-w-xs flex flex-col py-2 overflow-y-auto ${
shouldAnimateCloseMenu ? 'slide-up-animation' : 'transition-transform duration-150 slide-down-animation'
className={`max-h-120 absolute bottom-full left-0 z-footer-bar-item-panel flex min-w-80 max-w-xs cursor-auto flex-col overflow-y-auto rounded bg-default py-2 shadow-main ${
shouldAnimateCloseMenu ? 'slide-up-animation' : 'slide-down-animation transition-transform duration-150'
}`}
ref={quickSettingsMenuRef}
onKeyDown={handleQuickSettingsKeyDown}
>
<div className="px-3 mt-1 mb-2 font-semibold text-text text-sm uppercase">Quick Settings</div>
<div className="mt-1 mb-2 px-3 text-sm font-semibold uppercase text-text">Quick Settings</div>
<Disclosure open={themesMenuOpen} onChange={toggleThemesMenu}>
<DisclosureButton
onKeyDown={handleBtnKeyDown}
onBlur={closeOnBlur}
ref={themesButtonRef}
className="flex items-center border-0 cursor-pointer hover:bg-contrast hover:text-foreground text-text bg-transparent px-3 py-1.5 text-left w-full text-sm justify-between focus:bg-info-backdrop focus:shadow-none"
className="flex w-full cursor-pointer items-center justify-between border-0 bg-transparent px-3 py-1.5 text-left text-sm text-text hover:bg-contrast hover:text-foreground focus:bg-info-backdrop focus:shadow-none"
>
<div className="flex items-center">
<Icon type="themes" className="text-neutral mr-2" />
<Icon type="themes" className="mr-2 text-neutral" />
Themes
</div>
<Icon type="chevron-right" className="text-neutral" />
@@ -236,11 +236,11 @@ const QuickSettingsMenu: FunctionComponent<MenuProps> = ({ application, viewCont
}}
className={`${
themesMenuOpen ? 'flex' : 'hidden'
} flex-col py-2 bg-default rounded shadow-main min-w-80 max-h-120 max-w-xs overflow-y-auto fixed transition-transform duration-150 slide-down-animation`}
} max-h-120 slide-down-animation fixed min-w-80 max-w-xs flex-col overflow-y-auto rounded bg-default py-2 shadow-main transition-transform duration-150`}
>
<div className="px-3 my-1 font-semibold text-text text-sm uppercase">Themes</div>
<div className="my-1 px-3 text-sm font-semibold uppercase text-text">Themes</div>
<button
className="flex items-center border-0 cursor-pointer hover:bg-contrast hover:text-foreground text-text bg-transparent px-3 py-1.5 text-left w-full text-sm focus:bg-info-backdrop focus:shadow-none"
className="flex w-full cursor-pointer items-center border-0 bg-transparent px-3 py-1.5 text-left text-sm text-text hover:bg-contrast hover:text-foreground focus:bg-info-backdrop focus:shadow-none"
onClick={toggleDefaultTheme}
onBlur={closeOnBlur}
ref={defaultThemeButtonRef}
@@ -260,14 +260,14 @@ const QuickSettingsMenu: FunctionComponent<MenuProps> = ({ application, viewCont
</Disclosure>
{toggleableComponents.map((component) => (
<button
className="flex items-center border-0 cursor-pointer hover:bg-contrast hover:text-foreground text-text bg-transparent px-3 py-1.5 text-left w-full text-sm justify-between focus:bg-info-backdrop focus:shadow-none"
className="flex w-full cursor-pointer items-center justify-between border-0 bg-transparent px-3 py-1.5 text-left text-sm text-text hover:bg-contrast hover:text-foreground focus:bg-info-backdrop focus:shadow-none"
onClick={() => {
toggleComponent(component)
}}
key={component.uuid}
>
<div className="flex items-center">
<Icon type="window" className="text-neutral mr-2" />
<Icon type="window" className="mr-2 text-neutral" />
{component.displayName}
</div>
<Switch checked={component.active} className="px-0" />
@@ -281,11 +281,11 @@ const QuickSettingsMenu: FunctionComponent<MenuProps> = ({ application, viewCont
/>
<HorizontalSeparator classes="my-2" />
<button
className="flex items-center border-0 cursor-pointer hover:bg-contrast hover:text-foreground text-text bg-transparent px-3 py-1.5 text-left w-full text-sm focus:bg-info-backdrop focus:shadow-none"
className="flex w-full cursor-pointer items-center border-0 bg-transparent px-3 py-1.5 text-left text-sm text-text hover:bg-contrast hover:text-foreground focus:bg-info-backdrop focus:shadow-none"
onClick={openPreferences}
ref={prefsButtonRef}
>
<Icon type="more" className="text-neutral mr-2" />
<Icon type="more" className="mr-2 text-neutral" />
Open Preferences
</button>
</div>

6
packages/web/src/javascripts/Components/QuickSettingsMenu/ThemesMenuButton.tsx
View File

@@ -46,7 +46,7 @@ const ThemesMenuButton: FunctionComponent<Props> = ({ application, item, onBlur
return (
<button
className={
'flex items-center border-0 cursor-pointer hover:bg-contrast hover:text-foreground text-text bg-transparent px-3 py-1.5 text-left w-full focus:bg-info-backdrop focus:shadow-none text-sm focus:bg-info-backdrop focus:shadow-none justify-between'
'flex w-full cursor-pointer items-center justify-between border-0 bg-transparent px-3 py-1.5 text-left text-sm text-text hover:bg-contrast hover:text-foreground focus:bg-info-backdrop focus:bg-info-backdrop focus:shadow-none focus:shadow-none'
}
onClick={toggleTheme}
onBlur={onBlur}
@@ -54,7 +54,7 @@ const ThemesMenuButton: FunctionComponent<Props> = ({ application, item, onBlur
{item.component?.isLayerable() ? (
<>
<div className="flex items-center">
<Switch className="px-0 mr-2" checked={item.component?.active} />
<Switch className="mr-2 px-0" checked={item.component?.active} />
{item.name}
</div>
{!canActivateTheme && <Icon type="premium-feature" />}
@@ -67,7 +67,7 @@ const ThemesMenuButton: FunctionComponent<Props> = ({ application, item, onBlur
</div>
{item.component && canActivateTheme ? (
<div
className="w-5 h-5 rounded-full"
className="h-5 w-5 rounded-full"
style={{
backgroundColor: item.component.package_info?.dock_icon?.background_color,
}}