nikita / gistfile1.txt

// ==UserScript== // @name MAX PSUTI Mini App Pink Theme Fixed // @namespace https://max.psuti.m7n.ru/ // @version 1.1.0 // @description Adds one consistent pink theme for the PSUTI MAX mini app across all sections, independent from the user's light or dark mode. // @match https://max.psuti.m7n.ru/app/* // @match http://localhost:5173/app/* // @match http://127.0.0.1:5173/app/* // @run-at document-start // @grant none // ==/UserScript== (function () { 'use strict'; const TARGET_HOSTS = new Set(['max.psuti.m7n.ru', 'localhost', '127.0.0.1']); const TARGET_PATH_PREFIX = '/app/'; const STYLE_ID = 'tm-max-psuti-pink-theme-fixed'; const ROOT_ATTR = 'data-tm-pink-theme-fixed'; const ROOT_VALUE = 'enabled'; if (!TARGET_HOSTS.has(window.location.hostname) || !window.location.pathname.startsWith(TARGET_PATH_PREFIX)) { return; } const STYLE_TEXT = ` :root[${ROOT_ATTR}='${ROOT_VALUE}'] { color-scheme: light; --tm-pink-page-bg: #f7d8e6; --tm-pink-surface-primary: rgba(255, 241, 247, 0.99); --tm-pink-surface-secondary: rgba(249, 221, 235, 0.96); --tm-pink-surface-floating: rgba(255, 235, 244, 0.97); --tm-pink-surface-card: rgba(255, 245, 250, 0.99); --tm-pink-surface-shell: rgba(255, 239, 247, 0.99); --tm-pink-header-bg: rgba(248, 214, 230, 0.92); --tm-pink-accent: #d85c9b; --tm-pink-accent-strong: #bf3e80; --tm-pink-accent-soft: #f5bfdc; --tm-pink-accent-faint: rgba(216, 92, 155, 0.12); --tm-pink-accent-muted: rgba(216, 92, 155, 0.2); --tm-pink-accent-hover: #e273ab; --tm-pink-accent-pressed: #c94b8c; --tm-pink-accent-disabled: rgba(216, 92, 155, 0.4); --tm-pink-accent-disabled-text: rgba(191, 62, 128, 0.46); --tm-pink-text-primary: #4d1c38; --tm-pink-text-secondary: rgba(77, 28, 56, 0.74); --tm-pink-text-soft: #9d5f80; --tm-pink-text-soft-strong: #7e3a61; --tm-pink-text-tertiary: #c188a7; --tm-pink-text-disabled: rgba(77, 28, 56, 0.32); --tm-pink-icon-muted: rgba(111, 49, 79, 0.52); --tm-pink-stroke: rgba(205, 90, 148, 0.2); --tm-pink-stroke-strong: rgba(205, 90, 148, 0.34); --tm-pink-field-bg: rgba(250, 211, 230, 0.92); --tm-pink-field-border: rgba(205, 90, 148, 0.34); --tm-pink-focus-ring: rgba(216, 92, 155, 0.26); --tm-pink-overlay: rgba(76, 25, 52, 0.44); --tm-pink-overlay-strong: rgba(76, 25, 52, 0.56); --tm-pink-success: #5ea887; --tm-pink-warning: #bf8543; --tm-pink-danger: #d44f6f; --theme-brand-base: var(--tm-pink-accent); --theme-brand-strong: var(--tm-pink-accent-strong); --theme-brand-soft: var(--tm-pink-accent-soft); --theme-brand-faint: rgba(216, 92, 155, 0.16); --theme-brand-contrast: #ffffff; --theme-brand-subtle-bg: rgba(216, 92, 155, 0.08); --theme-brand-ring: rgba(216, 92, 155, 0.68); --theme-brand-shadow: 0 0 0 1px rgba(216, 92, 155, 0.14), 0 10px 24px rgba(177, 62, 118, 0.22); --theme-ui-accent: var(--tm-pink-accent-strong); --theme-ui-accent-soft-bg: rgba(216, 92, 155, 0.14); --theme-cta-accent: var(--tm-pink-accent); --theme-surface-page: var(--tm-pink-page-bg); --theme-surface-primary: var(--tm-pink-surface-primary); --theme-surface-secondary: var(--tm-pink-surface-secondary); --theme-surface-floating: var(--tm-pink-surface-floating); --theme-surface-shell: var(--tm-pink-surface-primary); --theme-surface-card: var(--tm-pink-surface-primary); --theme-surface-modal: var(--tm-pink-surface-primary); --theme-surface-input: var(--tm-pink-field-bg); --theme-stroke: var(--tm-pink-stroke); --theme-stroke-strong: var(--tm-pink-stroke-strong); --theme-text-primary: var(--tm-pink-text-primary); --theme-text-secondary: var(--tm-pink-text-secondary); --theme-text-soft: var(--tm-pink-text-soft); --theme-text-soft-strong: var(--tm-pink-text-soft-strong); --theme-text-tertiary: var(--tm-pink-text-tertiary); --theme-text-disabled: var(--tm-pink-text-disabled); --theme-icon-muted: var(--tm-pink-icon-muted); --theme-overlay-backdrop: var(--tm-pink-overlay); --theme-card-shadow: 0 14px 30px rgba(130, 60, 97, 0.1), 0 0 0 1px var(--tm-pink-stroke); --theme-card-shadow-elevated: 0 18px 42px rgba(130, 60, 97, 0.14), 0 0 0 1px var(--tm-pink-stroke-strong); --theme-modal-shadow: 0 22px 56px rgba(111, 43, 79, 0.18), 0 0 0 1px var(--tm-pink-stroke-strong); --app-danger: var(--tm-pink-danger); --app-danger-strong: #cc3f65; --app-success: var(--tm-pink-success); --app-warning: var(--tm-pink-warning); --app-info: var(--tm-pink-accent-strong); --app-field-bg: var(--tm-pink-field-bg); --app-field-border: var(--tm-pink-field-border); --MaxUi-background-primary: var(--tm-pink-surface-primary); --MaxUi-background-secondary: var(--tm-pink-surface-secondary); --MaxUi-background-floating-primary: var(--tm-pink-surface-floating); --MaxUi-background-floating-secondary: var(--tm-pink-surface-secondary); --MaxUi-stroke-secondary: var(--tm-pink-stroke); --MaxUi-stroke-primary: var(--tm-pink-stroke-strong); --MaxUi-foreground-primary: var(--tm-pink-text-primary); --MaxUi-foreground-secondary: var(--tm-pink-text-secondary); --MaxUi-foreground-tertiary: var(--tm-pink-text-tertiary); --MaxUi-foreground-accent: var(--tm-pink-accent-strong); --background-surface-primary: var(--tm-pink-surface-primary); --background-surface-ground: var(--tm-pink-page-bg); --background-surface-card: var(--tm-pink-surface-primary); --background-surface-secondary: var(--tm-pink-surface-secondary); --background-surface-tertiary: var(--tm-pink-surface-secondary); --background-surface-floating: var(--tm-pink-surface-floating); --background-overlay: var(--tm-pink-overlay); --background-overlay-secondary: var(--tm-pink-overlay-strong); --background-overlay-static: rgba(76, 25, 52, 0.32); --background-accent-themed: var(--tm-pink-accent); --background-accent-neutral-themed: var(--tm-pink-accent); --background-accent-neutral: var(--tm-pink-field-bg); --background-accent-neutral-fade: var(--tm-pink-accent-faint); --background-accent-neutral-fade-secondary: var(--tm-pink-field-bg); --text-primary: var(--tm-pink-text-primary); --text-secondary: var(--tm-pink-text-secondary); --text-tertiary: var(--tm-pink-text-tertiary); --text-subhead: var(--tm-pink-text-soft-strong); --text-themed: var(--tm-pink-accent-strong); --text-negative: var(--tm-pink-danger); --icon-primary: var(--tm-pink-text-primary); --icon-secondary: var(--tm-pink-text-secondary); --icon-tertiary: var(--tm-pink-icon-muted); --icon-themed: var(--tm-pink-accent-strong); --stroke-themed: var(--tm-pink-accent-strong); --stroke-secondary: var(--tm-pink-stroke-strong); --stroke-separator-primary: var(--tm-pink-stroke-strong); --stroke-separator-secondary: var(--tm-pink-stroke); --background-local-tab-bar-android: var(--tm-pink-header-bg); --background-local-tab-bar-i-os: var(--tm-pink-header-bg); --background-local-top-bar-primary-android: var(--tm-pink-header-bg); --background-local-top-bar-primary-i-os: var(--tm-pink-header-bg); --background-local-top-bar-secondary-android: var(--tm-pink-header-bg); --background-local-top-bar-secondary-i-os: var(--tm-pink-header-bg); --states-background-hovered-themed: var(--tm-pink-accent-hover); --states-background-pressed-themed: var(--tm-pink-accent-pressed); --states-background-disabled-themed: var(--tm-pink-accent-disabled); --states-background-hovered-neutral-themed: var(--tm-pink-accent-hover); --states-background-pressed-neutral-themed: var(--tm-pink-accent-pressed); --states-background-disabled-neutral-themed: var(--tm-pink-accent-disabled); --states-background-hovered-neutral-fade: rgba(216, 92, 155, 0.18); --states-background-pressed-neutral-fade: rgba(216, 92, 155, 0.24); --states-background-disabled-neutral-fade: rgba(205, 90, 148, 0.14); --states-background-hovered-transparent: rgba(216, 92, 155, 0.1); --states-background-pressed-transparent: rgba(216, 92, 155, 0.16); --states-text-disabled-primary: var(--tm-pink-text-disabled); --states-text-disabled-themed: var(--tm-pink-accent-disabled-text); --states-text-disabled-contrast-static: rgba(255, 255, 255, 0.82); --states-icon-disabled-primary: var(--tm-pink-text-disabled); --states-icon-disabled-themed: var(--tm-pink-accent-disabled-text); --states-icon-hovered-themed: var(--tm-pink-accent-hover); --states-icon-pressed-themed: var(--tm-pink-accent-pressed); --states-text-hovered-themed: var(--tm-pink-accent-hover); --states-text-pressed-themed: var(--tm-pink-accent-pressed); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] ::selection { background: rgba(216, 92, 155, 0.26); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] body, :root[${ROOT_ATTR}='${ROOT_VALUE}'] #root, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .app-root { background: var(--tm-pink-page-bg); color: var(--app-text-primary); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .Panel__kpB, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .Panel_mode_primary__hES, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .home-panel, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .panel-content { background: transparent; } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .panel-content { background: rgba(255, 240, 248, 0.72); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .page-header, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .tabbar, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-footer, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-footer { border-color: var(--tm-pink-stroke); background: rgba(251, 222, 237, 0.96); backdrop-filter: blur(18px) saturate(145%); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .page-header-back { background-color: var(--tm-pink-accent-faint); box-shadow: inset 0 0 0 1px var(--tm-pink-stroke); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-modal, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .admin-modal, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-feedback-modal, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-calendar { background-color: var(--tm-pink-surface-primary); } :root[${ROOT_ATTR}='${ROOT_VALUE}'][data-color-scheme='dark'] .cafeteria-modal .menu-editor-modal, :root[${ROOT_ATTR}='${ROOT_VALUE}'][data-color-scheme='dark'] .cafeteria-modal .admin-modal, :root[${ROOT_ATTR}='${ROOT_VALUE}'][data-color-scheme='dark'] .cafeteria-modal .cafeteria-feedback-modal, :root[${ROOT_ATTR}='${ROOT_VALUE}'][data-color-scheme='dark'] .cafeteria-modal .cafeteria-calendar, :root[${ROOT_ATTR}='${ROOT_VALUE}'][data-color-scheme='dark'] .cafeteria-modal .cafeteria-image-modal { background-color: var(--tm-pink-surface-primary) !important; } :root[${ROOT_ATTR}='${ROOT_VALUE}'][data-color-scheme='dark'] .cafeteria-feedback-modal__textarea, :root[${ROOT_ATTR}='${ROOT_VALUE}'][data-color-scheme='dark'] .menu-editor-form__input, :root[${ROOT_ATTR}='${ROOT_VALUE}'][data-color-scheme='dark'] .menu-editor-form__select-trigger, :root[${ROOT_ATTR}='${ROOT_VALUE}'][data-color-scheme='dark'] .menu-editor-picker-card, :root[${ROOT_ATTR}='${ROOT_VALUE}'][data-color-scheme='dark'] .menu-editor-dish__content { background-color: var(--tm-pink-field-bg) !important; } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .home-service-card, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-shell, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-state, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-dish-card, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-shell, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-category-card, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-history-card, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-compose-card, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-success-action, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-compose-attachment-card, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-feedback-shell, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-feedback-card, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .admin-user-card, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .admin-stat-card, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-shell, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-picker-card, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-modal, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-feedback-modal, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .admin-modal, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-calendar, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-image-modal, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-panel .cafeteria-shell { background: var(--tm-pink-surface-card); box-shadow: var(--app-card-shadow); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .home-service-card { box-shadow: 0 16px 34px rgba(184, 87, 136, 0.12), 0 0 0 1px rgba(205, 90, 148, 0.24); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .home-service-icon-shell { background-color: rgba(var(--service-rgb) / 0.14); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .home-service-icon-shell, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-success-action__icon { background-color: var(--tm-pink-accent-faint) !important; color: var(--tm-pink-accent-strong) !important; } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-success-action__icon { box-shadow: inset 0 0 0 1px var(--tm-pink-stroke); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .home-service-icon-button, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .home-service-icon-button svg, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-success-action__icon svg { color: inherit !important; } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-shell, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-shell, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-shell { background: var(--tm-pink-surface-shell); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-content, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-content, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-shell, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-content { --cafeteria-accent: var(--tm-pink-accent-strong); --menu-editor-action-accent: var(--tm-pink-accent-strong); --menu-editor-accent: var(--tm-pink-accent); --menu-editor-accent-strong: var(--tm-pink-accent-strong); --menu-editor-accent-soft: var(--tm-pink-accent-soft); --menu-editor-accent-faint: rgba(216, 92, 155, 0.1); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .home-service-card:hover, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-success-action:hover, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-picker-card:hover { box-shadow: var(--app-card-shadow-elevated); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .page-header-title, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .home-service-title, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-dish-title, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-dish__title, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-direction-cell__title, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-history-card__message, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-feedback-card__title, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-feedback-card__name, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-feedback-card__message, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-modal__title, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .admin-user-card__title, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .home-section-title, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-section-title, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-section-title, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-section__title, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .admin-stat-card__count, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-modal__title { color: var(--app-text-primary); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .panel-state__spinner { color: var(--tm-pink-accent-strong); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-date-switcher__track, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-tabs__track { background-color: var(--tm-pink-field-bg); box-shadow: inset 0 0 0 1px var(--tm-pink-stroke); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-date-switcher__slider, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-tabs__slider { background-color: rgba(255, 246, 250, 0.98); box-shadow: 0 10px 22px rgba(116, 54, 86, 0.12), 0 0 0 1px var(--tm-pink-stroke); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-calendar-button, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-calendar__nav, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-calendar__month, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-date-button, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-form__input, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-form__select-trigger, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-compose-textarea, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-compose-chip, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-dish-image-placeholder, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-photo-editor__empty { background-color: var(--tm-pink-field-bg); border-color: var(--tm-pink-field-border); color: var(--app-text-primary); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-form__select-menu { background: var(--tm-pink-surface-card); box-shadow: 0 16px 34px rgba(106, 44, 74, 0.18), 0 0 0 1px var(--tm-pink-stroke-strong); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-form__select-option:hover, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-form__select-option:focus-visible, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-form__select-option--selected { background-color: var(--tm-pink-accent-faint); color: var(--tm-pink-accent-strong); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-section-add, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-modal__submit, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-form__save, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-primary-button, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-primary-button:hover, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-primary-button:focus-visible, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-primary-button:active { background-color: var(--tm-pink-accent); box-shadow: 0 10px 22px rgba(149, 60, 102, 0.22); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-modal__submit:disabled, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-form__save:disabled, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-primary-button:disabled { background-color: var(--tm-pink-accent-disabled); box-shadow: none; } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-dish-price, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-dish__price, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-history-repeat, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-history-card__attachment-icon, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-dish__edit-icon, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-compose-attachment-icon, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-checkbox--checked, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-picker-card__checkbox--checked, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .tabbar-item--active, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .tabbar-item--active .tabbar-icon-button { color: var(--tm-pink-accent-strong); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .admin-role-pill { box-shadow: inset 0 0 0 1px var(--tm-pink-stroke); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .admin-role-pill--user { color: #b54d81; background: rgba(216, 110, 159, 0.14); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .admin-role-pill--cafeteria { color: #b05f77; background: rgba(228, 147, 172, 0.16); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .admin-role-pill--admin { color: #8e4f91; background: rgba(177, 126, 193, 0.15); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .admin-role-pill--superadmin { color: #8d3f69; background: rgba(197, 105, 150, 0.18); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-direction-cell__subtitle, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-history-card__groups, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-history-card__sent-at, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-history-card__details-title, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-compose-hint, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-feedback-card__meta, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-feedback-card__date, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-modal__subtitle, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-picker-card__note, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .admin-user-card__meta, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .admin-role-modal__meta, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-date-caption, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-empty-card__text { color: var(--app-text-secondary); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-modal [class*='IconButton_appearance_neutral__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-modal__close, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .admin-modal [class*='IconButton_appearance_neutral__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-feedback-modal [class*='IconButton_appearance_neutral__'] { color: var(--app-text-secondary); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-form__label, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-form__header, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-form__field-label { color: var(--app-text-secondary); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-picker-card { background: rgba(255, 245, 250, 0.98); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-picker-card--disabled { background: rgba(255, 245, 250, 0.72); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-picker-card__title { color: var(--app-text-primary); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-feedback-card__date-pill { background-color: var(--tm-pink-field-bg); color: var(--tm-pink-accent-strong); box-shadow: inset 0 0 0 1px var(--tm-pink-stroke); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-feedback-card__message, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-feedback-card__paragraph { overflow-wrap: anywhere; word-break: break-word; } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-calendar__month, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-calendar__nav { background-color: var(--tm-pink-field-bg); color: var(--tm-pink-text-primary); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-calendar__weekday { color: var(--tm-pink-text-soft); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-calendar__day { color: var(--tm-pink-text-soft-strong); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-calendar__day--today { color: #ffc3df; background-color: rgba(216, 92, 155, 0.16); box-shadow: 0 0 0 1px rgba(216, 92, 155, 0.42) inset; } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-calendar__day--selected, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-calendar__day--today.cafeteria-calendar__day--selected { color: #ffffff !important; } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-panel [class*='Button_appearance_neutral__'][class*='Button_mode_secondary__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-panel [class*='Button_appearance_neutral-themed__'][class*='Button_mode_secondary__'] { background-color: rgba(216, 92, 155, 0.12) !important; color: var(--tm-pink-accent-strong) !important; box-shadow: inset 0 0 0 1px var(--tm-pink-stroke) !important; } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-panel [class*='Button_appearance_neutral__'][class*='Button_mode_secondary__'] [class*='Button__content__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-panel [class*='Button_appearance_neutral__'][class*='Button_mode_secondary__'] [class*='Button__iconBefore__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-panel [class*='Button_appearance_neutral-themed__'][class*='Button_mode_secondary__'] [class*='Button__content__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-panel [class*='Button_appearance_neutral-themed__'][class*='Button_mode_secondary__'] [class*='Button__iconBefore__'] { color: inherit; } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-modal [class*='Button_appearance_neutral__'][class*='Button_mode_secondary__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-modal [class*='Button_appearance_neutral-themed__'][class*='Button_mode_secondary__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] .admin-modal [class*='Button_appearance_neutral__'][class*='Button_mode_secondary__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] .admin-modal [class*='Button_appearance_neutral-themed__'][class*='Button_mode_secondary__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-feedback-modal [class*='Button_appearance_neutral__'][class*='Button_mode_secondary__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-feedback-modal [class*='Button_appearance_neutral-themed__'][class*='Button_mode_secondary__'] { background-color: rgba(216, 92, 155, 0.12) !important; color: var(--tm-pink-accent-strong) !important; box-shadow: inset 0 0 0 1px var(--tm-pink-stroke) !important; } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-modal [class*='Button_appearance_neutral__'][class*='Button_mode_secondary__'] [class*='Button__content__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-modal [class*='Button_appearance_neutral__'][class*='Button_mode_secondary__'] [class*='Button__iconBefore__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-modal [class*='Button_appearance_neutral-themed__'][class*='Button_mode_secondary__'] [class*='Button__content__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-modal [class*='Button_appearance_neutral-themed__'][class*='Button_mode_secondary__'] [class*='Button__iconBefore__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] .admin-modal [class*='Button_appearance_neutral__'][class*='Button_mode_secondary__'] [class*='Button__content__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] .admin-modal [class*='Button_appearance_neutral__'][class*='Button_mode_secondary__'] [class*='Button__iconBefore__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] .admin-modal [class*='Button_appearance_neutral-themed__'][class*='Button_mode_secondary__'] [class*='Button__content__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] .admin-modal [class*='Button_appearance_neutral-themed__'][class*='Button_mode_secondary__'] [class*='Button__iconBefore__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-feedback-modal [class*='Button_appearance_neutral__'][class*='Button_mode_secondary__'] [class*='Button__content__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-feedback-modal [class*='Button_appearance_neutral__'][class*='Button_mode_secondary__'] [class*='Button__iconBefore__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-feedback-modal [class*='Button_appearance_neutral-themed__'][class*='Button_mode_secondary__'] [class*='Button__content__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-feedback-modal [class*='Button_appearance_neutral-themed__'][class*='Button_mode_secondary__'] [class*='Button__iconBefore__'] { color: inherit; } /* Делаем все вторичные neutral-кнопки читаемыми в розовой теме, не только внутри модалок. */ :root[${ROOT_ATTR}='${ROOT_VALUE}'] [class*='Button_appearance_neutral__'][class*='Button_mode_secondary__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] [class*='Button_appearance_neutral-themed__'][class*='Button_mode_secondary__'] { background-color: rgba(216, 92, 155, 0.12) !important; color: var(--tm-pink-accent-strong) !important; box-shadow: inset 0 0 0 1px var(--tm-pink-stroke) !important; } :root[${ROOT_ATTR}='${ROOT_VALUE}'] [class*='Button_appearance_neutral__'][class*='Button_mode_secondary__'] [class*='Button__content__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] [class*='Button_appearance_neutral__'][class*='Button_mode_secondary__'] [class*='Button__iconBefore__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] [class*='Button_appearance_neutral-themed__'][class*='Button_mode_secondary__'] [class*='Button__content__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] [class*='Button_appearance_neutral-themed__'][class*='Button_mode_secondary__'] [class*='Button__iconBefore__'] { color: inherit !important; } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-compose-textarea::placeholder, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-form__input-element::placeholder, :root[${ROOT_ATTR}='${ROOT_VALUE}'] input::placeholder { color: var(--app-text-tertiary); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-image-modal__close { background-color: rgba(84, 22, 54, 0.54); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-image-modal__image { background-color: color-mix(in srgb, var(--tm-pink-page-bg) 78%, white 22%); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-calendar__day--today { box-shadow: 0 0 0 1px rgba(216, 92, 155, 0.42) inset; } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-calendar__day--selected, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-calendar__day--today.cafeteria-calendar__day--selected { background-color: var(--tm-pink-accent) !important; color: #ffffff !important; box-shadow: 0 12px 28px rgba(166, 54, 112, 0.24), 0 0 0 1px rgba(255, 255, 255, 0.16) inset; } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-compose-textarea:focus-visible, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-form__input:focus-within, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-form__select-trigger:focus-visible, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-form__select-trigger--open, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .page-header-back:focus-visible, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-calendar-button:focus-visible, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .cafeteria-calendar__nav:focus-visible, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-compose-chip:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--tm-pink-focus-ring); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-photo-editor__overlay { background: rgba(77, 28, 51, 0.28); } :root[${ROOT_ATTR}='${ROOT_VALUE}'] button[class^='Button__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] button[class*=' Button__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] a[class^='Button__'], :root[${ROOT_ATTR}='${ROOT_VALUE}'] a[class*=' Button__'] { transition: background-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease; } :root[${ROOT_ATTR}='${ROOT_VALUE}'] .tabbar-item, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .page-header, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .menu-editor-footer, :root[${ROOT_ATTR}='${ROOT_VALUE}'] .mailing-footer { color: var(--app-text-primary); } `; function ensureThemeStyle() { const root = document.documentElement; if (!root) { return; } root.setAttribute(ROOT_ATTR, ROOT_VALUE); let style = document.getElementById(STYLE_ID); if (!style) { style = document.createElement('style'); style.id = STYLE_ID; style.type = 'text/css'; style.textContent = STYLE_TEXT; } if (style.textContent !== STYLE_TEXT) { style.textContent = STYLE_TEXT; } const target = document.head || root; if (style.parentNode !== target || target.lastElementChild !== style) { target.appendChild(style); } } function observeDocument() { const root = document.documentElement; if (!root || root.dataset.tmPinkThemeFixedObserverAttached === 'true') { return; } const watchHead = () => { if (!document.head || document.head.dataset.tmPinkThemeFixedObserverAttached === 'true') { return; } document.head.dataset.tmPinkThemeFixedObserverAttached = 'true'; const styleObserver = new MutationObserver(() => { if (!document.getElementById(STYLE_ID)) { ensureThemeStyle(); } }); styleObserver.observe(document.head, { childList: true }); }; const headObserver = new MutationObserver(() => { ensureThemeStyle(); watchHead(); }); headObserver.observe(root, { childList: true }); root.dataset.tmPinkThemeFixedObserverAttached = 'true'; watchHead(); document.addEventListener( 'readystatechange', () => { ensureThemeStyle(); watchHead(); }, { passive: true }, ); } ensureThemeStyle(); observeDocument(); })();