-
-
Notifications
You must be signed in to change notification settings - Fork 41
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Fix direction component and remove unfinished flag
- Loading branch information
Showing
7 changed files
with
49 additions
and
52 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
17 changes: 17 additions & 0 deletions
17
website/app/[locale]/(root)/docs/direction/components/Basic.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,17 @@ | ||
import Demo from 'websites/components/Demo' | ||
import DemoPanel from 'websites/components/DemoPanel' | ||
import Code from 'websites/components/Code' | ||
import clsx from 'clsx' | ||
|
||
export default ({ className }: any) => { | ||
return ( | ||
<> | ||
<Demo $py={0}> | ||
<DemoPanel> | ||
<p className={clsx(className, 'm:0')}>There are a wide variety of animals in the world, and each one has its own unique set of characteristics and habits.</p> | ||
</DemoPanel> | ||
</Demo> | ||
<Code lang="html">{`<p class="**${className}**">There are a wide variety of animals in the world …</p>`}</Code> | ||
</> | ||
) | ||
} |
41 changes: 16 additions & 25 deletions
41
website/app/[locale]/(root)/docs/direction/components/Overview.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,27 +1,18 @@ | ||
'use client' | ||
|
||
import Demo from 'websites/components/Demo' | ||
import Code from 'websites/components/Code' | ||
import SyntaxTable from '~/components/SyntaxTable' | ||
import syntaxes from '../syntaxes' | ||
import line from 'to-line' | ||
import SyntaxTable from '~/components/SyntaxTable' | ||
import SyntaxTr from '~/components/SyntaxTr' | ||
import SyntaxPreview from './SyntaxPreview' | ||
|
||
export default () => | ||
<SyntaxTable value={syntaxes} default="direction:ltr"> | ||
{(className: string) => | ||
<> | ||
<Demo className="py:0!"> | ||
<div className={line(className, 'w:full bg:white@light bg:gray-20@dark p:30')}> | ||
<div className="f:28 f:bold">Animals</div> | ||
<p>There are a wide variety of animals in the world, and each one has its own unique set of characteristics and habits.</p> | ||
</div> | ||
</Demo> | ||
<Code lang="html">{` | ||
<div class="**${className}**"> | ||
<h3>Animals</h3> | ||
<p>There are a wide variety of animals in the world …</p> | ||
</div> | ||
`}</Code> | ||
</> | ||
} | ||
</SyntaxTable> | ||
export default () => { | ||
const previewSyntax = 'direction:ltr' | ||
return ( | ||
<> | ||
<SyntaxTable> | ||
{syntaxes.map((syntax) => | ||
<SyntaxTr value={syntax} key={syntax} previewSyntax={previewSyntax}></SyntaxTr>) | ||
} | ||
</SyntaxTable> | ||
<SyntaxPreview className={previewSyntax} /> | ||
</> | ||
) | ||
} |
10 changes: 10 additions & 0 deletions
10
website/app/[locale]/(root)/docs/direction/components/SyntaxPreview.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,10 @@ | ||
'use client' | ||
|
||
import useSelectedPreviewSyntax from '~/utils/use-selected-preview-syntax' | ||
import Basic from './Basic' | ||
|
||
export default (props: any) => { | ||
return ( | ||
<Basic className={useSelectedPreviewSyntax(props.className)} /> | ||
) | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,3 +1,6 @@ | ||
const syntaxes = [['direction:ltr'], ['direction:rtl']] | ||
const syntaxes = [ | ||
'direction:ltr', | ||
'direction:rtl' | ||
] | ||
|
||
export default syntaxes |