mirror of
https://github.com/Redocly/redoc.git
synced 2025-08-08 14:14:56 +03:00
begin modifying theme for OT brand
This commit is contained in:
parent
5ecd0c7fff
commit
d472dff9a8
|
@ -1,10 +1,10 @@
|
||||||
import { observer } from 'mobx-react';
|
import { observer } from 'mobx-react';
|
||||||
import * as React from 'react';
|
import * as React from 'react';
|
||||||
|
|
||||||
|
import { PerfectScrollbarWrap } from '../../common-elements/perfect-scrollbar';
|
||||||
|
|
||||||
import { IMenuItem, MenuStore } from '../../services/MenuStore';
|
import { IMenuItem, MenuStore } from '../../services/MenuStore';
|
||||||
import { MenuItems } from './MenuItems';
|
import { MenuItems } from './MenuItems';
|
||||||
|
|
||||||
import { PerfectScrollbarWrap } from '../../common-elements/perfect-scrollbar';
|
|
||||||
import { RedocAttribution } from './styled.elements';
|
import { RedocAttribution } from './styled.elements';
|
||||||
|
|
||||||
@observer
|
@observer
|
||||||
|
@ -23,8 +23,8 @@ export class SideMenu extends React.Component<{ menu: MenuStore; className?: str
|
||||||
>
|
>
|
||||||
<MenuItems items={store.items} onActivate={this.activate} root={true}/>
|
<MenuItems items={store.items} onActivate={this.activate} root={true}/>
|
||||||
<RedocAttribution>
|
<RedocAttribution>
|
||||||
<a target="_blank" href="https://github.com/Rebilly/ReDoc">
|
<a target="_blank" href="https://www.opentext.com/">
|
||||||
Documentation Powered by ReDoc
|
© Copyright 2019 OpenText Corp
|
||||||
</a>
|
</a>
|
||||||
</RedocAttribution>
|
</RedocAttribution>
|
||||||
</PerfectScrollbarWrap>
|
</PerfectScrollbarWrap>
|
||||||
|
|
24
src/theme.ts
24
src/theme.ts
|
@ -14,7 +14,7 @@ const defaultTheme: ThemeInterface = {
|
||||||
colors: {
|
colors: {
|
||||||
tonalOffset: 0.3,
|
tonalOffset: 0.3,
|
||||||
primary: {
|
primary: {
|
||||||
main: '#32329f',
|
main: '#232E72',
|
||||||
light: ({colors}) => lighten(colors.tonalOffset, colors.primary.main),
|
light: ({colors}) => lighten(colors.tonalOffset, colors.primary.main),
|
||||||
dark: ({colors}) => darken(colors.tonalOffset, colors.primary.main),
|
dark: ({colors}) => darken(colors.tonalOffset, colors.primary.main),
|
||||||
contrastText: ({colors}) => readableColor(colors.primary.main),
|
contrastText: ({colors}) => readableColor(colors.primary.main),
|
||||||
|
@ -99,11 +99,11 @@ const defaultTheme: ThemeInterface = {
|
||||||
fontWeightRegular: '400',
|
fontWeightRegular: '400',
|
||||||
fontWeightBold: '600',
|
fontWeightBold: '600',
|
||||||
fontWeightLight: '300',
|
fontWeightLight: '300',
|
||||||
fontFamily: 'Roboto, sans-serif',
|
fontFamily: resolveFontFamily(),
|
||||||
smoothing: 'antialiased',
|
smoothing: 'antialiased',
|
||||||
optimizeSpeed: true,
|
optimizeSpeed: true,
|
||||||
headings: {
|
headings: {
|
||||||
fontFamily: 'Montserrat, sans-serif',
|
fontFamily: resolveFontFamily(),
|
||||||
fontWeight: '400',
|
fontWeight: '400',
|
||||||
},
|
},
|
||||||
code: {
|
code: {
|
||||||
|
@ -123,8 +123,8 @@ const defaultTheme: ThemeInterface = {
|
||||||
},
|
},
|
||||||
menu: {
|
menu: {
|
||||||
width: '260px',
|
width: '260px',
|
||||||
backgroundColor: '#fafafa',
|
backgroundColor: '#F3F6FB',
|
||||||
textColor: '#333333',
|
textColor: '#232E72',
|
||||||
groupItems: {
|
groupItems: {
|
||||||
textTransform: 'uppercase',
|
textTransform: 'uppercase',
|
||||||
},
|
},
|
||||||
|
@ -150,6 +150,18 @@ const defaultTheme: ThemeInterface = {
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
|
function resolveFontFamily() {
|
||||||
|
return '' +
|
||||||
|
'"OTSans", ' +
|
||||||
|
'-apple-system, ' +
|
||||||
|
'system-ui, ' +
|
||||||
|
'BlinkMacSystemFont, ' +
|
||||||
|
'"Segoe UI", Roboto, ' +
|
||||||
|
'"Helvetica Neue", ' +
|
||||||
|
'Arial, ' +
|
||||||
|
'sans-serif';
|
||||||
|
}
|
||||||
|
|
||||||
export default defaultTheme;
|
export default defaultTheme;
|
||||||
|
|
||||||
export function resolveTheme(theme: ThemeInterface): ResolvedThemeInterface {
|
export function resolveTheme(theme: ThemeInterface): ResolvedThemeInterface {
|
||||||
|
@ -166,7 +178,7 @@ export function resolveTheme(theme: ThemeInterface): ResolvedThemeInterface {
|
||||||
counter++;
|
counter++;
|
||||||
if (counter > 1000) {
|
if (counter > 1000) {
|
||||||
throw new Error(
|
throw new Error(
|
||||||
`Theme probably contains cirucal dependency at ${currentPath}: ${val.toString()}`,
|
`Theme probably contains circular dependency at ${currentPath}: ${val.toString()}`,
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue
Block a user