Redocly/redoc
1
1
Fork 0
mirror of https://github.com/Redocly/redoc.git synced 2025-08-08 22:24:54 +03:00
Code Issues Packages Projects Releases Wiki Activity

feat: add direction to the redoc styled component

Browse Source 
this feature let users to set direction and it's officially start point of RTL
This commit is contained in:
Arian Rahimi 2019-08-25 13:37:57 +04:30
parent 1b3e0ced7b
commit 574d4032c1
2 changed files with 4 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/components/Redoc/styled.elements.tsx
View File

@ -10,6 +10,7 @@ export const RedocWrap = styled.div`
display: flex; display: flex;
position: relative; position: relative;
text-align: left; text-align: left;
direction: ${theme.typography.direction};
-webkit-font-smoothing: ${theme.typography.smoothing}; -webkit-font-smoothing: ${theme.typography.smoothing};
font-smoothing: ${theme.typography.smoothing}; font-smoothing: ${theme.typography.smoothing};
@ -42,7 +43,7 @@ export const BackgroundStub = styled.div`
position: absolute; position: absolute;
top: 0; top: 0;
bottom: 0; bottom: 0;
right: 0; ${({ theme }) => theme.typography.direction === 'ltr' ? 'right: 0;' : 'left: 0;'};
width: ${({ theme }) => { width: ${({ theme }) => {
if (theme.rightPanel.width.endsWith('%')) { if (theme.rightPanel.width.endsWith('%')) {
const percents = parseInt(theme.rightPanel.width, 10); const percents = parseInt(theme.rightPanel.width, 10);

2
src/theme.ts
View File

@ -273,6 +273,8 @@ export interface ResolvedThemeInterface {
fontWeightBold: string; fontWeightBold: string;
fontFamily: string; fontFamily: string;
direction?: 'ltr' | 'rtl',
smoothing: string; smoothing: string;
optimizeSpeed: boolean; optimizeSpeed: boolean;