New: Native Theme Engine

Co-Authored-By: Zak Saunders <thezak48@users.noreply.github.com>
2026-04-28 23:16:32 -04:00 · 2021-11-20 17:15:30 -06:00
parent e1de523c89
commit 2291f3e00e
139 changed files with 849 additions and 456 deletions
@@ -0,0 +1,238 @@
+const sonarrBlue = '#35c5f4';
+const darkGray = '#888';
+const gray = '#adadad';
+const black = '#000';
+const white = '#fff';
+const offWhite = '#f5f7fa';
+const purple = '#7a43b6';
+const pink = '#ff69b4';
+const lightGray = '#ddd';
+
+module.exports = {
+  textColor: '#515253',
+  defaultColor: '#333',
+  disabledColor: '#999',
+  dimColor: '#555',
+  black,
+  white,
+  offWhite,
+  primaryColor: '#5d9cec',
+  selectedColor: '#f9be03',
+  successColor: '#27c24c',
+  dangerColor: '#f05050',
+  warningColor: '#ffa500',
+  infoColor: sonarrBlue,
+  purple,
+  pink,
+  sonarrBlue,
+  helpTextColor: '#909293',
+  darkGray,
+  gray,
+  lightGray,
+
+  // Theme Colors
+
+  themeBlue: sonarrBlue,
+  themeAlternateBlue: '#2193b5',
+  themeRed: '#c4273c',
+  themeDarkColor: '#3a3f51',
+  themeLightColor: '#4f566f',
+  pageBackground: '#f5f7fa',
+  pageFooterBackgroud: '#f1f1f1',
+
+  torrentColor: '#00853d',
+  usenetColor: '#17b1d9',
+
+  // Labels
+  inverseLabelColor: '#ddd',
+  inverseLabelTextColor: '#333',
+  disabledLabelColor: '#999',
+  infoTextColor: white,
+
+  // Links
+  defaultLinkHoverColor: '#fff',
+  linkColor: '#5d9cec',
+  linkHoverColor: '#1b72e2',
+
+  // Header
+  pageHeaderBackgroundColor: sonarrBlue,
+
+  // Sidebar
+
+  sidebarColor: '#e1e2e3',
+  sidebarBackgroundColor: '#3a3f51',
+  sidebarActiveBackgroundColor: '#252833',
+
+  // Toolbar
+  toolbarColor: '#e1e2e3',
+  toolbarBackgroundColor: '#4f566f',
+  toolbarMenuItemBackgroundColor: '#454b60',
+  toolbarMenuItemHoverBackgroundColor: '#3a3f51',
+  toolbarLabelColor: '#8895aa',
+
+  // Accents
+  borderColor: '#e5e5e5',
+  inputBorderColor: '#dde6e9',
+  inputBoxShadowColor: 'rgba(0, 0, 0, 0.075)',
+  inputFocusBorderColor: '#66afe9',
+  inputFocusBoxShadowColor: 'rgba(102, 175, 233, 0.6)',
+  inputErrorBorderColor: '#f05050',
+  inputErrorBoxShadowColor: 'rgba(240, 80, 80, 0.6)',
+  inputWarningBorderColor: '#ffa500',
+  inputWarningBoxShadowColor: 'rgba(255, 165, 0, 0.6)',
+  colorImpairedGradient: '#ffffff',
+  colorImpairedGradientDark: '#f4f5f6',
+  colorImpairedDangerGradient: '#d84848',
+  colorImpairedWarningGradient: '#e59400',
+  colorImpairedPrimaryGradient: '#538cd4',
+  colorImpairedGrayGradient: '#9b9b9b  ',
+
+  //
+  // Buttons
+
+  defaultButtonTextColor: '#eee',
+  defaultBackgroundColor: '#fff',
+  defaultBorderColor: '#eaeaea',
+  defaultHoverBackgroundColor: '#f5f5f5',
+  defaultHoverBorderColor: '#d6d6d6;',
+
+  primaryBackgroundColor: '#5d9cec',
+  primaryBorderColor: '#5899eb',
+  primaryHoverBackgroundColor: '#4b91ea',
+  primaryHoverBorderColor: '#3483e7;',
+
+  successBackgroundColor: '#27c24c',
+  successBorderColor: '#26be4a',
+  successHoverBackgroundColor: '#24b145',
+  successHoverBorderColor: '#1f9c3d;',
+
+  warningBackgroundColor: '#ff902b',
+  warningBorderColor: '#ff8d26',
+  warningHoverBackgroundColor: '#ff8517',
+  warningHoverBorderColor: '#fc7800;',
+
+  dangerBackgroundColor: '#f05050',
+  dangerBorderColor: '#f04b4b',
+  dangerHoverBackgroundColor: '#ee3d3d',
+  dangerHoverBorderColor: '#ec2626;',
+
+  iconButtonDisabledColor: '#7a7a7a',
+  iconButtonHoverColor: '#666',
+  iconButtonHoverLightColor: '#ccc',
+
+  //
+  // Modal
+
+  modalBackdropBackgroundColor: 'rgba(0, 0, 0, 0.6)',
+  modalBackgroundColor: '#fff',
+  modalCloseButtonHoverColor: '#888',
+
+  //
+  // Menu
+  menuItemColor: '#e1e2e3',
+  menuItemHoverColor: '#fbfcfc',
+  menuItemHoverBackgroundColor: '#f5f7fa',
+
+  //
+  // Toolbar
+
+  toobarButtonHoverColor: '#35c5f4',
+  toobarButtonSelectedColor: '#35c5f4',
+
+  //
+  // Scroller
+
+  scrollbarBackgroundColor: '#9ea4b9',
+  scrollbarHoverBackgroundColor: '#656d8c',
+
+  //
+  // Card
+
+  cardBackgroundColor: '#fff',
+  cardShadowColor: '#e1e1e1',
+  cardAlternateBackgroundColor: '#f5f5f5',
+  cardCenterBackgroundColor: '#fff',
+
+  //
+  // Alert
+
+  alertDangerBorderColor: '#ebccd1',
+  alertDangerBackgroundColor: '#f2dede',
+  alertDangerColor: '#a94442',
+
+  alertInfoBorderColor: '#bce8f1',
+  alertInfoBackgroundColor: '#d9edf7',
+  alertInfoColor: '#31708f',
+
+  alertSuccessBorderColor: '#d6e9c6',
+  alertSuccessBackgroundColor: '#dff0d8',
+  alertSuccessColor: '#3c763d',
+
+  alertWarningBorderColor: '#faebcc',
+  alertWarningBackgroundColor: '#fcf8e3',
+  alertWarningColor: '#8a6d3b',
+
+  //
+  // Slider
+
+  sliderAccentColor: '#5d9cec',
+
+  //
+  // Form
+
+  inputBackgroundColor: '#fff',
+  inputReadOnlyBackgroundColor: '#eee',
+  inputHoverBackgroundColor: '#f8f8f8',
+  inputSelectedBackgroundColor: '#e2e2e2',
+  advancedFormLabelColor: '#ff902b',
+  disabledCheckInputColor: '#ddd',
+  disabledInputColor: '#808080',
+
+  //
+  // Popover
+
+  popoverTitleBackgroundColor: '#f7f7f7',
+  popoverTitleBorderColor: '#ebebeb',
+  popoverBodyBackgroundColor: '#e9e9e9',
+  popoverShadowColor: 'rgba(0, 0, 0, 0.2)',
+  popoverArrowBorderColor: '#fff',
+
+  popoverTitleBackgroundInverseColor: '#3a3f51',
+  popoverTitleBorderInverseColor: '#4f566f',
+  popoverShadowInverseColor: 'rgba(0, 0, 0, 0.2)',
+  popoverArrowBorderInverseColor: 'rgba(58, 63, 81, 0.75)',
+
+  //
+  // Calendar
+
+  calendarTodayBackgroundColor: '#c5c5c5',
+  calendarBackgroudColor: '#e4eaec',
+  calendarBorderColor: '#cecece',
+  calendarTextDim: '#666',
+  calendarTextDimAlternate: '#eee',
+
+  //
+  // Table
+
+  tableRowHoverBackgroundColor: '#fafbfc',
+
+  //
+  // Series
+
+  addSeriesBackgroundColor: '#ededed',
+  seriesBackgroundColor: '#ededed',
+  searchIconContainerBackgroundColor: offWhite,
+  collapseButtonBackgroundColor: offWhite,
+
+  //
+  // Season
+
+  seasonBackgroundColor: white,
+  episodesBackgroundColor: offWhite,
+
+  //
+  // misc
+
+  progressBarBackgroundColor: '#fff',
+  logEventsBackgroundColor: '#fff'
+};