style: tailwind classname sorting (#1169)

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

View File

@@ -2,17 +2,17 @@ import { FunctionComponent } from 'react'
export const Title: FunctionComponent = ({ children }) => (
<>
<h2 className="text-base m-0 mb-1 text-info font-bold">{children}</h2>
<h2 className="m-0 mb-1 text-base font-bold text-info">{children}</h2>
<div className="min-h-2" />
</>
)
export const Subtitle: FunctionComponent<{ className?: string }> = ({ children, className = '' }) => (
<h4 className={`font-medium text-sm m-0 mb-1 ${className}`}>{children}</h4>
<h4 className={`m-0 mb-1 text-sm font-medium ${className}`}>{children}</h4>
)
export const SubtitleLight: FunctionComponent<{ className?: string }> = ({ children, className = '' }) => (
<h4 className={`font-normal text-sm m-0 mb-1 ${className}`}>{children}</h4>
<h4 className={`m-0 mb-1 text-sm font-normal ${className}`}>{children}</h4>
)
export const Text: FunctionComponent<{ className?: string }> = ({ children, className = '' }) => (

View File

@@ -12,8 +12,8 @@ interface Props {
const PreferencesMenuItem: FunctionComponent<Props> = ({ iconType, label, selected, onClick, hasBubble }) => (
<div
className={`preferences-menu-item box-border w-auto h-auto rounded min-w-42 py-2 px-4 flex flex-row items-center justify-start text-sm cursor-pointer border-solid border select-none hover:border-border hover:bg-default ${
selected ? 'selected border-info text-info font-bold' : 'border-transparent'
className={`preferences-menu-item box-border flex h-auto w-auto min-w-42 cursor-pointer select-none flex-row items-center justify-start rounded border border-solid py-2 px-4 text-sm hover:border-border hover:bg-default ${
selected ? 'selected border-info font-bold text-info' : 'border-transparent'
}`}
onClick={(e) => {
e.preventDefault()

View File

@@ -1,7 +1,7 @@
import { FunctionComponent } from 'react'
const PreferencesGroup: FunctionComponent = ({ children }) => (
<div className="bg-default border border-solid rounded border-border p-6 flex flex-col mb-3">{children}</div>
<div className="mb-3 flex flex-col rounded border border-solid border-border bg-default p-6">{children}</div>
)
export default PreferencesGroup

View File

@@ -1,13 +1,13 @@
import { FunctionComponent } from 'react'
const PreferencesPane: FunctionComponent = ({ children }) => (
<div className="text-foreground flex-grow flex flex-row overflow-y-auto min-h-0">
<div className="flex-grow flex flex-col py-6 items-center">
<div className="w-125 max-w-125 flex flex-col">
<div className="flex min-h-0 flex-grow flex-row overflow-y-auto text-foreground">
<div className="flex flex-grow flex-col items-center py-6">
<div className="flex w-125 max-w-125 flex-col">
{children != undefined && Array.isArray(children) ? children.filter((child) => child != undefined) : children}
</div>
</div>
<div className="basis-[13.75rem] flex-shrink" />
<div className="flex-shrink basis-[13.75rem]" />
</div>
)