BigBlueButton/bigbluebutton-Github
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #15353 from gabriellpr/contrast-record-indicator

Browse Source 
Improving contrast on recording indicator
This commit is contained in:
Ramón Souza 2022-07-13 15:20:36 +01:00 committed by GitHub
commit a0f80e0efb
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 8 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
bigbluebutton-html5/imports/ui/components/nav-bar/recording-indicator/styles.js
View File

@ -6,7 +6,7 @@ import {
borderSizeLarge,
borderSizeSmall,
} from '/imports/ui/stylesheets/styled-components/general';
import { colorWhite, colorPrimary, colorDanger, colorGray } from '/imports/ui/stylesheets/styled-components/palette';
import { colorWhite, colorPrimary, colorDangerDark, colorGray } from '/imports/ui/stylesheets/styled-components/palette';
const RecordingIndicatorIcon = styled.span`
width: ${fontSizeLarge};
@ -43,8 +43,8 @@ const RecordingControl = styled.div`
${({ recording }) => recording && `
padding: 5px;
background-color: ${colorDanger};
border: ${borderSizeLarge} solid ${colorDanger};
background-color: ${colorDangerDark};
border: ${borderSizeLarge} solid ${colorDangerDark};
border-radius: 10px;
&:focus {
@ -70,7 +70,7 @@ const PresentationTitle = styled.div`
display: flex;
flex-direction: column;
justify-content: center;
font-weight: 200;
font-weight: 400;
color: ${colorWhite};
font-size: ${fontSizeBase};
padding: 0;
@ -129,8 +129,8 @@ const RecordingStatusViewOnly = styled.div`
${({ recording }) => recording && `
padding: 5px;
background-color: ${colorDanger};
border: ${borderSizeLarge} solid ${colorDanger};
background-color: ${colorDangerDark};
border: ${borderSizeLarge} solid ${colorDangerDark};
border-radius: 10px;
`}
`;

2
bigbluebutton-html5/imports/ui/stylesheets/styled-components/palette.js
View File

@ -17,6 +17,7 @@ const colorTransparent = 'var(--color-transparent, #ff000000)';
const colorPrimary = 'var(--color-primary, #0F70D7)';
const colorDanger = 'var(--color-danger, #DF2721)';
const colorDangerDark = 'var(--color-danger-dark, #AE1010)';
const colorSuccess = 'var(--color-success, #008081)';
const colorWarning = 'var(--color-warning, purple)';
const colorOffline = `var(--color-offline, ${colorGrayLight})`;
@ -134,6 +135,7 @@ export {
colorBlueLightest,
colorPrimary,
colorDanger,
colorDangerDark,
colorSuccess,
colorWarning,
colorBackground,