/* Фирменный шрифт Tilda Sans (SIL Open Font License), локальная копия */ @font-face { font-family: "TildaSans"; font-style: normal; font-weight: 250 1000; font-display: swap; src: url("../fonts/TildaSans-VF.woff2") format("woff2-variations"); } /* Палитра koncentrat.app — светлая тема */ :root { --kon-blue: #0069ff; --kon-blue-link: #0167fa; --kon-blue-deep: #012354; --kon-dark: #111111; --kon-gray: #efefef; --md-text-font: "TildaSans", Arial, sans-serif; --md-code-font: "SFMono-Regular", Consolas, Menlo, monospace; --md-primary-fg-color: var(--kon-dark); --md-primary-fg-color--light: #242424; --md-primary-fg-color--dark: #000000; --md-primary-bg-color: #ffffff; --md-primary-bg-color--light: #c9c9c9; --md-accent-fg-color: var(--kon-blue-link); --md-accent-fg-color--transparent: rgba(1, 103, 250, 0.1); --md-typeset-a-color: var(--kon-blue); --md-default-fg-color: #1d1e1f; --md-code-bg-color: var(--kon-gray); } /* Тёмная тема */ [data-md-color-scheme="slate"] { --md-hue: 220; --md-default-bg-color: #111111; --md-typeset-a-color: #4d94ff; --md-accent-fg-color: #4d94ff; --md-code-bg-color: #1d1e1f; } /* Типографика в духе сайта: плотные заголовки, воздушный текст */ .md-typeset h1 { font-weight: 700; letter-spacing: -0.02em; color: var(--md-default-fg-color); } .md-typeset h2 { font-weight: 600; letter-spacing: -0.01em; margin-top: 2em; } .md-typeset { font-size: 0.78rem; line-height: 1.75; } /* Ссылки в тексте — фирменный синий сразу, а не только при наведении. Правило на сам элемент: Material переопределяет --md-typeset-a-color на (data-md-color-scheme), поэтому переменной из :root мало. */ .md-typeset a, .md-typeset a:visited { color: var(--kon-blue); } .md-typeset a:hover, .md-typeset a:focus { color: var(--kon-blue-link); } [data-md-color-scheme="slate"] .md-typeset a, [data-md-color-scheme="slate"] .md-typeset a:visited { color: #4d94ff; } [data-md-color-scheme="slate"] .md-typeset a:hover, [data-md-color-scheme="slate"] .md-typeset a:focus { color: #79aeff; } /* Шапка — чёрная, как меню на koncentrat.app */ .md-header { box-shadow: none; border-bottom: 1px solid rgba(255, 255, 255, 0.08); } .md-header__button.md-logo img { height: 1.4rem; width: auto; } .md-tabs { background-color: var(--kon-dark); } /* Кнопки и акценты */ .md-typeset .md-button { border-radius: 6px; border-width: 1px; font-weight: 500; } .md-typeset .md-button--primary { background-color: var(--kon-blue-link); border-color: var(--kon-blue-link); color: #ffffff; } /* Плашки-подсказки в стиле сайта: без скруглений, с синей чертой слева */ .md-typeset .admonition, .md-typeset details { border-radius: 0; border: none; border-left: 3px solid var(--kon-blue-link); background-color: var(--kon-gray); box-shadow: none; font-size: 0.72rem; } [data-md-color-scheme="slate"] .md-typeset .admonition, [data-md-color-scheme="slate"] .md-typeset details { background-color: #1d1e1f; } .md-typeset .admonition-title, .md-typeset summary { background-color: transparent; font-weight: 600; } .md-typeset .admonition.warning, .md-typeset details.warning { border-left-color: #ff8562; } .md-typeset .admonition.tip, .md-typeset details.tip { border-left-color: #199c68; } /* Таблицы — светлая шапка, тонкие линии */ .md-typeset table:not([class]) { border: 1px solid var(--kon-gray); border-radius: 8px; overflow: hidden; font-size: 0.7rem; } .md-typeset table:not([class]) th { background-color: var(--kon-gray); color: var(--kon-blue-deep); font-weight: 600; } [data-md-color-scheme="slate"] .md-typeset table:not([class]) th { background-color: #1d1e1f; color: #ffffff; } /* Активный пункт бокового меню — фирменный синий */ .md-nav__link--active, .md-nav__item .md-nav__link--active { color: var(--kon-blue-link); font-weight: 500; } /* Карточки-плитки для главной страницы */ .kon-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin: 1.5em 0; } .kon-card { display: block; padding: 18px 20px; border: 1px solid var(--kon-gray); border-radius: 10px; text-decoration: none !important; color: inherit !important; transition: border-color 0.2s, transform 0.2s; } .kon-card:hover { border-color: var(--kon-blue-link); transform: translateY(-2px); } .kon-card b { display: block; font-size: 0.82rem; margin-bottom: 4px; color: var(--kon-blue-deep); } [data-md-color-scheme="slate"] .kon-card b { color: #ffffff; } .kon-card span { font-size: 0.7rem; color: #808080; line-height: 1.5; } [data-md-color-scheme="slate"] .kon-card { border-color: #242424; }