mirror of
https://github.com/owncast/owncast.git
synced 2024-10-10 19:16:02 +00:00
2cfb336411
weird 0 popping out when toggling chat. wasn't able to find which component is responsible. Used bare mininum scss. May refactor in the future.
102 lines
2.6 KiB
SCSS
102 lines
2.6 KiB
SCSS
@import url('../public/fonts/inter/inter.css');
|
|
|
|
// See theme.less for specific Ant Design overrides.
|
|
:root {
|
|
// old colors
|
|
--white: rgba(255, 255, 255, 1);
|
|
--white-15: rgba(255, 255, 255, 0.15);
|
|
--white-25: rgba(255, 255, 255, 0.25);
|
|
--white-35: rgba(255, 255, 255, 0.35);
|
|
--white-50: rgba(255, 255, 255, 0.5);
|
|
--white-75: rgba(255, 255, 255, 0.75);
|
|
--white-88: rgba(255, 255, 255, 0.88);
|
|
|
|
--black: rgba(0, 0, 0, 1);
|
|
--black-35: rgba(0, 0, 0, 0.35);
|
|
--black-50: rgba(0, 0, 0, 0.5);
|
|
--black-75: rgba(0, 0, 0, 0.75);
|
|
|
|
// New colors
|
|
--purple-100: #f4ebff;
|
|
--purple-300: #d6bbfb;
|
|
--purple-500: #9e77ed;
|
|
--purple-700: #6941c6;
|
|
--purple-900: #42307d;
|
|
|
|
--green-100: #d15ad5;
|
|
--green-300: #6ce9a6;
|
|
--green-500: #12b76a;
|
|
--green-700: #027a48;
|
|
--green-900: #054f31;
|
|
|
|
--red-100: #fee4e2;
|
|
--red-300: #fda29b;
|
|
--red-500: #f04438;
|
|
--red-700: #b42318;
|
|
--red-900: #7a271a;
|
|
|
|
--orange-100: #fef0c7;
|
|
--orange-300: #fec84b;
|
|
--orange-500: #f79009;
|
|
--orange-700: #b54708;
|
|
--orange-900: #93370d;
|
|
|
|
--gray-100: #f2f4f7;
|
|
--gray-300: #d0d5dd;
|
|
--gray-500: #667085;
|
|
--gray-700: #344054;
|
|
--gray-900: #101828;
|
|
|
|
// owncast logo color family
|
|
--owncast-purple: rgba(120, 113, 255, 1);
|
|
--purple-dark: rgba(28, 26, 59, 1); // #1c1a3b;
|
|
--pink: rgba(201, 139, 254, 1); // #D18BFE;
|
|
--blue: rgba(32, 134, 225, 1); // #2086E1;
|
|
|
|
// owncast purple variations
|
|
--owncast-purple-25: rgba(120, 113, 255, 0.25);
|
|
--owncast-purple-50: rgba(120, 113, 255, 0.5);
|
|
|
|
--gray-light: rgba(168, 175, 197, 1);
|
|
--gray-medium: rgba(102, 107, 120, 1);
|
|
--gray: rgba(51, 53, 60, 1);
|
|
--gray-dark: rgba(23, 24, 27, 1); // #17181b;
|
|
|
|
--online-color: #73dd3f;
|
|
--offline-color: #999;
|
|
|
|
// ////////////////////////////////
|
|
--default-text-color: var(--white-88);
|
|
--default-bg-color: var(--black);
|
|
--default-link-color: var(--owncast-purple);
|
|
|
|
--container-bg-color: var(--gray-dark);
|
|
--container-bg-color-alt: var(--purple-dark);
|
|
--container-border-radius: 4px;
|
|
|
|
--code-color: #9cdcfe;
|
|
--code-bg-color: var(--owncast-purple-25);
|
|
|
|
--nav-bg-color: var(--gray-dark);
|
|
--nav-text: #aaa;
|
|
--nav-selected-text: var(--pink); //#cd7cff;
|
|
|
|
--button-focused: var(--owncast-purple-50);
|
|
|
|
--textfield-border: var(--white-25);
|
|
--textfield-bg: var(--black);
|
|
|
|
//
|
|
--popover-base-color: var(--gray);
|
|
--tooltip-base-color: var(--gray-medium);
|
|
|
|
--font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
|
|
'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
|
|
'Segoe UI Symbol', 'Noto Color Emoji';
|
|
|
|
// chat variables
|
|
--header-h: 64px;
|
|
--chat-w: 300px;
|
|
--chat-input-h: 40.5px;
|
|
}
|