This repository has been archived on 2026-07-19. You can view files and clone it. You cannot open issues or pull requests or push a commit.
Files
Yuri Kuznetsov 3ce4cd3bfc btm sm width 32px
2025-10-17 17:38:44 +03:00

526 lines
19 KiB
Plaintext

:root {
--1px: 0.0625rem;
--2px: 0.125rem;
--3px: 0.1875rem;
--4px: 0.25rem;
--5px: 0.3125rem;
--6px: 0.375rem;
--7px: 0.4375rem;
--8px: 0.5rem;
--9px: 0.5625rem;
--10px: 0.625rem;
--11px: 0.688rem;
--12px: 0.75rem;
--13px: 0.8125rem;
--14px: 0.875rem;
--15px: 0.9375rem;
--16px: 1rem;
--17px: 1.0625rem;
--18px: 1.125rem;
--19px: 1.1875rem;
--20px: 1.25rem;
--21px: 1.3125rem;
--22px: 1.375rem;
--23px: 1.4375rem;
--24px: 1.5rem;
--25px: 1.5625rem;
--26px: 1.625rem;
--27px: 1.6875rem;
--28px: 1.75rem;
--29px: 1.8125rem;
--30px: 1.875rem;
--31px: 1.9375rem;
--32px: 2rem;
--33px: 2.0625rem;
--34px: 2.125rem;
--35px: 2.1875rem;
--36px: 2.25rem;
--37px: 2.3125rem;
--38px: 2.375rem;
--39px: 2.4375rem;
--40px: 2.5rem;
--42px: 2.625rem;
--43px: 2.6875rem;
--46px: 2.875rem;
--48px: 3rem;
--50px: 3.125rem;
--54px: 3.375rem;
--65px: 4.0625rem;
--70px: 4.375rem;
--76px: 4.75rem;
--80px: 5rem;
--90px: 5.625rem;
--94px: 5.875rem;
--95px: 5.9375rem;
--100px: 6.25rem;
--120px: 7.5rem;
--128px: 8rem;
--150px: 9.375rem;
--164px: 10.25rem;
--168px: 10.5rem;
--180px: 11.25rem;
--190px: 11.875rem;
--200px: 12.5rem;
--220px: 13.75rem;
--232px: 14.5rem;
--240px: 15rem;
--246px: 15.375rem;
--256px: 16rem;
--260px: 16.25rem;
--300px: 18.75rem;
--340px: 21.25rem;
--400px: 25rem;
--500px: 31.25rem;
--512px: 32rem;
--550px: 34.375rem;
--600px: 37.5rem;
--640px: 40rem;
--740px: 46.25rem;
--900px: 56.25rem;
--1300px: 81.25rem;
--1440px: 90rem;
--font-family: Inter, sans-serif;
--font-family-monospace: JetBrainsMono, monospace;
--font-size-base: var(--14px);
--font-size-large: var(--18px);
--font-size-small: var(--12px);
--line-height-base: 1.571429;
--line-height-large: 1.3333333;
--line-height-small: 1.5;
--line-height-computed: var(--22px);
--table-cell-padding: var(--8px);
--table-cell-less-padding: var(--3px);
--container-max-width: var(--1440px);
--record-grid-max-width: var(--1300px);
// Internal. Not to be used directly.
--container-max-width-wide: calc(var(--1440px) + var(--340px));
//Also set in a CSS variable.
--navbar-width: var(--232px);
--navbar-minimized-width: var(--50px);
--navbar-height: var(--40px);
--navbar-header-height: var(--65px);
--navbar-tab-vertical-padding: var(--9px);
--navbar-tab-left-padding: var(--16px);
--navbar-tab-right-padding: var(--20px);
--navbar-tab-text-left-padding: var(--36px);
--top-bar-height: var(--32px);
--logo-width: var(--164px);
--footer-height: var(--26px);
--grid-gutter-width: var(--16px);
--container-padding: var(--15px);
--panel-padding: var(--14px);
--form-group-margin-bottom: var(--12px);
--padding-base-vertical: var(--6px);
--padding-base-horizontal: var(--10px);
--padding-small-vertical: var(--5px);
--padding-small-horizontal: var(--10px);
--padding-large-vertical: var(--10px);
--padding-large-horizontal: var(--16px);
--modal-inner-padding: var(--panel-padding);
--modal-title-padding: var(--padding-base-horizontal);
--modal-title-line-height: var(--27px);
--popover-arrow-width: var(--10px);
// @todo Compute by adding font-size, two vertical paddings and two borders?
--input-height-base: var(--36px);
--input-height-small: var(--30px);
--input-height-large: var(--46px);
--grid-column-width-xxsmall: var(--100px);
--grid-column-width-xsmall: var(--190px);
--grid-column-width-small: var(--246px);
--grid-column-width-medium: var(--340px);
// computed
--popover-arrow-width-negative: calc(var(--popover-arrow-width) * -1);
--popover-arrow-outer-width: calc(var(--popover-arrow-width) + var(--1px));
--popover-arrow-outer-width-negative: calc(var(--popover-arrow-outer-width) * -1);
--navbar-padding-vertical: calc((var(--navbar-height) - var(--line-height-computed)) / 2);
--line-height-computed-half: calc(var(--line-height-computed) / 2);
--table-cell-padding-half: calc(var(--table-cell-padding) / 2);
--grid-gutter-width-half: calc(var(--grid-gutter-width) / 2);
--minus-1px: calc(var(--1px) * -1);
--minus-2px: calc(var(--2px) * -1);
--minus-3px: calc(var(--3px) * -1);
--minus-4px: calc(var(--4px) * -1);
--minus-5px: calc(var(--5px) * -1);
--minus-6px: calc(var(--6px) * -1);
--minus-7px: calc(var(--7px) * -1);
--minus-8px: calc(var(--8px) * -1);
--minus-9px: calc(var(--9px) * -1);
--minus-10px: calc(var(--10px) * -1);
--minus-11px: calc(var(--11px) * -1);
--minus-12px: calc(var(--12px) * -1);
--minus-13px: calc(var(--13px) * -1);
--minus-14px: calc(var(--14px) * -1);
--minus-15px: calc(var(--15px) * -1);
--minus-16px: calc(var(--16px) * -1);
// color and style
--body-bg: @body-bg-value;
--panel-bg: @panel-bg-value;
--main-gray: @main-gray-value;
--white-color: @white-color-value;
--white-color-3: darken(@white-color-value, 3%);
--white-color-5: darken(@white-color-value, 5%);
// @todo Move values to theme variables.
--tooltip-bg: #000;
--tooltip-color: #FFF;
--gray-base: @gray-base-value;
--gray-soft: @gray-soft-value;
--gray-dark: @gray-dark-value;
--gray-light: @gray-light-value;
--gray-lighter: @gray-lighter-value;
--gray: @gray-value;
--gray-light-5: darken(@gray-light-value, 5%);
--gray-light-7: darken(@gray-light-value, 7%);
--gray-light-10: darken(@gray-light-value, 10%);
--gray-light-12: darken(@gray-light-value, 12%);
--gray-light-17: darken(@gray-light-value, 17%);
--gray-light-25: darken(@gray-light-value, 25%);
--gray-light-40: darken(@gray-light-value, 40%);
--gray-dark-5: darken(@gray-dark-value, 5%);
--gray-dark-7: darken(@gray-dark-value, 7%);
--gray-dark-10: darken(@gray-dark-value, 10%);
--gray-dark-12: darken(@gray-dark-value, 12%);
--gray-dark-17: darken(@gray-dark-value, 17%);
--gray-dark-25: darken(@gray-dark-value, 25%);
--gray-dark-40: darken(@gray-dark-value, 40%);
--gray-dark-25l: lighten(@gray-dark-value, 25%);
--gray-lighter-5: darken(@gray-lighter-value, 5%);
--gray-lighter-7: darken(@gray-lighter-value, 7%);
--gray-lighter-10: darken(@gray-lighter-value, 10%);
--gray-lighter-12: darken(@gray-lighter-value, 12%);
--gray-lighter-17: darken(@gray-lighter-value, 17%);
--gray-lighter-25: darken(@gray-lighter-value, 25%);
--gray-lighter-40: darken(@gray-lighter-value, 40%);
--gray-lighter-orange-mix: @gray-lighter-orange-mix-value;
--gray-lighter-orange-mix-5: darken(@gray-lighter-orange-mix-value, 5%);
--gray-lighter-orange-mix-7: darken(@gray-lighter-orange-mix-value, 7%);
--gray-lighter-orange-mix-10: darken(@gray-lighter-orange-mix-value, 10%);
--gray-lighter-orange-mix-12: darken(@gray-lighter-orange-mix-value, 12%);
--gray-lighter-orange-mix-17: darken(@gray-lighter-orange-mix-value, 17%);
--gray-lighter-orange-mix-25: darken(@gray-lighter-orange-mix-value, 25%);
--gray-lighter-orange-mix-40: darken(@gray-lighter-orange-mix-value, 40%);
--brand-primary: @brand-primary-value;
--brand-danger: @brand-danger-value;
--brand-info: @brand-info-value;
--brand-success: @brand-success-value;
--brand-warning: @brand-warning-value;
--main-gray-5: darken(@main-gray-value, 5%);
--main-gray-7: darken(@main-gray-value, 7%);
--main-gray-10: darken(@main-gray-value, 10%);
--main-gray-12: darken(@main-gray-value, 12%);
--main-gray-17: darken(@main-gray-value, 17%);
--main-gray-25: darken(@main-gray-value, 25%);
--main-gray-40: darken(@main-gray-value, 40%);
--main-gray-lighten-40: lighten(@main-gray-value, 40%);
--brand-primary-text: @brand-primary-text-value;
--brand-primary-5: darken(@brand-primary-value, 5%);
--brand-primary-10: darken(@brand-primary-value, 10%);
--brand-primary-lighten-10: lighten(@brand-primary-value, 10%);
--brand-primary-lighten-30: lighten(@brand-primary-value, 30%);
--brand-primary-lighten-50: lighten(@brand-primary-value, 50%);
--brand-danger-10: darken(@brand-danger-value, 10%);
--brand-danger-lighten-20: lighten(@brand-danger-value, 20%);
--brand-success-10: darken(@brand-success-value, 10%);
--brand-warning-10: darken(@brand-warning-value, 10%);
--state-default-bg: @state-default-bg-value;
--state-default-text: @state-default-text-value;
--state-primary-bg: @state-primary-bg-value;
--state-primary-text: @state-primary-text-value;
--state-primary-border: @state-primary-border-value;
--state-danger-bg: @state-danger-bg-value;
--state-danger-text: @state-danger-text-value;
--state-danger-border: @state-danger-border-value;
--state-info-text: @state-info-text-value;
--state-info-bg: @state-info-bg-value;
--state-info-border: @state-info-border-value;
--state-success-text: @state-success-text-value;
--state-success-bg: @state-success-bg-value;
--state-success-border: @state-success-border-value;
--state-warning-bg: @state-warning-bg-value;
--state-warning-text: @state-warning-text-value;
--state-warning-border: @state-warning-border-value;
--state-danger-bg-5: darken(@state-danger-bg-value, 5%);
--state-danger-bg-10: darken(@state-danger-bg-value, 10%);
--state-danger-text-10: darken(@state-danger-text-value, 10%);
--state-danger-text-10l: lighten(darken(@state-danger-text-value, 10%), 20);
--brand-info-10: darken(@brand-info-value, 10%);
--state-info-text-10: darken(@state-info-text-value, 10%);
--state-info-bg-5: darken(@state-info-bg-value, 5%);
--state-info-bg-10: darken(@state-info-bg-value, 10%);
--state-success-bg-5: darken(@state-success-bg-value, 5%);
--state-success-text-10: darken(@state-success-text-value, 10%);
--state-success-text-10l: lighten(darken(@state-success-text-value, 10%), 20);
--state-warning-text-10: darken(@state-warning-text-value, 10%);
--state-warning-text-10l: lighten(darken(@state-warning-text-value, 10%), 20);
--state-warning-bg-5: darken(@state-warning-bg-value, 5%);
--state-warning-bg-10: darken(@state-warning-bg-value, 10%);
--btn-default-bg: @btn-default-bg-value;
--btn-default-border: @btn-default-border-value;
--btn-default-color: @btn-default-color-value;
--btn-default-hover-bg: @btn-default-hover-bg-value;
--btn-default-hover-border: @btn-default-hover-border-value;
--btn-default-active-bg: @btn-default-active-bg-value;
--btn-default-active-border: @btn-default-active-border-value;
--btn-primary-bg: @btn-primary-bg-value;
--btn-primary-border: @btn-primary-border-value;
--btn-primary-color: @btn-primary-color-value;
--btn-primary-hover-bg: @btn-primary-hover-bg-value;
--btn-primary-hover-border: @btn-primary-hover-border-value;
--btn-primary-active-bg: @btn-primary-active-bg-value;
--btn-primary-active-border: @btn-primary-active-border-value;
--btn-success-bg: @btn-success-bg-value;
--btn-success-border: @btn-success-border-value;
--btn-success-color: @btn-success-color-value;
--btn-success-hover-bg: @btn-success-hover-bg-value;
--btn-success-hover-border: @btn-success-hover-border-value;
--btn-success-active-bg: @btn-success-active-bg-value;
--btn-success-active-border: @btn-success-active-border-value;
--btn-danger-bg: @btn-danger-bg-value;
--btn-danger-border: @btn-danger-border-value;
--btn-danger-color: @btn-danger-color-value;
--btn-danger-hover-bg: @btn-danger-hover-bg-value;
--btn-danger-hover-border: @btn-danger-hover-border-value;
--btn-danger-active-bg: @btn-danger-active-bg-value;
--btn-danger-active-border: @btn-danger-active-border-value;
--btn-warning-bg: @btn-warning-bg-value;
--btn-warning-border: @btn-warning-border-value;
--btn-warning-color: @btn-warning-color-value;
--btn-warning-hover-bg: @btn-warning-hover-bg-value;
--btn-warning-hover-border: @btn-warning-hover-border-value;
--btn-warning-active-bg: @btn-warning-active-bg-value;
--btn-warning-active-border: @btn-warning-active-border-value;
--btn-info-bg: @btn-info-bg-value;
--btn-info-border: @btn-info-border-value;
--btn-info-color: @btn-info-color-value;
--btn-info-hover-bg: @btn-info-hover-bg-value;
--btn-info-hover-border: @btn-info-hover-border-value;
--btn-info-active-bg: @btn-info-active-bg-value;
--btn-info-active-border: @btn-info-active-border-value;
--btn-text-color: @btn-text-color-value;
--btn-active-box-shadow: @btn-active-box-shadow-value;
--btn-xs-wide-width: @btn-xs-wide-width-value;
--btn-s-wide-width: @btn-s-wide-width-value;
--btn-wide-width: @btn-wide-width-value;
--btn-x-wide-width: @btn-x-wide-width-value;
--btn-xx-wide-width: @btn-xx-wide-width-value;
--navbar-bg: @navbar-bg-value;
--navbar-link-color: @navbar-link-color-value;
--navbar-link-icon-color: @navbar-link-icon-color-value;
--navbar-link-hover-color: @navbar-link-hover-color-value;
--navbar-link-hover-bg: @navbar-link-hover-bg-value;
--navbar-link-active-bg: darken(@navbar-bg-value, 10%);
--navbar-box-shadow: @navbar-box-shadow-value;
--navbar-border-width: @navbar-border-width-value;
--navbar-inverse-color: @navbar-inverse-color-value;
--navbar-inverse-bg: @navbar-inverse-bg-value;
--navbar-inverse-link-color: @navbar-inverse-link-color-value;
--navbar-inverse-link-active-bg: @navbar-inverse-link-active-bg-value;
--navbar-inverse-border: @navbar-inverse-border-value;
--navbar-inverse-toggle-hover-bg: darken(@navbar-inverse-bg-value, 10%);
--navbar-inverse-bg-7: darken(@navbar-inverse-bg-value, 7%);
--navbar-inverse-link-hover-color: @navbar-inverse-link-hover-color-value;
--navbar-inverse-link-hover-bg: @navbar-inverse-link-hover-bg-value;
--navbar-inverse-link-disabled-color: @navbar-inverse-link-disabled-color-value;
--navbar-inverse-link-disabled-bg: @navbar-inverse-link-disabled-bg-value;
--navbar-inverse-link-icon-color: @navbar-inverse-link-icon-color-value;
--navbar-inverse-link-icon-hover-color: @navbar-inverse-link-icon-hover-color-value;
--input-color: @input-color-value;
--input-bg: @input-bg-value;
--input-border: @input-border-value;
--input-border-focus: @input-border-focus-value;
--input-box-shadow: @input-box-shadow-value;
--input-border-focus-rgba: rgba(
red(@input-border-focus-value),
green(@input-border-focus-value),
blue(@input-border-focus-value),
.6
);
--input-bg-disabled: @input-bg-disabled-value;
--input-color-disabled: @input-color-disabled-value;
--input-border-width: @input-border-width-value;
--modal-backdrop-bg: @modal-backdrop-bg-value;
--modal-backdrop-filter: @modal-backdrop-filter-value;
--modal-header-border-color: @modal-header-border-color-value;
--modal-header-bg: @modal-header-bg-value;
--modal-footer-bg: @modal-footer-bg-value;
--modal-content-bg: @modal-content-bg-value;
--modal-box-shadow: @modal-box-shadow-value;
--modal-border-color: @modal-border-color-value;
--modal-border-width: @modal-border-width-value;
--text-color: @text-color-value;
--text-white-color: @text-white-color-value;
--text-muted-color: @text-muted-color-value;
--text-gray-color: @text-gray-color-value;
--link-color: @link-color-value;
--link-hover-color: @link-hover-color-value;
--table-bg: @table-bg-value;
--table-bg-accent: @table-bg-accent-value;
--code-bg: @code-bg-value;
--code-border-color: @code-border-color-value;
--code-color: @code-color-value;
--blockquote-border-color: @blockquote-border-color-value;
--border-radius: @border-radius-value;
--border-radius-small: @border-radius-small-value;
--dropdown-border-radius: @dropdown-border-radius-value;
--dropdown-border-width: @dropdown-border-width-value;
--default-heading-bg-color: @default-heading-bg-color-value;
--default-border-color: @default-border-color-value;
--badge-border-radius-value: @badge-border-radius-value;
--warning-bg: @warning-bg-value;
--panel-border-radius: @panel-border-radius-value;
--panel-border-width: @panel-border-width-value;
--panel-default-bg: @panel-default-bg-value;
--panel-primary-bg: @panel-primary-bg-value;
--panel-success-bg: @panel-success-bg-value;
--panel-danger-bg: @panel-danger-bg-value;
--panel-warning-bg: @panel-warning-bg-value;
--panel-info-bg: @panel-info-bg-value;
--panel-default-text: @panel-default-text-value;
--panel-primary-text: @panel-primary-text-value;
--panel-success-text: @panel-success-text-value;
--panel-danger-text: @panel-danger-text-value;
--panel-warning-text: @panel-warning-text-value;
--panel-info-text: @panel-info-text-value;
--panel-default-border: @panel-default-border-value;
--panel-primary-border: @panel-primary-border-value;
--panel-danger-border: @panel-danger-border-value;
--panel-success-border: @panel-success-border-value;
--panel-warning-border: @panel-warning-border-value;
--panel-info-border: @panel-info-border-value;
--panel-heading-height: @panel-heading-height-value;
--panel-heading-font-size: @panel-heading-font-size-value;
--login-panel-heading-bg: @login-panel-heading-bg-value;
--site-footer-bg: @site-footer-bg-value;
--site-footer-color: @site-footer-color-value;
--popover-bg: @popover-bg-value;
--dropdown-bg: @dropdown-bg-value;
--dropdown-link-color: @dropdown-link-color-value;
--dropdown-link-hover-color: @dropdown-link-hover-color-value;
--dropdown-link-hover-bg: @dropdown-link-hover-bg-value;
--dropdown-border: @dropdown-border-value;
--dropdown-divider-bg: @dropdown-divider-bg-value;
--dropdown-box-shadow: @dropdown-box-shadow-value;
--dropdown-link-active-bg: @dropdown-link-active-bg-value;
--calendar-today-bg: @calendar-today-bg-value;
--calendar-border: @calendar-border-value;
--calendar-busy-bg: @calendar-busy-bg-value;
--select-item-text-color: @select-item-text-color-value;
--select-item-bg: @select-item-bg-value;
--select-item-active-text-color: @select-item-active-text-color-value;
--select-item-active-bg: @select-item-active-bg-value;
--select-item-border: @select-item-border-value;
--label-color: @label-color-value;
--label-default-bg: @label-default-bg-value;
--well-bg: @well-bg-value;
--well-border: @well-border-value;
--scroll-bg: @scroll-bg-value;
--scroll-thumb-bg: @scroll-thumb-bg-value;
--scroll-width: @scroll-width-value;
--scroll-border-width: @scroll-border-width-value;
--collapsed-modal-bg: @collapsed-modal-bg-value;
--collapsed-modal-text-color: @collapsed-modal-text-color-value;
--default-box-shadow: @default-box-shadow-value;
--top-bar-box-shadow: @top-bar-box-shadow-value;
--vertical-gap: @vertical-gap-value;
//
--icon-size-base: var(--16px);
--icon-line-height-base: var(--21px);
--icon-size-small: var(--12px);
--icon-line-height-small: var(--18px);
--btn-icon-width: var(--36px);
--btn-icon-width-small: var(--32px);
}