Те саме вікно, ваш стиль

Створіть власну тему

Тема — це один невеликий текстовий файл у форматі TOML (або JSON). Він називає лише те, що змінює; все інше походить від теми, на якій він базується. Вам не потрібно збирати MDM або знати, як програмувати.

1. Створіть її

   Почніть з кількох кольорів, потім додавайте більше:

   name = "Harbour"
   inherits = "classic"
   icons = "color"
   
   [seeds.light]
   background = "#eef3f6"
   surface = "#ffffff"
   text = "#11202b"
   accent = "#0f6c8c"
   
   [seeds.dark]
   background = "#14212a"
   surface = "#0e171d"
   text = "#e8f0f4"
   accent = "#5cc3e6"
   
   [sizes]
   radius = 6
   
   [controls]
   focus = "ring"

   • inheritsце тема, з якої починається ваша: classic (за замовчуванням), high-contrast, metro, adwaita, breeze, luna, aero, aqua або інший файл теми в тій самій папці.
   • [seeds]це кілька кольорів (background, surface, header, text, accent, selection, error, warning, success), які MDM поширює на кожен елемент керування. [seeds.light] та [seeds.dark] надають кожній стороні свій власний.
   • [colors]встановлює ролі одного кольору з обох сторін, [light] та [dark] лише з однієї сторони: #rrggbb або #rrggbbaa з прозорістю.
   • [sizes]це радіуси кутів, ширина меж, розміри шрифтів та висота рядків у пікселях. [controls] вибирає форму текстових полів, прапорців, кнопок, смуг прогресу, смуг прокрутки, позначки фокусу та панелі заголовка.
   • iconsце color, mono або accent. Тема у власній папці (my-theme/theme.toml) може містити свої іконки в icons/16 та icons/24, кожна з яких названа відповідно до того, що вона показує (tb-add-url.svg, cat-music.png); -symbolic використовують колір тексту теми.
   • contrast = "high"підсилює кожен край і колір тексту зверху.

   Невідомий MDM ключ або значення, яке він не може прочитати, пропускається та записується до журналу MDM (папка logs поруч із папкою тем), тому файл, створений для новішої версії MDM, все одно завантажується. Вбудовані теми написані таким же чином: прочитайте їх на GitHub.

   Кожна роль кольору (156)

   Ключ	Що він забарвлює
   window	Windows' and dialogs' background
   text	Текст і гліфи
   text.disabled	Вимкнений текст, єдиний сірий колір кожного неактивного елемента керування та мітки
   text.muted	Додатковий текст: примітки, розміри, версії
   link	Текст, що відкриває щось
   error	Текст помилки
   error.strong	Повідомлення про невдалу перевірку в Параметрах (тести з'єднання, браузера та помічника)
   warning	Текст попередження
   success	Текст успіху (відповідна контрольна сума)
   reach.near	Сервер завантаження поблизу за часом відгуку (менше 60 мс), у Властивостях
   reach.medium	Сервер із середнім часом відгуку (від 60 до 150 мс)
   reach.far	Віддалений сервер за часом відгуку (понад 150 мс)
   flag.edge	Тонкий край навколо прапора країни
   accent	Акцент: лінії фокусу, відкриті та стандартні елементи керування, фільтри, фокус посилань
   focus.ring	Пунктирний прямокутник фокусу клавіатури
   selection	Заповнення виділення: рядки, обраний день, виділений текст
   selection.text	Текст на виділенні
   selection.muted	Додатковий текст на виділенні
   selection.inactive	Виділений рядок у списку без фокусу
   selection.focus	Пунктирний контур сфокусованого рядка на виділеному рядку
   group.line	Рамка групового поля
   etch.shadow	Лінія тіні витравленого роздільника
   etch.light	Лінія підсвічування витравленого роздільника
   tab.page	Тіло вкладки
   tab	Невибрана вкладка та тінь сторінки
   tab.hot	Вкладка під вказівником
   chevron	Стрілка спадного списку або лічильника
   chevron.disabled	Затінена стрілка
   subtle.hot	Частина без власного вигляду (стрілка, заголовок стовпця) під вказівником
   subtle.pressed	Така частина натиснута або відкрита
   highlight.hot	День або стрілка календаря під вказівником, цільова область перетягування
   highlight.pressed	День або стрілка календаря натиснута
   field	Внутрішня частина текстового поля або списку
   field.border	Межа текстового поля
   field.bottom	Нижня лінія текстового поля, коли в нього можна вводити текст
   field.disabled	Внутрішня частина затіненого текстового поля
   field.disabled.border	Межа затіненого текстового поля
   field.readonly	Внутрішня частина текстового поля лише для читання
   field.readonly.border	Межа текстового поля лише для читання
   combo.chevron	Шеврон спадного списку
   combo.arrow.hot	Зона стрілки редагованого спадного списку під вказівником
   combo.arrow.pressed	Зона стрілки редагованого спадного списку натиснута або відкрита
   button	Лицьова сторона кнопки
   button.hot	Лицьова сторона кнопки під вказівником
   button.pressed	Лицьова сторона кнопки натиснута
   button.border	Межа кнопки
   button.bottom	Нижній край кнопки
   button.text	Текст кнопки
   button.text.pressed	Текст кнопки натиснутий
   button.default.border	Межа кнопки за замовчуванням
   button.default.bottom	Нижній край кнопки за замовчуванням
   button.disabled	Лицьова сторона затіненої кнопки
   button.disabled.border	Межа затіненої кнопки
   button.accent	Лицьова сторона акцентної кнопки
   button.accent.hot	Лицьова сторона акцентної кнопки під вказівником
   button.accent.pressed	Лицьова сторона акцентної кнопки, натиснута
   button.accent.bottom	Нижній край акцентної кнопки
   button.accent.text	Текст акцентної кнопки
   button.accent.text.pressed	Текст акцентної кнопки, натиснутий
   button.glow	Світіння всередині кнопки під вказівником, якщо стиль його малює (Luna; прозорий: немає)
   gloss	Блиск глянцевих частин, до якого вони переходять зверху: кнопки, поля, смуги та заголовки (Luna, Aero, Aqua)
   check	Внутрішня частина невідміченого прапорця або радіокнопки
   check.hot	Її внутрішня частина під вказівником
   check.pressed	Її внутрішня частина, натиснута
   check.border	Межа невідміченого прапорця або радіокнопки
   check.border.hot	Її межа під вказівником
   check.border.pressed	Її межа, натиснута
   check.border.disabled	Межа неактивного невідміченого прапорця
   check.on	Акцент відміченого прапорця або радіокнопки
   check.on.hot	Відмічений акцент під вказівником
   check.on.pressed	Відмічений акцент, натиснутий
   check.on.disabled	Заповнення неактивного відміченого прапорця
   check.mark	Галочка або крапка на відміченому акценті
   progress.track	Доріжка індикатора виконання
   progress.bar	Заповнення індикатора виконання
   meter.track	Доріжка вимірювача (виконана частина завантаження)
   meter.edge	Край вимірювача
   meter.fill	Заповнення вимірювача
   list	Фон списку завантажень
   list.frame	Контур списку, таблиці або поля
   grid	Лінії сітки між рядками списку в діалогових вікнах
   list.grid	Лінії сітки списку завантажень
   header	Заголовки стовпців кожного списку та таблиці
   header.line	Нижня лінія заголовка в списках діалогових вікон
   header.sep	Роздільники між заголовками стовпців
   table.line	Роздільники в таблицях перехоплювача посилань та вікна «Додати торрент»
   header.sorted	Заголовок відсортованого стовпця
   header.sort-arrow	Шеврон сортування
   row.pressed	Натиснутий рядок списку
   chip.web	Веб-чип у списку завантажень
   chip.torrent	Торрент-чип у списку завантажень
   chip.text	Текст на чипі
   list.drag-ghost	Заголовок стовпця, що перетягується
   list.marquee	Гумова стрічка, що виділяє рядки
   list.marquee.border	Край гумової стрічки
   scroll.track	Доріжка смуги прокручування
   scroll.corner	Місце зустрічі двох смуг прокручування
   scroll.thumb	Повзунок та стрілки смуги прокручування
   scroll.thumb.hot	Повзунок або стрілка під вказівником
   scroll.thumb.pressed	Натиснутий або перетягнутий повзунок чи стрілка
   menubar	Рядок меню
   menubar.bottom	Останній рядок рядка меню
   menubar.line	Лінія під рядком меню
   menubar.hot	Назва меню під вказівником
   menubar.open	Назва відкритого меню
   menu	Фон меню
   menu.item	Пункт меню
   menu.hot	Пункт меню під вказівником
   menu.border	Рамка меню та спливаючого вікна
   menu.sep	Роздільники меню
   menu.text	Текст меню
   menu.glyph	Маркери, позначки та стрілки підменю
   menu.text.disabled	Неактивний пункт меню
   toolbar.line	Верхня лінія панелі інструментів
   toolbar.line.light	Підсвічування під ним
   toolbar.hot	Кнопка панелі інструментів під вказівником
   toolbar.hot.faint	Інша частина розділеної кнопки, коли одна з них під вказівником
   toolbar.pressed	Натиснута кнопка панелі інструментів
   toolbar.hot.edge	Край активної кнопки панелі інструментів
   toolbar.hot.border	Межа активної кнопки панелі інструментів (прозора: немає)
   toolbar.split.shadow	Роздільник розділеної кнопки в спокої: її тінь
   toolbar.split.light	Підсвічування роздільника
   toolbar.text.disabled	Неактивна мітка панелі інструментів
   toolbar.arrow	Стрілка кнопки, що випадає
   icon.disabled	Колір неактивної іконки (її початок)
   icon.disabled.end	Колір неактивної іконки (її кінець)
   tree	Фон дерева категорій
   tree.lines	Пунктирні з'єднувачі дерева
   tree.expander	Шеврони дерева, де їх малює варіант
   tree.frame	Рамка панелі категорій
   progress.status	Значення «Стан» у вікні прогресу
   progress.label.disabled	Неактивна мітка у вікні прогресу
   segments.border	Рамка панелі сегментів
   segments.corner	Кутові пікселі панелі сегментів
   pieces.have	Частина торрента, яка тут
   pieces.partial	Квадрат, що позначає частково наявні частини
   pieces.missing	Частина, якої ще немає
   caption	Рядок заголовка, який MDM малює сам
   caption.text	Його заголовок та гліфи
   caption.text.inactive	Його заголовок та гліфи, коли вікно неактивне, та неактивної кнопки
   caption.hot	Кнопка заголовка під вказівником (відтінок над панеллю)
   caption.pressed	Натиснута кнопка заголовка (відтінок над панеллю)
   caption.button	Кнопка заголовка в спокої, де стиль показує її (відтінок над панеллю; прозора: немає)
   caption.close	Кнопка «Закрити» під вказівником
   caption.close.text	Гліф кнопки «Закрити» під вказівником
   caption.inactive	Рядок заголовка, намальований MDM, коли його вікно неактивне (прозорий: як при активному)
   drop-target.edge	Край цілі перетягування в стані спокою
   egui.panel	Фон панелі egui
   egui.window	Фон підказок
   egui.window.border	Межа підказок
   egui.text	Текст підказок
   egui.selection.text	Колір виділеного тексту в полях egui
   egui.extreme	Найтемніший (або найсвітліший) фон egui
   egui.faint	Тьмяний фон egui
   egui.widget	Віджети egui в стані спокою
   egui.widget.border	Їхня межа (прозора: відсутня)

   Усі розміри (26)

   Ключ	Що він встановлює
   radius	Радіус кутів кнопок, текстових полів і спадних списків
   radius.button	Радіус кутів глянцевої кнопки (Luna, Aero; у Aqua вони заокруглені на кінцях)
   radius.part	Радіус кутів тонованої частини (зона стрілки, кнопка зі стрілками)
   radius.check	Радіус кутів прапорця
   radius.flyout	Радіус кутів спливаючого вікна (календар, поле фільтра)
   radius.menu-item	Радіус кутів пункту меню під вказівником
   radius.egui	Радіус кутів власних віджетів egui
   radius.popup	Радіус кутів підказок
   border	Ширина межі елемента керування
   focus-line	Висота акцентної лінії сфокусованого текстового поля
   chevron.width	Товщина штриха шеврона спадного списку
   font.dialog	Текст діалогу (Tahoma у діалогах IDM)
   font.dialog.bold	Заголовки сторінок «Параметри»
   font.title	Заголовок вікна (Tahoma Bold): розширення браузера, помічників
   font.code	Код для входу, який потрібно ввести на сторінці сервісу
   font.ui	Меню та текст головного вікна (Segoe UI)
   font.ui.bold	Жирні заголовки в головному вікні
   font.small	Малий текст egui
   font.body	Основний текст egui: підказки, багаторядкові поля
   font.heading	Заголовки egui
   list.row	Висота рядка у списку завантажень
   list.header	Висота заголовків стовпців списку завантажень
   tooltip.width	Місце перенесення тексту підказки
   tooltip.margin-x	Лівий та правий відступ підказки
   tooltip.margin-top	Верхній відступ підказки
   tooltip.margin-bottom	Нижній відступ підказки

   Стиль кожного елемента керування (7)

   Ключ	Його стилі
   field-focus	лінія, рамка, кільце
   check	fluent, square, adwaita, breeze, luna, aero, aqua
   button	fluent, breeze, luna, aero, aqua
   progress	лінія, смуга, блоки, глянець
   scroll	накладання, класичний
   caption	system, metro, adwaita, breeze, luna, aero, aqua
   focus	пунктир, кільце, рамка

   Або дозвольте помічнику ШІ написати його

   Скопіюйте цей запит у свого помічника ШІ та опишіть бажаний вигляд наприкінці. Це надасть помічнику формат, ключі та правила: читабельний текст і видимий фокус з обох сторін, і нічого не скопійованого з чужих робіт. Перегляньте обидві сторони самостійно, перш ніж ділитися результатом.

   You are making a theme file for Mister Download Manager (MDM), a free, open-source download manager. Write one TOML file, named after the theme in lower case with dashes (for example harbour.toml). Reply with the file only, in one code block, then one line on how to install it.
   
   THE FORMAT
   A theme names only what it changes; everything else comes from the theme it inherits.
   - name = "Display name"
   - inherits = "classic" (the default), "high-contrast", "metro", "adwaita", "breeze", "luna", "aero" or "aqua"
   - icons = "color" | "mono" | "accent"
   - contrast = "high" (optional: strengthens every edge and text colour)
   - [seeds] a few colours MDM spreads over every control: background, surface, header, text, accent, selection, error, warning, success. Use [seeds.light] and [seeds.dark] to give each side its own.
   - [colors] single colour roles for both sides; [light] and [dark] for one side only. Role names are dotted and must be quoted when they contain a dot, e.g. "button.hot" = "#e5f1fb". Useful roles: window, text, text.muted, link, accent, focus.ring, selection, selection.text, field, field.border, button, button.hot, button.pressed, button.border, button.text, check.on, check.mark, progress.bar, list, header, menubar, menu, menu.hot, menu.text, toolbar.hot, tree, caption, caption.text, scroll.thumb, gloss (the shine glossy parts blend toward), button.glow. "segments.done" takes one colour or a list of 13 (top to bottom).
   - [sizes] in pixels, 0 to 400: radius, radius.button, radius.check, radius.menu-item, radius.popup, border, focus-line, list.row, list.header, font.ui, font.dialog.
   - [controls] shapes: field-focus = line | border | ring; check = fluent | square | adwaita | breeze | luna | aero | aqua; button = fluent | breeze | luna | aero | aqua; progress = line | bar | blocks | gloss; scroll = overlay | classic; focus = dotted | ring | frame; caption = system | metro | adwaita | breeze | luna | aero | aqua.
   - Colours are "#rrggbb" or "#rrggbbaa". Unknown keys are skipped, so only use the names above.
   
   THE RULES
   1. Make both a light and a dark side: give [seeds.light] and [seeds.dark] (or [light] and [dark]) their own colours, and check each side on its own.
   2. Text must be easy to read: at least 4.5:1 contrast for text against its background (text on window and field, button.text on button, menu.text on menu, selection.text on selection, caption.text on caption), in both sides.
   3. The keyboard focus must be easy to see: accent and focus.ring at least 3:1 against what they sit on.
   4. Disabled text stays readable but clearly dimmer than normal text.
   5. Clean room: no artwork, icons, logos, fonts or text copied from any other program or company. If the theme needs icons, describe original ones to draw, never copy existing ones, and note their source and licence in a SOURCES.txt.
   6. Keep the layout: a theme changes colours, sizes and control shapes only.
   
   After the file, list each text and background pair you checked with its contrast ratio, for both sides.
   
   THE LOOK I WANT:

2. Спробуйте, не збираючи MDM

   Помістіть файл у папку тем MDM. Вигляд → Тема → Відкрити папку тем відкриває її та створює вперше. Вона знаходиться в папці даних MDM:

   Windows

   %APPDATA%\misterdownloadmanager\themes

   Linux

   ~/.local/share/misterdownloadmanager/themes

   macOS

   ~/Library/Application Support/misterdownloadmanager/themes

   Портативна копія

   data\themesпоруч із програмою

   Протягом двох секунд вона з'явиться в Вигляд → Тема, під вбудованими темами, за name, яку вона надає собі. Виберіть її, і все вікно зміниться одразу. Після редагування файлу, виберіть його знову в Вигляд → Тема, щоб побачити зміни. Вигляд → Підтримка темного режиму та Завжди темна тема перемикають між світлою та темною сторонами.

   Вигляд → Тема → Додати файл теми… зробить це за вас: виберіть файл будь-де, і MDM скопіює його до папки з темами та одразу застосує.

   Вже маєте схему Base16 або pywal?

   Це вже тема. Схема Base16 або Base24 (.yaml) або colors.json від pywal, додана таким же чином, змінює лише кольори MDM: фони схеми за списком і вікнами, текст залишається читабельним (4.5:1 або більше), синій колір для фокусу, виділення та індикатора прогресу. Після запуску wal, Вигляд → Тема відображає pywal, прочитаний з ~/.cache/wal/colors.json (%USERPROFILE%\.cache\wal\colors.jsonу Windows), і MDM слідує кольорам кожних нових шпалер протягом двох секунд. Посібник показує, який колір куди йде.

3. Поділіться цим

   Створили щось, що сподобається іншим? Відкрийте pull request на GitHub, який додає його до crates/app/assets/themes, з:

   • файл .toml та його папку з іконками, якщо вона є;
   • знімки головного вікна у світлому та темному режимах;
   • значок SOURCES.txt поруч із будь-якими іншими значками, із зазначенням автора та ліцензії. Значки мають бути вашими власними або під ліцензією, що дозволяє MDM ділитися ними (GPL-3.0), ніколи не копіюватися з іншої програми.

   Ще не впевнені? Спочатку покажіть це в обговореннях. Посібник для учасників пояснює, як тут працюють запити на злиття.