Каков наилучший способ иметь пользовательские стили CSS для темы макета? - PullRequest
Новая
       14

Каков наилучший способ иметь пользовательские стили CSS для темы макета?

1 голос
/ 20 декабря 2010

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

Я также не хочу создавать весь шаблон CSS на сервере, если мне это не нужно. Я хотел бы сохранить его в моем файле / css, если это возможно, без каких-либо серверных зависимостей.

В идеале я хотел бы просто переопределить стили по умолчанию, но я не думаю, что это возможно, поскольку это, вероятно, сотрет существующие стили. А это значит, что при перезаписи у меня будет дублированная информация о стиле ... что тоже плохо. Дублирование = плохо.

Полагаю, мы можем предположить, что существует некоторый объект сервера, связанный с их учетной записью, который имеет несколько свойств для различных цветов, таких как фоны, вкладки меню, цвета ссылок, скрытые версии и т. Д. 

public class Theme {

    private String headerBackground = "#172636";
    private String displayName = "#ffffff";

    private String tabBackground = "#284767";
    private String tabText = displayName;
    private String hoverTabBackground = tabBackground;
    private String hoverTabText = tabText;
    private String selectedTabBackground = "#f5f5f5";
    private String selectedTabText = "#172636";

    private String tableHeaderBackground = headerBackground;
    private String tableHeaderText = displayName;
    private String tableSubHeaderBackground = tabBackground;
    private String tableSubHeaderText = displayName;
    private String hoverTableRowBackground = "#c0d2e4";

    private String link = "#4e6c92";

Мое лучшее предположение состоит в том, чтобы просто обслуживать весь файл css и заставить мою инфраструктуру MVC объединить тему с текстом css и затем разослать ее. Это лучший способ? Это заставит браузер никогда не кэшировать его?

Мое приложение использует Spring / Hibernate, но я уверен, что любые рекомендации, даже если вы не используете Java / Spring, будут пригодны для этих технологий.

Спасибо за помощь.

Ответы [ 2 ]

3 голосов
/ 20 декабря 2010

Позволить посетителям / пользователям настраивать их внешний вид и внешний вид может быть довольно опасно. Вам нужно будет сохранить свойства в их профиле, чтобы сохранить внешний вид во время сеансов браузера.

По сути, это означает, что вы можете использовать свой собственный файл CSS, который вы отображаете по требованию. Вы можете кэшировать это на их клиенте и использовать клиентскую JS для повторной загрузки этого файла, когда / если они изменят свои предпочтения LAF.

Один из способов - сделать ссылку на их таблицу стилей следующим образом: 

<link type="text/css" rel="stylesheet" href="siteStyles.css" />
<link type="text/css" rel="stylesheet" 
      href="customStylesheet.jsp?userId=123123123" />

Вам понадобится довольно автономный слушатель приложения, который просто загружает свой профиль и (возможно) заполняет файл шаблона, используя замены строк (или что-то лучшее). Вам нужно убедиться, что тип ответа mime установлен на "text / css". Браузер сделает все остальное.

Чтобы заставить браузер перезагружать файл CSS, просто добавьте некоторую болтовню, например номер версии, в строку запроса: 

<link type="text/css" rel="stylesheet" 
   href="customStylesheet.jsp?userId=123123123&vn=123" />
0 голосов
/ 20 декабря 2010

О, хороший дубль.Но очень важно применить некоторую фильтрацию к строкам, которые предоставляет пользователь, иначе вы подвергаете свое приложение некоторым серьезным атакам с внедрением кода!

...