You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
81 lines
2.1 KiB
81 lines
2.1 KiB
@import '@fontsource/open-sans'; |
|
@import '@fontsource/poppins'; |
|
|
|
// 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; |
|
|
|
--nav-bg-color: var(--gray-dark); |
|
|
|
--textfield-border: var(--white-25); |
|
}
|
|
|