From 460d9e073b9488809defc221110dd5a69ae15751 Mon Sep 17 00:00:00 2001 From: Karl Scheirer Date: Tue, 27 Oct 2020 11:32:00 -0700 Subject: [PATCH 1/3] Document theme options Taken from https://redoc.ly/docs/cli/configuration/reference-docs/, just filtered to only CE options. --- README.md | 61 ++++++++++++++++++++++++++++++++++++++++++++++++++++++- 1 file changed, 60 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 92567d5e46..d593db5020 100644 --- a/README.md +++ b/README.md @@ -251,9 +251,68 @@ You can use all of the following options with standalone version on tag * `sortPropsAlphabetically` - sort properties alphabetically. * `suppressWarnings` - if set, warnings are not rendered at the top of documentation (they still are logged to the console). * `payloadSampleIdx` - if set, payload sample will be inserted at this index or last. Indexes start from 0. -* `theme` - ReDoc theme. Not documented yet. For details check source code: [theme.ts](https://github.com/Redocly/redoc/blob/master/src/theme.ts). +* `theme` - ReDoc theme. For details check [theme docs](#redoc-theme-object). * `untrustedSpec` - if set, the spec is considered untrusted and all HTML/markdown is sanitized to prevent XSS. **Disabled by default** for performance reasons. **Enable this option if you work with untrusted user data!** +### `` theme object +Theme options below designated with `#CE` are supported by Redoc Community Edition (CE). + +* `spacing` + * `unit`: 5 # CE # main spacing unit used in autocomputed theme values later + * `sectionHorizontal`: 40 # CE # Horizontal section padding. COMPUTED: spacing.unit * 8 + * `sectionVertical`: 40 # CE # Horizontal section padding. COMPUTED: spacing.unit * 8 +* `breakpoints` # CE # breakpoints for switching three/two and mobile view layouts + * `small`: '50rem' + * `medium`: '85rem' + * `large`: '105rem' +* `colors` + * `tonalOffset`: 0.3 # CE # default tonal offset used in computations +* `typography` + * `fontSize`: '14px' # CE + * `lineHeight`: '1.5em' # CE + * `fontWeightRegular`: '400' # CE + * `fontWeightBold`: '600' # CE + * `fontWeightLight`: '300' # CE + * `fontFamily`: 'Roboto, sans-serif' # CE + * `smoothing`: 'antialiased' # CE + * `optimizeSpeed`: true # CE + * `headings` + * `fontFamily`: 'Montserrat, sans-serif' # CE + * `fontWeight`: '400' # CE + * `lineHeight`: '1.6em' # CE + * `code` # inline code styling + * `fontSize`: '13px' # CE + * `fontFamily`: 'Courier, monospace' # CE + * `lineHeight`: # COMPUTED: typography.lineHeight # CE + * `fontWeight`: # COMPUTED: typography.fontWeightRegular # CE + * `color`: '#e53935' # CE + * `backgroundColor`: 'rgba(38, 50, 56, 0.05)' # CE + * `wrap`: false # whether to break word for inline blocks (otherwise they can overflow) # CE + * `links` + * `color`: # COMPUTED: colors.primary.main # CE + * `visited`: # COMPUTED: typography.links.color # CE + * `hover`: # COMPUTED: lighten(0.2 typography.links.color) # CE +* `menu` + * `width`: '260px' # CE + * `backgroundColor`: '#fafafa' # CE + * `textColor`: '#333333' # CE + * `activeTextColor`: # COMPUTED: theme.menu.textColor (if set by user) or theme.colors.primary.main # CE + * `groupItems` # Group headings # CE + * `textTransform`: 'uppercase' # CE + * `level1Items` # Level 1 items like tags or section 1st level items # CE + * `textTransform: 'none' # CE + * `arrow` # menu arrow # CE + * `size`: '1.5em' # CE + * `color`: # COMPUTED: theme.menu.textColor # CE +* `logo` + * `maxHeight`: # COMPUTED: menu.width # CE + * `maxWidth`: # COMPUTED: menu.width # CE + * `gutter`: '2px' # logo image padding # CE +* `rightPanel` + * `backgroundColor`: '#263238' # CE + * `width`: '40%' # CE + * `textColor`: '#ffffff' # CE + ## Advanced usage of standalone version Instead of adding `spec-url` attribute to the `` element you can initialize ReDoc via globally exposed `Redoc` object: ```js From 9e0c10128de13045c4f3752bc1f8ae50b099f703 Mon Sep 17 00:00:00 2001 From: Karl Scheirer Date: Tue, 27 Oct 2020 17:07:40 -0700 Subject: [PATCH 2/3] typo --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index d593db5020..dfcff39034 100644 --- a/README.md +++ b/README.md @@ -300,7 +300,7 @@ Theme options below designated with `#CE` are supported by Redoc Community Editi * `groupItems` # Group headings # CE * `textTransform`: 'uppercase' # CE * `level1Items` # Level 1 items like tags or section 1st level items # CE - * `textTransform: 'none' # CE + * `textTransform`: 'none' # CE * `arrow` # menu arrow # CE * `size`: '1.5em' # CE * `color`: # COMPUTED: theme.menu.textColor # CE From 97863d9b5091c64d79db77a6eca4abefa47ed127 Mon Sep 17 00:00:00 2001 From: Karl Scheirer Date: Thu, 19 Nov 2020 11:42:56 -0800 Subject: [PATCH 3/3] remove #CE comments removed #CE from comments, since this readme is only used for the community edition --- README.md | 88 +++++++++++++++++++++++++++---------------------------- 1 file changed, 43 insertions(+), 45 deletions(-) diff --git a/README.md b/README.md index dfcff39034..a0e0f9289f 100644 --- a/README.md +++ b/README.md @@ -255,63 +255,61 @@ You can use all of the following options with standalone version on tag * `untrustedSpec` - if set, the spec is considered untrusted and all HTML/markdown is sanitized to prevent XSS. **Disabled by default** for performance reasons. **Enable this option if you work with untrusted user data!** ### `` theme object -Theme options below designated with `#CE` are supported by Redoc Community Edition (CE). - * `spacing` - * `unit`: 5 # CE # main spacing unit used in autocomputed theme values later - * `sectionHorizontal`: 40 # CE # Horizontal section padding. COMPUTED: spacing.unit * 8 - * `sectionVertical`: 40 # CE # Horizontal section padding. COMPUTED: spacing.unit * 8 -* `breakpoints` # CE # breakpoints for switching three/two and mobile view layouts + * `unit`: 5 # main spacing unit used in autocomputed theme values later + * `sectionHorizontal`: 40 # Horizontal section padding. COMPUTED: spacing.unit * 8 + * `sectionVertical`: 40 # Horizontal section padding. COMPUTED: spacing.unit * 8 +* `breakpoints` # breakpoints for switching three/two and mobile view layouts * `small`: '50rem' * `medium`: '85rem' * `large`: '105rem' * `colors` - * `tonalOffset`: 0.3 # CE # default tonal offset used in computations + * `tonalOffset`: 0.3 # default tonal offset used in computations * `typography` - * `fontSize`: '14px' # CE - * `lineHeight`: '1.5em' # CE - * `fontWeightRegular`: '400' # CE - * `fontWeightBold`: '600' # CE - * `fontWeightLight`: '300' # CE - * `fontFamily`: 'Roboto, sans-serif' # CE - * `smoothing`: 'antialiased' # CE - * `optimizeSpeed`: true # CE + * `fontSize`: '14px' + * `lineHeight`: '1.5em' + * `fontWeightRegular`: '400' + * `fontWeightBold`: '600' + * `fontWeightLight`: '300' + * `fontFamily`: 'Roboto, sans-serif' + * `smoothing`: 'antialiased' + * `optimizeSpeed`: true * `headings` - * `fontFamily`: 'Montserrat, sans-serif' # CE - * `fontWeight`: '400' # CE - * `lineHeight`: '1.6em' # CE + * `fontFamily`: 'Montserrat, sans-serif' + * `fontWeight`: '400' + * `lineHeight`: '1.6em' * `code` # inline code styling - * `fontSize`: '13px' # CE - * `fontFamily`: 'Courier, monospace' # CE - * `lineHeight`: # COMPUTED: typography.lineHeight # CE - * `fontWeight`: # COMPUTED: typography.fontWeightRegular # CE - * `color`: '#e53935' # CE - * `backgroundColor`: 'rgba(38, 50, 56, 0.05)' # CE - * `wrap`: false # whether to break word for inline blocks (otherwise they can overflow) # CE + * `fontSize`: '13px' + * `fontFamily`: 'Courier, monospace' + * `lineHeight`: # COMPUTED: typography.lineHeight + * `fontWeight`: # COMPUTED: typography.fontWeightRegular + * `color`: '#e53935' + * `backgroundColor`: 'rgba(38, 50, 56, 0.05)' + * `wrap`: false # whether to break word for inline blocks (otherwise they can overflow) * `links` - * `color`: # COMPUTED: colors.primary.main # CE - * `visited`: # COMPUTED: typography.links.color # CE - * `hover`: # COMPUTED: lighten(0.2 typography.links.color) # CE + * `color`: # COMPUTED: colors.primary.main + * `visited`: # COMPUTED: typography.links.color + * `hover`: # COMPUTED: lighten(0.2 typography.links.color) * `menu` - * `width`: '260px' # CE - * `backgroundColor`: '#fafafa' # CE - * `textColor`: '#333333' # CE - * `activeTextColor`: # COMPUTED: theme.menu.textColor (if set by user) or theme.colors.primary.main # CE - * `groupItems` # Group headings # CE - * `textTransform`: 'uppercase' # CE - * `level1Items` # Level 1 items like tags or section 1st level items # CE - * `textTransform`: 'none' # CE - * `arrow` # menu arrow # CE - * `size`: '1.5em' # CE - * `color`: # COMPUTED: theme.menu.textColor # CE + * `width`: '260px' + * `backgroundColor`: '#fafafa' + * `textColor`: '#333333' + * `activeTextColor`: # COMPUTED: theme.menu.textColor (if set by user) or theme.colors.primary.main + * `groupItems` # Group headings + * `textTransform`: 'uppercase' + * `level1Items` # Level 1 items like tags or section 1st level items + * `textTransform`: 'none' + * `arrow` # menu arrow + * `size`: '1.5em' + * `color`: # COMPUTED: theme.menu.textColor * `logo` - * `maxHeight`: # COMPUTED: menu.width # CE - * `maxWidth`: # COMPUTED: menu.width # CE - * `gutter`: '2px' # logo image padding # CE + * `maxHeight`: # COMPUTED: menu.width + * `maxWidth`: # COMPUTED: menu.width + * `gutter`: '2px' # logo image padding * `rightPanel` - * `backgroundColor`: '#263238' # CE - * `width`: '40%' # CE - * `textColor`: '#ffffff' # CE + * `backgroundColor`: '#263238' + * `width`: '40%' + * `textColor`: '#ffffff' ## Advanced usage of standalone version Instead of adding `spec-url` attribute to the `` element you can initialize ReDoc via globally exposed `Redoc` object: