Различия

Здесь показаны различия между двумя версиями данной страницы.

Ссылка на это сравнение

ru:guide:styling [2016/12/09 15:21] (текущий)
Alexander Yakovlev создано
Строка 1: Строка 1:
 +====== Внешний вид игры ======
  
 +Если кратко,​ то ваша игра на Salet может выглядеть как вам вздумается. Вот полный список предположений,​ которые Salet имеет о вашей игре:
 +
 +  * Игра происходит внутри контейнера ''#​page''​. Всё, что находится вне ''#​page''​ - неигровые элементы.
 +  * В интерфейсе может быть единственная кнопка сохранения игры, у которой выставлен ID ''​save''​.
 +  * В интерфейсе может быть единственная кнопка загрузки игры, у которой выставлен ID ''​load''​.
 +  * В интерфейсе может быть единственная кнопка рестарта игры, у которой выставлен ID ''​erase''​.
 +  * Текст игры находится внутри контейнера ''#​content''​
 +  * В интерфейсе может быть блок ''#​ways'',​ в котором перечислены доступные для перемещения комнаты.
 +  * В интерфейсе может быть блок ''#​ways_hint'',​ в котором есть текст-подсказка для блока перемещения.
 +
 +Каждое предположение,​ в котором есть "​может быть",​ необязательно. Например,​ вы можете скрыть кнопку сохранения игры, потому что в Salet есть автосохранение.
 +
 +Оформление вашей игры — это классический дизайн веб-страниц. У вас есть HTML страница,​ и вы решаете,​ как она будет выглядеть. Но в демо-игре есть хороший вариант веб-дизайна,​ который вы можете отредактировать на свой вкус.
 +
 +Дизайн демо-игры сделан на [[http://​v4-alpha.getbootstrap.com/​|фреймворке Bootstrap]],​ из которого взято только необходимое. Стили страницы написаны на языке SASS, который компилируется в язык стилей CSS.
 +
 +В файле ''​sass/​_variables.scss''​ вы можете отредактировать **цвета** страницы — например,​ переменная ''​$body-bg''​ отвечает за фон страницы.
 +
 +В файле ''​sass/​main.scss''​ вы можете отключить ненужные вам модули Bootstrap или наоборот,​ подключить другие через конструкцию подключения файлов ''​@import''​.
 +
 +  * [[http://​v4-alpha.getbootstrap.com|Почитать больше про Bootstrap]]
 +  * [[http://​sass-lang.com/​|Почитать больше про язык SASS]]
  • ru/guide/styling.txt
  • Последние изменения: 2016/12/09 15:21
  • Alexander Yakovlev