Страница 14 из 15

Re: Активные объекты на сценах

Добавлено: Сб дек 20, 2014 11:10 am
Amarok
sergejey писал(а):
BlackWarrior писал(а):А как можно изменить размер этого элемента?
Пока эта часть сцен ещё в работе и может изменяться, поэтому я не анонсирую детали. Позже я выложу подробную инструкцию, как работать со стилями элементов сцены.
Именно выключателя размер можно исправить в файле ./cms/scenes/styles/switch/style.css
Не, не вариант((
Может с помощью CSS/HTML кода можно кнопку нарисовать?

Re: Активные объекты на сценах

Добавлено: Сб дек 20, 2014 11:27 am
Amarok
Пробую создать кнопку с таким кодом:

Код: Выделить всё

<style>
div.state_24 {
  font-size: 12pt;
  font-weight:700;
  text-align: center;
  border-radius: 4px;
  border: 0.5px solid rgb(250,172,17);
  background-image: linear-gradient(to top, rgba(0,150,255,0.4) %Officeroom.Humidity%%, rgba(0,255,255,0.6), rgba(60,255,255,0.5), rgba(60,255,255,0.4));
}
</style>
текст
SPOILERSPOILER_SHOW
Clipboard01.jpg
Clipboard01.jpg (21.8 КБ) 13243 просмотра
На сцене выходит такая:
Clipboard02.jpg
Clipboard02.jpg (1.68 КБ) 13243 просмотра
А ожидал подобную:
Clipboard03.jpg
Clipboard03.jpg (1.46 КБ) 13243 просмотра
Это я дурной?

Re: Активные объекты на сценах

Добавлено: Сб дек 20, 2014 11:53 am
sergejey
А если попробовать так:

Код: Выделить всё

<div style="font-size: 12pt;font-weight:700;text-align: center;border-radius: 4px;border: 0.5px solid rgb(250,172,17);background-image: linear-gradient(to top, rgba(0,150,255,0.4) %Officeroom.Humidity%%, rgba(0,255,255,0.6), rgba(60,255,255,0.5), rgba(60,255,255,0.4));">текст</div> 

Re: Активные объекты на сценах

Добавлено: Сб дек 20, 2014 11:58 am
Amarok
Теперича так:
Clipboard01.jpg
Clipboard01.jpg (1.61 КБ) 13239 просмотров
А как квадрат полупрозрачный белый убрать?

Re: Активные объекты на сценах

Добавлено: Сб дек 20, 2014 8:02 pm
Bagir
Вот же в самом начале пример Сергея http://smartliving.ru/forum/viewtopic.p ... t=0#p12736
У меня есть этот кнопак на отдельной страничке сцен, только я его еще нигде не использовал.
Норма
Изображение
Навел мышь
Изображение
Нажал
Изображение
Дополнительный код CSSSPOILER_SHOW

Код: Выделить всё

div.element_18 {
  display: inline-block;
  color: black;
  font-size: 125%;
  font-weight: 700;
  text-decoration: none;
  user-select: none;
  padding: .25em .5em;
  outline: none;
  border: 1px solid rgb(250,172,17);
  border-radius: 7px;
  background: rgb(255,212,3) linear-gradient(rgb(255,212,3), rgb(248,157,23));
  box-shadow: inset 0 -2px 1px rgba(0,0,0,0), inset 0 1px 2px rgba(0,0,0,0), inset 0 0 0 60px rgba(255,255,0,0);
  transition: box-shadow .2s, border-color .2s;
} 
div.element_18:hover {
  box-shadow: inset 0 -1px 1px rgba(0,0,0,0), inset 0 1px 2px rgba(0,0,0,0), inset 0 0 0 60px rgba(255,255,0,.5);
}
div.element_18:active {
  padding: calc(.25em + 1px) .5em calc(.25em - 1px);
  border-color: rgba(177,159,0,1);
  box-shadow: inset 0 -1px 1px rgba(0,0,0,.1), inset 0 1px 2px rgba(0,0,0,.3), inset 0 0 0 60px rgba(255,255,0,.45);
}

Re: Активные объекты на сценах

Добавлено: Вт дек 23, 2014 12:32 pm
Amarok
Развлекаюсь с HTML-объектами на сценах. Удалось поворачивать надписи:
Clipboard01.jpg
Clipboard01.jpg (59.03 КБ) 13179 просмотров
Код такой:

Код: Выделить всё

<div style="font-size: 18pt;font-weight:700;text-align: center;border-radius: 4px;background-image: linear-gradient(to top, rgba(34,139,34,0.4), rgba(34,139,34,0.6), rgba(34,139,34,0.5), rgba(160,255,255,0.4)); -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); -o-transform: rotate(90deg); writing-mode: tb-rl;">&#9993;%Amarok.GMailUnread%</div>   
SPOILERSPOILER_SHOW
Clipboard02.jpg
Clipboard02.jpg (23.14 КБ) 13179 просмотров

switch на html

Добавлено: Ср дек 24, 2014 7:32 am
Amarok
А никто не пробовал сваять аналог элемента switch используя html?

Re: Активные объекты на сценах

Добавлено: Вт янв 06, 2015 3:20 am
Bagir
Обновил свой элемент термодатчика http://smartliving.ru/forum/viewtopic.p ... 828#p13828
Из интересного: В коде добавлен <script></script> для замены имени класса. Чтобы добраться до него использована функция document.getElementById(); которая возвращает нужный элемент чтобы потом изменить его. Другими словами, так можно серьезно менять вид элемента в зависимости от разных свойств объектов МД.

Re: Элемент Термодатчик

Добавлено: Вс янв 11, 2015 5:04 pm
Dragon
Заголовок: Активные объекты на сценах
Bagir писал(а):Предлагаю вот такое незамысловатое добавление к элементам в виде кружочка для неживых датчиков. Иногда бывает и полезно увидеть, что датчик неживой. Например в случае с z-wave может получиться так, что датчик будет расположен на максимальном удалении от контроллера, и в какой то момент перестанет вообще его видеть.
Здравствуйте хотел сделать как на форуме, чтобы определять живой датчик или нет.
получилось только сделать так для одного датчика, как только а прописываю под второй датчик первый перестает показывать, нет ни точки не стрелок они как то перепрыгивают ко второму датчику хотя свойства .alive и .direction указываю каждому датчику свой.

Re: Активные объекты на сценах

Добавлено: Вс янв 11, 2015 6:44 pm
Bagir
Предположительно причина в id элемента