web.community-app.theme.scss Maven / Gradle / Ivy

Go to download
Show more of this group Show more artifacts with this name
Show all versions of code-quarkus Show documentation
Customize a Web Interface to generate Quarkus starter projects.
There is a newer version: 37
@import url(https://fonts.googleapis.com/css?family=PT+Mono);
@import url(https://fonts.googleapis.com/css?family=Open+Sans);

:root {

  --font: 'Open Sans', Arial, sans-serif;
  --inputFont: "PT Mono", Regular;

  --background: #0d1c2c;
  --background2: black;
  --background3: #282A39;

  --textColor: white;

  --primary: #71aeef;
  --secondary: #4695eb;
  --tertiary: #be9100;

  --warningColor: #ff004a;
  --errorColor: #ff0048a8;

  --linkTextColor: var(--secondary);

  --readOnlyTextColor: #bdbcbc;
  --readonlyLabelAndBorderColor: #707070;

  --loaderColor: white;

  --buttonBorderColor: var(--primary);

  // Top container
  --topContainerTextColor: var(--textColor);
  --topContainerBg: var(--background);
  --topContainerBgImage: url("./media/bg-form-1920.jpeg");
  --topContainerBgImageWide: url("./media/bg-form-3000.jpeg");

  --fieldLabelAndBorderColor: var(--topContainerTextColor);
  --fieldLabelAndBorderHoverColor: var(--primary);
  --fieldTextColor: var(--topContainerTextColor);
  --selectOptionsTextColor: black;

  --extensionsCartButtonTextColor: var(--textColor);;
  --extensionsCartButtonBgColor: var(--background);

  --generateButtonTextColor: var(--textColor);;
  --generateButtonBgColor: var(--secondary);
  --generateButtonBorderColorOnHover: white;
  --generateButtonDisabledBgAndBorderColor: rgba(90, 149, 235, 0.342);
  --generateButtonDisabledColor: rgba(255, 255, 255, 0.384);

  --generateButtonMoreDropdownTextColor: white;
  --generateButtonMoreDropdownBg: black;
  --resetToDefaultButtonColor: var(--warningColor);

  // Main container
  --mainContainerTextColor: var(--textColor);;
  --mainContainerBg: var(--background);

  // Next steps Modal
  --modalBg: var(--background);
  --modalTextColor: var(--textColor);;
  --modalBorderColor: var(--secondary);
  --modalTitleColor: var(--secondary);
  --modalLinkColor: var(--linkTextColor);

  --modalCloseButtonBg: var(--secondary);
  --modalCloseButtonBgHover: rgba(70, 149, 235, 0.548);

  --nextStepsModalDownloadButtonBg: var(--secondary);
  --nextStepsModalDownloadButtonTextColor: var(--textColor);;
  --nextStepsModalDownloadButtonBorderColorOnHover: white;

  --modalFooterButtonBg: black;
  --modalFooterButtonTextColor: var(--secondary);

  --codeBg: black;
  --codeTextColor: var(--textColor);;

  // Extensions picker
  --switchOriginSelectedTextColor: var(--mainContainerTextColor);
  --switchOriginTextColor: #8d8d8d;
  --originPlatformColor: #cd54e1;

  --extensionsPickerTextColor: var(--mainContainerTextColor);
  --extensionsPickerIdTextColor: var(--primary);
  --extensionsPickerCheckColor: white;
  --extensionsPickerCheckSelectedHoverColor: white;
  --extensionsPickerCheckSelectedColor: var(--primary);
  --extensionsPickerCheckSelectedByDefaultColor: var(--readonlyLabelAndBorderColor);
  --extensionsPickerKeyboardActivedTextColor: var(--secondary);
  --extensionsPickerRemoveButtonColor: var(--warningColor);

  --extensionsPickerDescriptionTextColorOnTablet: #ccc;

  --dropdownMenuBg: #363a50;
  --dropdownMenuTextColor: var(--textColor);;

  --extensionsPickerCategoryTextColor: var(--mainContainerTextColor);
  --extensionsPickerCategoryUnderlineColor: var(--secondary);

  --extensionsPickerSearchTextColor: var(--mainContainerTextColor);
  --extensionsPickerSearchBorderColor: var(--extensionsPickerSearchTextColor);
  --extensionsPickerSearchBorderColorOnFocus: var(--secondary);
  --extensionsPickerSearchClearColor: var(--warningColor);

  // Presets
  --presetsTitleTextColor: var(--extensionsPickerCategoryTextColor);
  --presetsCardBorderColor: #373668;
  --presetsCardTextColor: var(--textColor);

  // Copy to clipboard
  --copyToClipboardBackgroundColor: #1f1f1f;
  --copyToClipboardBodyBackgroundColor: #1f1f1f;
  --copyToClipboardHeaderTextColor: #b4b4b4;
  --copyToClipboardBodyTextColor: var(--tertiary);

  // Header
  --headerBackgroundColor: var(--background);
  --headerBackgroundImage: url("./media/bg-header-1920.jpeg");
  --headerBackgroundImageWide: url("./media/bg-header-3000.jpeg");
  --headerTextColor: var(--textColor);;

  --headerMenuLinkTextColor: var(--textColor);;

  --headerMenuStartCodingButtonTextColor: var(--textColor);;
  --headerMenuStartCodingButtonBorderColor: var(--secondary);
  --headerMenuStartCodingButtonBg: var(--secondary);

  --headerSupportButtonTextColor: var(--textColor);;
  --headerSupportButtonBorderColor: white;
  --headerSupportButtonBackgroundColor: transparent;

  --headerSupportPanelBackgroundColor: var(--background3);
  --headerSupportPanelTextColor: var(--textColor);;

  // StreamPicker
  --streamPickerStreamIdTextColor: var(--textColor);;
  --streamPickerPlatformKeyTextColor: var(--primary);
  --streamPickerBorderColor: var(--streamPickerPlatformKeyTextColor);
  --streamPickerDropdownStreamIdTextColor: var(--streamPickerStreamIdTextColor);
  --streamPickerDropdownPlatformKeyTextColor: var(--streamPickerPlatformKeyTextColor);
  --streamPickerDropdownBackgroundColor: var(--dropdownMenuBg);
  --streamPickerDropdownCRTextColor: #c4c3c3;

  // Blurb
  --blurbBg: #193E62;
  --blurbTextColor: var(--textColor);;
  --blurbLinkTextColor: var(--linkTextColor);
  --blurbInfoIconColor: var(--primary);
}