* docs: added features and guides overview page * added image * added version 2 * added version 3 * added version 4 * docs: implemented new color scheme * docs: redesigned sidebar (#3193) * docs: redesigned navbar for restructure (#3199) * docs: redesigned footer (#3209) * docs: redesigned cards (#3230) * docs: redesigned admonitions (#3231) * docs: redesign announcement bar (#3236) * docs: redesigned large cards (#3239) * docs: redesigned code blocks (#3253) * docs: redesigned search modal and page (#3264) * docs: redesigned doc footer (#3268) * docs: added new sidebars + refactored css and assets (#3279) * docs: redesigned api reference sidebar * docs: refactored css * docs: added code tabs transition * docs: added new sidebars * removed unused assets * remove unusued assets * Fix deploy errors * fix incorrect link * docs: fixed code responsivity + missing icons (#3283) * docs: changed icons (#3296) * docs: design fixes to the sidebar (#3297) * redesign fixes * docs: small design fixes * docs: several design fixes after restructure (#3299) * docs: bordered icon fixes * docs: desgin fixes * fixes to code blocks and sidebar scroll * design adjustments * docs: restructured homepage (#3305) * docs: restructured homepage * design fixes * fixed core concepts icon * docs: added core concepts page (#3318) * docs: restructured homepage * design fixes * docs: added core concepts page * changed text of different components * docs: added architecture link * added missing prop for user guide * docs: added regions overview page (#3327) * docs: added regions overview * moved region pages to new structure * docs: fixed description of regions architecture page * small changes * small fix * docs: added customers overview page (#3331) * docs: added regions overview * moved region pages to new structure * docs: fixed description of regions architecture page * small changes * small fix * docs: added customers overview page * fix link * resolve link issues * docs: updated regions architecture image * docs: second-iteration fixes (#3347) * docs: redesigned document * design fixes * docs: added products overview page (#3354) * docs: added carts overview page (#3363) * docs: added orders overview (#3364) * docs: added orders overview * added links in overview * docs: added vercel redirects * docs: added soon badge for cards (#3389) * docs: resolved feedback changes + organized troubleshooting pages (#3409) * docs: resolved feedback changes * added extra line * docs: changed icons for restructure (#3421) * docs: added taxes overview page (#3422) * docs: added taxes overview page * docs: fix sidebar label * added link to taxes overview page * fixed link * docs: fixed sidebar scroll (#3429) * docs: added discounts overview (#3432) * docs: added discounts overview * fixed links * docs: added gift cards overview (#3433) * docs: added price lists overview page (#3440) * docs: added price lists overview page * fixed links * docs: added sales channels overview page (#3441) * docs: added sales overview page * fixed links * docs: added users overview (#3443) * docs: fixed sidebar border height (#3444) * docs: fixed sidebar border height * fixed svg markup * docs: added possible solutions to feedback component (#3449) * docs: added several overview pages + restructured files (#3463) * docs: added several overview pages * fixed links * docs: added feature flags + PAK overview pages (#3464) * docs: added feature flags + PAK overview pages * fixed links * fix link * fix link * fixed links colors * docs: added strategies overview page (#3468) * docs: automated upgrade guide (#3470) * docs: automated upgrade guide * fixed vercel redirect * docs: restructured files in docs codebase (#3475) * docs: restructured files * docs: fixed eslint exception * docs: finished restructure loose-ends (#3493) * fixed uses of backend * docs: finished loose ends * eslint fixes * fixed links * merged master * added update instructions for v1.7.12
197 lines
6.4 KiB
CSS
197 lines
6.4 KiB
CSS
/** Light theme/default **/
|
|
:root {
|
|
/** Backgrounds **/
|
|
--medusa-bg-subtle: #F8F9FA;
|
|
--medusa-bg-subtle-hover: #F1F3F5;
|
|
--medusa-bg-subtle-pressed: #ECEEF0;
|
|
--medusa-bg-base: #FFFFFF;
|
|
--medusa-bg-base-hover: #F8F9FA;
|
|
--medusa-bg-base-pressed: #F1F3F5;
|
|
--medusa-bg-component: #F1F3F5;
|
|
--medusa-bg-field: #F8F9FA;
|
|
--medusa-bg-field-hover: #F1F3F5;
|
|
--medusa-bg-highlight: #EDE9FE;
|
|
--medusa-bg-toggle-off: #C1C8CD;
|
|
--medusa-bg-overlay: rgba(17, 24, 28, 0.4);
|
|
--medusa-bg-interactive: #6E56CF;
|
|
|
|
/** Borders **/
|
|
--medusa-border-base: #E6E8EB;
|
|
--medusa-border-strong: #D7DBDF;
|
|
--medusa-border-focus: #6E56CF;
|
|
--medusa-border-focus-inset: #FFFFFF;
|
|
--medusa-border-interactive: #6E56CF;
|
|
|
|
/** Text **/
|
|
--medusa-text-base: #11181C;
|
|
--medusa-text-subtle: #687076;
|
|
--medusa-text-placeholder: #889096;
|
|
--medusa-text-disabled: #C1C8CD;
|
|
--medusa-text-on-color: #FFFFFF;
|
|
--medusa-text-interactive: #6E56CF;
|
|
--medusa-text-interactive-hover: #644FC1;
|
|
--medusa-text-error: #E5484D;
|
|
|
|
/** Buttons **/
|
|
--medusa-button-primary: #6E56CF;
|
|
--medusa-button-primary-hover: #644FC1;
|
|
--medusa-button-primary-pressed: #5746AF;
|
|
--medusa-button-secondary: #FFFFFF;
|
|
--medusa-button-secondary-hover: #F8F9FA;
|
|
--medusa-button-secondary-pressed: #F1F3F5;
|
|
--medusa-button-danger: #E5484D;
|
|
--medusa-button-danger-hover: #DC3D43;
|
|
--medusa-button-danger-pressed: #CD2B31;
|
|
--medusa-button-danger-text: var(--medusa-text-on-color);
|
|
--medusa-button-success: #30A46C;
|
|
--medusa-button-success-text: var(--medusa-text-on-color);
|
|
|
|
/** Icons **/
|
|
--medusa-icon-primary: #11181C;
|
|
--medusa-icon-secondary: #687076;
|
|
--medusa-icon-placeholder: #889096;
|
|
--medusa-icon-disabled: #C1C8CD;
|
|
--medusa-icon-on-color: #FFFFFF;
|
|
--medusa-icon-interactive: #6E56CF;
|
|
--medusa-icon-interactive-hover: #644FC1;
|
|
--medusa-icon-error: #E5484D;
|
|
|
|
/** Support Info **/
|
|
--medusa-support-error: #E5484D;
|
|
--medusa-support-warning: #FFB224;
|
|
--medusa-support-success: #30A46C;
|
|
--medusa-support-info: #0091FF;
|
|
|
|
/** Code Block **/
|
|
--medusa-code-block: #1C1C1F;
|
|
--medusa-code-block-transparent: #1C1C1F00;
|
|
--medusa-code-block-border: #2E2E32;
|
|
--medusa-code-block-action: #706F78;
|
|
|
|
/** Code Tabs **/
|
|
--medusa-code-tabs-bg: #161616;
|
|
--medusa-code-tab: #1C1C1F;
|
|
--medusa-code-tab-hover: rgba(141, 141, 141, 0.16);
|
|
--medusa-code-tab-border: #3E3E44;
|
|
--medusa-code-tab-text: #7E7D86;
|
|
--medusa-code-tab-active-text: #EDEDEF;
|
|
--medusa-code-tab-title: #7E7D86;
|
|
|
|
/** Tooltip **/
|
|
--medusa-tooltip: var(--medusa-bg-base);
|
|
--medusa-tooltip-border: var(--medusa-border-base);
|
|
--medusa-tooltip-shadow: var(--medusa-shadow-overlay);
|
|
--medusa-tooltip-text: var(--medusa-text-subtle);
|
|
|
|
/** Shadow **/
|
|
--medusa-shadow-overlay: 0px 2px 16px rgba(0, 0, 0, 0.08);
|
|
--medusa-shadow-field-focused: 0px 0px 0px 4px #EDE9FE;
|
|
--medusa-shadow-button-focused: 0px 0px 0px 2px #FFFFFF, 0px 0px 0px 4px #6E56CF;
|
|
|
|
/** Typography **/
|
|
--medusa-body-regular-plus-size: 14px;
|
|
--medusa-body-regular-plus-line-height: 24px;
|
|
--medusa-body-regular-plus-font-weight: 500;
|
|
--medusa-body-regular-size: 14px;
|
|
--medusa-body-regular-line-height: 24px;
|
|
--medusa-body-regular-font-weight: 400;
|
|
--medusa-h1-size: 32px;
|
|
--medusa-h1-line-height: 44px;
|
|
--medusa-h1-weight: 500;
|
|
--medusa-h2-size: 24px;
|
|
--medusa-h2-line-height: 32px;
|
|
--medusa-h2-weight: 500;
|
|
--medusa-h3-size: 18px;
|
|
--medusa-h3-line-height: 28px;
|
|
--medusa-h3-weight: 500;
|
|
--medusa-label-large-plus-size: 16px;
|
|
--medusa-label-large-plus-line-height: 20px;
|
|
--medusa-label-large-plus-font-weight: 500;
|
|
--medusa-label-regular-plus-size: 14px;
|
|
--medusa-label-regular-plus-line-height: 20px;
|
|
--medusa-label-regular-plus-font-weight: 500;
|
|
--medusa-label-regular-size: 14px;
|
|
--medusa-label-regular-line-height: 20px;
|
|
--medusa-label-regular-font-weight: 400;
|
|
--medusa-label-small-plus-size: 13px;
|
|
--medusa-label-small-plus-line-height: 20px;
|
|
--medusa-label-small-plus-font-weight: 500;
|
|
--medusa-label-small-size: 13px;
|
|
--medusa-label-small-line-height: 20px;
|
|
--medusa-label-small-font-weight: 400;
|
|
--medusa-label-x-small-plus-size: 12px;
|
|
--medusa-label-x-small-plus-line-height: 20px;
|
|
--medusa-label-x-small-plus-font-weight: 500;
|
|
|
|
/** Tags **/
|
|
--medusa-tag-purple-bg: #EDE9FE;
|
|
--medusa-tag-purple-bg-hover: #E4DEFC;
|
|
--medusa-tag-purple-text: #5746AF;
|
|
--medusa-tag-purple-dot: #6E56CF;
|
|
--medusa-tag-purple-border: #D7CFF9;
|
|
}
|
|
|
|
/** Dark theme **/
|
|
html[data-theme="dark"] {
|
|
/** Backgrounds **/
|
|
--medusa-bg-subtle: #161618;
|
|
--medusa-bg-subtle-hover: #1C1C1F;
|
|
--medusa-bg-subtle-pressed: #232326;
|
|
--medusa-bg-base: #1C1C1F;
|
|
--medusa-bg-base-hover: #232326;
|
|
--medusa-bg-base-pressed: #28282C;
|
|
--medusa-bg-component: #2E2E32;
|
|
--medusa-bg-field: #232326;
|
|
--medusa-bg-field-hover: #28282C;
|
|
--medusa-bg-highlight: #2C2250;
|
|
--medusa-bg-toggle-off: #3E3E44;
|
|
--medusa-bg-overlay: rgba(22, 22, 24, 0.7);
|
|
--medusa-bg-interactive: #6E56CF;
|
|
|
|
/** Borders **/
|
|
--medusa-border-base: #2E2E32;
|
|
--medusa-border-strong: #3E3E44;
|
|
--medusa-border-focus: #6E56CF;
|
|
--medusa-border-focus-inset: #1C1C1F;
|
|
--medusa-border-interactive: #6E56CF;
|
|
|
|
/** Text **/
|
|
--medusa-text-base: #EDEDEF;
|
|
--medusa-text-subtle: #7E7D86;
|
|
--medusa-text-placeholder: #706F78;
|
|
--medusa-text-disabled: #504F57;
|
|
--medusa-text-on-color: #FFFFFF;
|
|
--medusa-text-interactive: #7C66DC;
|
|
--medusa-text-interactive-hover: #9E8CFC;
|
|
--medusa-text-error: #E5484D;
|
|
|
|
/** Buttons **/
|
|
--medusa-button-primary: #6E56CF;
|
|
--medusa-button-primary-hover: #7C66DC;
|
|
--medusa-button-primary-pressed: #9E8CFC;
|
|
--medusa-button-secondary: #232326;
|
|
--medusa-button-secondary-hover: #2E2E32;
|
|
--medusa-button-secondary-pressed: #2E2E32;
|
|
|
|
/** Icons **/
|
|
--medusa-icon-primary: #EDEDEF;
|
|
--medusa-icon-secondary: #7E7D86;
|
|
--medusa-icon-placeholder: #706F78;
|
|
--medusa-icon-disabled: #504F57;
|
|
--medusa-icon-on-color: #FFFFFF;
|
|
--medusa-icon-interactive: #7C66DC;
|
|
--medusa-icon-interactive-hover: #9E8CFC;
|
|
--medusa-icon-error: #E5484D;
|
|
|
|
/** Shadow **/
|
|
--medusa-shadow-overlay: 0px 2px 16px rgba(0, 0, 0, 0.32);
|
|
--medusa-shadow-field-focused: 0px 0px 0px 4px #2C2250;
|
|
--medusa-shadow-button-focused: 0px 0px 0px 2px #1C1C1F, 0px 0px 0px 4px #6E56CF;
|
|
|
|
/** Tags **/
|
|
--medusa-tag-purple-bg: #2C2250;
|
|
--medusa-tag-purple-bg-hover: #32275F;
|
|
--medusa-tag-purple-text: #9E8CFC;
|
|
--medusa-tag-purple-dot: #6E56CF;
|
|
--medusa-tag-purple-border: #392C72;
|
|
} |