Сделайте переводы тем доступными из CSS

На самом деле, настройки темы доступны из CSS, но не переводы темы.

Было бы здорово сделать их переводимыми.

Например, в компоненте темы DiscoTOC у нас есть такая настройка:

используемая в CSS:

Добавление текста через CSS — это своего рода последнее средство, так как это не обеспечивает доступность. Я не думаю, что мы должны поощрять это, поддерживая дополнительными функциями.

8 лайков

Но можно ли реализовать что-то подобное с помощью плагина?

Плагин для включения переводов в SCSS… всё возможно, но это будет очень запутанно. Например, вам каким-то образом придётся компилировать разные CSS-ассеты для каждого языка. Настоятельно рекомендую не пытаться этого делать.

Одна возможная идея… но не рекомендация (то есть, если вы решитесь на это, то действуете на свой страх и риск :P)

Я понимаю, что это плохая идея

Вы можете сделать что-то подобное в JavaScript темы:

document.documentElement.style.setProperty('--my-translation-name', `"${ I18n.t(themePrefix("my-translation-name")) }"`);

А затем в CSS:

 &:before {
    content: var(--my-translation-name);
  }

Это может сломаться множеством способов: если вы добавите кавычку или специальные символы в перевод, это приведёт к ошибке. Если вы попробуете использовать это в IE11, это также не сработает.

5 лайков

Я тоже не поддерживаю возможность доступа к переводам в CSS темы :+1:

Что касается примера в вашем сообщении @evantill, он будет удалён в следующем обновлении этого компонента темы.

8 лайков

Эта тема была автоматически закрыта через 3 часа. Новые ответы больше не принимаются.