WEB интерфейс - стили

Dev1 · Сообщение **Dev1** » 06 дек 2018, 16:26

Может кому и понадобится...

Темный стиль:
[spoiler=Скрины]

dark1.jpg

[/spoiler]
[spoiler=Код]

 body {
 background-color: #595959;
}
 .header 
	{    
	padding: 10px;     
	left: 0px;    
	right: 0px;     
	top: 0px;      
	background: #111111;
	color: rgb(224, 255, 255);
	text-align: center;
	font-weight: 600;
	font-family: 'Times New Roman', Times, serif;
	font-size: 250%; 
	}   
 .menu 
	{
	float:left;    
	padding: 1%;    
	margin: 1%;
	width:16%;    
	background: #B1B0B0;
	border: 1px solid black;
	border-radius: 8px;
	} 
.menuItem 
	{  
	background: #B1B0B0;
	font-weight: 600;
	font-family: 'Times New Roman', Times, serif;
	} 
.content 
	{    
	float:right;    
	width:78%;
	background: #595959;
	color: rgb(255, 228, 181);
	}   
.footer
	{   
	float:left;   
	padding: 1%;    
	width:98%;    
	background: #111111;   
 	margin-top: 1%; 
	color: rgb(224, 255, 255);
 	text-align: center;
	font-weight: 600;
	font-family: 'Times New Roman', Times, serif;
	font-size: 150%;
	}
.buttonFlp 
	{
	width:150px;
	border-radius:20px;
	background:#5D6C5D;
	color: rgb(224, 255, 255);
	font-size:12px;
	cursor:pointer;
	float:left;    
	padding: 1%;    
	 margin: 1%;
	}
.buttonFlp:hover
	{
	background:#495849;
	}
.buttonFlp:focus
	{
	outline:none;
	}

[/spoiler]

В стиле Arduino IDE:
[spoiler=Скрины]

arduino_ide1.jpg

arduino_ide2.jpg

[/spoiler]
[spoiler=Код]

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

 .header 
	{    
	padding: 10px;     
	left: 0px;    
	right: 0px;     
	top: 0px;      
	background: #227571; 
	text-align: center;
	color:#fff;
	font-weight: 600;
	font-family: 'Times New Roman', Times, serif;
	font-size: 250%; 
	}   
 .menu 
	{
	float:left;    
	padding: 1%;    
	margin: 1%;
	width:16%;    
	background: #20B2AA;
	border: 1px solid black;
	border-radius: 8px;
	} 
.menuItem 
	{  
	background: #20B2AA;
	font-weight: 600;
	font-family: 'Times New Roman', Times, serif;
	} 
.content 
	{    
	float:right;    
	width:78%;
	font-weight: 600;
	}   
.footer
	{   
	float:left;   
	padding: 1%;    
	width:98%;    
	background: #227571;   
 	margin-top: 1%;
	color:#fff;
 	text-align: center;
	font-weight: 600;
	font-family: 'Times New Roman', Times, serif;
	font-size: 150%;
	}
.buttonFlp 
	{
	width:150px;
	border-radius:20px;
	background:#20B2AA;
	color:#fff;
	font-size:12px;
	cursor:pointer;
	float:left;    
	padding: 1%;    
	 margin: 1%;
	}
.buttonFlp:hover
	{
	background:#1A8983;
	}
.buttonFlp:focus
	{
	outline:none;
	}

[/spoiler]
Вставлять код в общий стиль:
[spoiler=Куда вставлять]

web_interface.jpg

[/spoiler]
Что бы вернуть на стандартный стиль нажать внизу кнопочку "По умолчанию".

pipapsix · Сообщение **pipapsix** » 06 дек 2018, 17:54

Опа на. как раз хотел это искать. Пробую.

Отправлено спустя 43 минуты 20 секунд:
У меня чет не получается. выходит вот что 404 - Page not fond
Можно скринов побольше как что делать.
Или ткнуть мордой в обучалку.

Lukum · Сообщение **Lukum** » 06 дек 2018, 18:16

А как чек бокс сменить на кнопку, чтоб ни галочку ставить а кнопку ?

pipapsix · Сообщение **pipapsix** » 06 дек 2018, 18:42

Кому не жалко, поделитесь проэктом с рабочим веб интерфейсом, я одним глазком посмотрю.

Dev1 · Сообщение **Dev1** » 06 дек 2018, 19:19

pipapsix писал(а): 06 дек 2018, 18:42Кому не жалко, поделитесь проэктом с рабочим веб интерфейсом, я одним глазком посмотрю.

Вставить свои настройки имя сети и пароль.

test_web_no_ssid_pass.flp

Отправлено спустя 3 минуты 9 секунд:

pipapsix писал(а): 06 дек 2018, 17:54 У меня чет не получается. выходит вот что 404 - Page not fond
Можно скринов побольше как что делать.
Или ткнуть мордой в обучалку.

Все легко, заходите в веб интерфейс, общий стиль, вкладка описание стилей. Удаляете все в этой вкладке и вставляете код стиля с 1 сообщения. Соответственно код должен быть полностью. Та еще скрин есть куда вставлять(в 1 сообщении).

pipapsix · Сообщение **pipapsix** » 06 дек 2018, 19:30

благодарю.работает. теперь буду искать где я накосячил. вроде так же делал

Dev1 · Сообщение **Dev1** » 06 дек 2018, 19:34

Можно просто сравнить начало и конец кода в спойлере и проекте. Начала у двух стилей разные.

pipapsix · Сообщение **pipapsix** » 06 дек 2018, 19:39

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

Dev1 · Сообщение **Dev1** » 06 дек 2018, 19:42

Тока что проверил код двух стилей из 1 сообщения, все работает...

Lukum · Сообщение **Lukum** » 06 дек 2018, 19:45

А чек бокс на кнопку поменять можеш?

Dev1 · Сообщение **Dev1** » 06 дек 2018, 19:51

Lukum писал(а): 06 дек 2018, 19:45А чек бокс на кнопку поменять можеш?

Так не я придумал чек-бокс, это к Сергею нужно, чтоб добавил. Правда это кнопку надо как переключатель, вкл-выкл.
[spoiler]

111.jpg

[/spoiler]

Lukum · Сообщение **Lukum** » 06 дек 2018, 20:20

Ну да можно так, а то с телефона не очень удобно, ладно буду капать в иде вставить вручную пробовать

pipapsix · Сообщение **pipapsix** » 08 дек 2018, 07:28

Оказывается все просто.
Другой вопрос.
Одновременно использовать клент и точка доступа не получится. ?
Нужно к примеру, пришел в помещение где новая сеть, я подключаюсь к ЕСП по точке доступа и там ввожу новую сеть и пароль и перезагружаюсь. Все, подключен к новой сети.Вот как это реализовать?? не пойму.

ivanpost · Сообщение **ivanpost** » 08 дек 2018, 16:59

[ref]pipapsix[/ref], Отключать точку доступа после подключения к главной точке доступа . Через системный параметр - нормально отключается. Но зато включать если нет подключения. Этот же параметр.

[ref]Dev1[/ref], подскажите, какая строка этого CSS отвечает за шрифт пунктов меню? Как у вас вышел шрифт без засечек?

pipapsix · Сообщение **pipapsix** » 08 дек 2018, 17:17

[ref]ivanpost[/ref],
чет не вникну. скрин помог бы.
вроде понял.
короче если сеть потеряешь, то точку доступа не в ключить\\?

на стороннем ресурсе по есп есть функция, что если три раза нажать ресет на есп, то она войдет в безопасный режим и станет точкой доступа, есть тут такая возможность это реализовать??

Dev1 · Сообщение **Dev1** » 08 дек 2018, 17:40

ivanpost писал(а): 08 дек 2018, 16:59Dev1, подскажите, какая строка этого CSS отвечает за шрифт пунктов меню? Как у вас вышел шрифт без засечек?

Пункты меню? Какое меню... Если слева то там с засечками, если в центре то там не указан шрифт, ставит браузер(винда) по умолчанию, похож на verdana. В центральном блоке

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

.content 
	{    
	float:right;    
	width:78%;
	font-weight: 600;
	}

можете сами добавить шрифт какой хотите. В футере, хедере и менюитем уже прописан шрифт:

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

font-family: 'Times New Roman', Times, serif;

Verdana будет выглядеть как то так:

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

font-family: Verdana, Geneva, sans-serif;

или просто

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

font-family: Verdana;

.

ivanpost · Сообщение **ivanpost** » 08 дек 2018, 19:59

[ref]pipapsix[/ref], Условие после старта - всегда включается AP, выключается когда клиент подключился.

Отправлено спустя 3 минуты 53 секунды:
[ref]Dev1[/ref], А как цветом заливаете весь страницу кроме футера и хеадера?

Отправлено спустя 1 минуту 14 секунд:
Сорри! Увидел бакгроунд!

Dev1 · Сообщение **Dev1** » 08 дек 2018, 20:14

ivanpost писал(а): 08 дек 2018, 19:59Dev1, А как цветом заливаете весь страницу кроме футера и хеадера?

Отправлено спустя 1 минуту 14 секунд:
Сорри! Увидел бакгроунд!

background это по модулям, а на странице в целом фон:

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

 body {
 background-color: #595959;
}

в первом стиле реализовано.

pipapsix · Сообщение **pipapsix** » 09 дек 2018, 07:26

ivanpost писал(а): 08 дек 2018, 19:59pipapsix, Условие после старта - всегда включается AP, выключается когда клиент подключился.

если это вопрос, то да.

Сообщение **aidar_i** » 09 дек 2018, 08:26

pipapsix писал(а): 08 дек 2018, 07:28. пришел в помещение где новая сеть, я подключаюсь к ЕСП по точке доступа и там ввожу новую сеть и пароль и перезагружаюсь. Все,

Пользовательский блок Wifimanager это делает.

FlProg