mirror of
https://github.com/Redocly/redoc.git
synced 2024-11-10 19:06:34 +03:00
fix: handled style change in ServerUrl and ServersOverlay dynamically (#1989)
Co-authored-by: Alex Varchuk <olexandr.varchuk@gmail.com>
This commit is contained in:
parent
c513b28850
commit
a366de4cf6
|
@ -314,6 +314,12 @@ You can use all of the following options with the standalone version of the <red
|
|||
* `backgroundColor`: '#263238'
|
||||
* `width`: '40%'
|
||||
* `textColor`: '#ffffff'
|
||||
* `servers`
|
||||
* `overlay`
|
||||
* `backgroundColor`: '#fafafa'
|
||||
* `textColor`: '#263238'
|
||||
* `url`
|
||||
* `backgroundColor`: '#fff'
|
||||
* `fab`
|
||||
* `backgroundColor`: '#263238'
|
||||
* `color`: '#ffffff'
|
||||
|
|
|
@ -59,8 +59,8 @@ export const ServersOverlay = styled.div<{ expanded: boolean }>`
|
|||
position: absolute;
|
||||
width: 100%;
|
||||
z-index: 100;
|
||||
background: #fafafa;
|
||||
color: #263238;
|
||||
background: ${props => props.theme.rightPanel.servers.overlay.backgroundColor};
|
||||
color: ${props => props.theme.rightPanel.servers.overlay.textColor};
|
||||
box-sizing: border-box;
|
||||
box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.33);
|
||||
overflow: hidden;
|
||||
|
@ -78,7 +78,7 @@ export const ServerItem = styled.div`
|
|||
export const ServerUrl = styled.div`
|
||||
padding: 5px;
|
||||
border: 1px solid #ccc;
|
||||
background: #fff;
|
||||
background: ${props => props.theme.rightPanel.servers.url.backgroundColor};
|
||||
word-break: break-all;
|
||||
color: ${props => props.theme.colors.primary.main};
|
||||
> span {
|
||||
|
|
20
src/theme.ts
20
src/theme.ts
|
@ -164,6 +164,15 @@ const defaultTheme: ThemeInterface = {
|
|||
backgroundColor: '#263238',
|
||||
width: '40%',
|
||||
textColor: '#ffffff',
|
||||
servers: {
|
||||
overlay: {
|
||||
backgroundColor: '#fafafa',
|
||||
textColor: '#263238',
|
||||
},
|
||||
url: {
|
||||
backgroundColor: '#fff',
|
||||
},
|
||||
},
|
||||
},
|
||||
codeBlock: {
|
||||
backgroundColor: ({ rightPanel }) => darken(0.1, rightPanel.backgroundColor),
|
||||
|
@ -231,6 +240,16 @@ export interface FontSettings {
|
|||
color: string;
|
||||
}
|
||||
|
||||
export interface Servers {
|
||||
overlay: {
|
||||
backgroundColor: string;
|
||||
textColor: string;
|
||||
};
|
||||
url: {
|
||||
backgroundColor: string;
|
||||
};
|
||||
}
|
||||
|
||||
export interface ResolvedThemeInterface {
|
||||
spacing: {
|
||||
unit: number;
|
||||
|
@ -350,6 +369,7 @@ export interface ResolvedThemeInterface {
|
|||
backgroundColor: string;
|
||||
textColor: string;
|
||||
width: string;
|
||||
servers: Servers;
|
||||
};
|
||||
codeBlock: {
|
||||
backgroundColor: string;
|
||||
|
|
Loading…
Reference in New Issue
Block a user