Единый форум поддержки

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » Единый форум поддержки » Вопросы по оформлению форума » Оформление, скрипты, правки стиля - Tusich


Оформление, скрипты, правки стиля - Tusich

Сообщений 1 страница 20 из 1019

1

Да, наверное стоит создать отдельную тему..)) А по поводу валидации - не заморачивайся особо с ней, оно конечно допускать ошибки не стоит и пустые значения типа: color:""; делать не надо, но валидаторы не любят скрипты поэтому возмущаются на них - на это обращать внимание особо не стоит.. С мобильными стилями - тут сложнее, бо мобильные браузеры, в отличии от ПК еще очень далеки от оптимизации и нормальной работы..

Ну вот и перекочевали ))) насчёт значения цвета, что ты привёл в пример - сразу побежала проверять  :rofl: ничего подобного вроде нет )) но заметила, что некоторые селекторы, строки повторяются, надо бы потом совместить частично, код хоть чуть-чуть уменьшится и стиль закладок тоже в блокнот перенести. пока руки не доходят.

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

мне кажется, что это реализуемо. потому как есть же переключение стилей и если выберешь второй, то он и будет всегда отображаться при входе.  ну вот такая моя женская логика  :rofl:

Ну, разве что вручную.. Добавить новый класс к последнему блоку, к примеру .niz:

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

А вот это я не понял - я же делал скролл, а теперь у тебя: overflow-y: inherit; Тебе нужен резиновый, скролл или скрытие? Кстати не знаю такого значения для overflow как inherit...

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

Отредактировано Tusich (Пт, 3 Фев 2017 07:39:49)

0

2

Tusich написал(а):

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

Да, это возможно - мобильный стиль как правило привязывается к разрешению экрана, это называется адаптивный дизайн, он появился раньше смартфонов с большими экранами и применялся как раз для настольных ПК с разным разрешением экрана.. Это сейчас 14 дюймов экран и низкое разрешение можно увидеть только на ноутбуках, да и то разрешение не низкое у них))

Tusich написал(а):

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

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

Tusich написал(а):

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

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

0

3

kolobdur74 написал(а):

Да, это возможно - мобильный стиль как правило привязывается к разрешению экрана

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

kolobdur74 написал(а):

фокус не выйдет

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

сейчас я не знаю, как мне вынести с меню "поиск", вот на квадро хороший поиск сделан, но только мне надо не в меню, а в окошко справа выше меню.
есть ли такая возможность? и убрать само слово в меню.

0

4

Tusich
Нарисуйте на скриншоте - как должно быть (*про Поиск

0

5

Alex_63
на форуме в шапке фон этого поиска справа

0

6

Tusich написал(а):

сейчас я не знаю, как мне вынести с меню "поиск", вот на квадро хороший поиск сделан, но только мне надо не в меню, а в окошко справа выше меню.
есть ли такая возможность? и убрать само слово в меню.

Добавь в Дополнительные пункты меню:

5=<a href="http://joannaseymour.mybb.ru/search.php#punbbsearch" title="Расширенный поиск"></a>

Потом скину весь код..

+1

7

kolobdur74 написал(а):

Потом скину весь код..

добавила в доп. меню.

0

8

Tusich написал(а):

добавила в доп. меню.

Поставь в НТМЛ верх:

Код:
<style>
#navextra1 {position: absolute; top: 56px; right: 146px; width: 18px !important; height: 18px !important; padding: 0px !important; z-index: 65000 !important;}
#navextra1 a {display: block; width: 18px !important; border-radius: 5px; -webkit-border-radius: 5px; height: 18px !important; background: url(/files/0003/ac/ce/58436.png) no-repeat center center; padding: 0px !important; opacity: 0.5;}
#navextra1 a:hover {background: url(/files/0003/ac/ce/62394.png) no-repeat center center; padding: 0px !important; opacity: 1;
    -moz-transform: rotate(45deg); /* Aey Firefox */
    -ms-transform: rotate(45deg); /* Aey IE */
    -webkit-transform: rotate(45deg); /* Aey Safari, Chrome, iOS */
    -o-transform: rotate(45deg); /* Aey Opera */
    transform: rotate(45deg); }
#pun-fastsearch {width: 114px; position: absolute; top: 52px; right: 170px; z-index: 50000;}  
#pun-fastsearch .io {background: #fff !important; box-shadow: inset 0 0 2px #777; -moz-box-shadow: inset 0 0 2px #777; -webkit-box-shadow: inset 0 0 2px #777; width: 104px; padding: 5px; text-align: left; color: #ccc !important; font-size: 13px !important; border: 0px; border-radius: 3px; -webkit-border-radius: 3px;}
#pun-fastsearch .io:focus, #pun-fastsearch .io:hover {box-shadow: inset 0 0 3px #0a96e6; -moz-box-shadow: inset 0 0 3px #0a96e6; -webkit-box-shadow: inset 0 0 3px #0a96e6;}
#pun-fastsearch .io:focus {color: #333 !important; }
</style>
<div id="pun-fastsearch" class="section">
<form id="punbbsearch2" class="container" method="get" action="http://projekt1.bbmy.ru/">
<input type="hidden" name="action" value="search" />
<input type="text" id="fld1s" name="keywords" size="40" maxlength="100" class="io"  placeholder="волшебный поиск"  />
</form>
</div>
<script type="text/javascript">
(function($){
    $(function(){
        $('.subrules').tipsy({fade: true, gravity: $.fn.tipsy.autoWE});
        $('#navextra1 a').tipsy({fade: true, gravity: 'nw'});
    });
})(jQuery)
</script>

Тестируй..

+1

9

kolobdur74
:rofl:
это что?

0

10

Tusich написал(а):

это что?

Это мой тестовик))) Пропустил его))) Поправил и дотырил картинки с квадро (можно поменять на свои).. Замени весь код на:

Код:
<style>
#navsearch {display:none;}
#navextra1 {position: absolute; top: 56px; right: 146px; width: 18px !important; height: 18px !important; padding: 0px !important; z-index: 65000 !important;}
#navextra1 a {display: block; width: 18px !important; border-radius: 5px; -webkit-border-radius: 5px; height: 18px !important; background: url(https://forumstatic.ru/files/0003/ac/ce/58436.png) no-repeat center center; padding: 0px !important; opacity: 0.5;}
#navextra1 a:hover {background: url(https://forumstatic.ru/files/0003/ac/ce/62394.png) no-repeat center center; padding: 0px !important; opacity: 1;
    -moz-transform: rotate(45deg); /* Aey Firefox */
    -ms-transform: rotate(45deg); /* Aey IE */
    -webkit-transform: rotate(45deg); /* Aey Safari, Chrome, iOS */
    -o-transform: rotate(45deg); /* Aey Opera */
    transform: rotate(45deg); }
#pun-fastsearch {width: 114px; position: absolute; top: 52px; right: 170px; z-index: 50000;}  
#pun-fastsearch .io {background: #fff !important; box-shadow: inset 0 0 2px #777; -moz-box-shadow: inset 0 0 2px #777; -webkit-box-shadow: inset 0 0 2px #777; width: 104px; padding: 5px; text-align: left; color: #ccc !important; font-size: 13px !important; border: 0px; border-radius: 3px; -webkit-border-radius: 3px;}
#pun-fastsearch .io:focus, #pun-fastsearch .io:hover {box-shadow: inset 0 0 3px #0a96e6; -moz-box-shadow: inset 0 0 3px #0a96e6; -webkit-box-shadow: inset 0 0 3px #0a96e6;}
#pun-fastsearch .io:focus {color: #333 !important; }
</style>
<div id="pun-fastsearch" class="section">
<form id="punbbsearch2" class="container" method="get" action="http://joannaseymour.mybb.ru/">
<input type="hidden" name="action" value="search" />
<input type="text" id="fld1s" name="keywords" size="40" maxlength="100" class="io"  placeholder="волшебный поиск"  />
</form>
</div>
<script type="text/javascript">
(function($){
    $(function(){
        $('.subrules').tipsy({fade: true, gravity: $.fn.tipsy.autoWE});
        $('#navextra1 a').tipsy({fade: true, gravity: 'nw'});
    });
})(jQuery)
</script>

+1

11

Tusich
Поправил пару моментов:

Код:
<style>
#pun-navlinks li#navsearch {display:none;}
#navextra1 {position: absolute; top: 56px; right: 146px; width: 18px !important; height: 18px !important; padding: 0px !important; z-index: 65000 !important;}
#navextra1 a {display: block; width: 18px !important; border-radius: 5px; -webkit-border-radius: 5px; height: 18px !important; background: url(https://forumstatic.ru/files/0003/ac/ce/58436.png) no-repeat center center; padding: 0px !important; opacity: 0.5;}
#navextra1 a:hover {background: url(https://forumstatic.ru/files/0003/ac/ce/62394.png) no-repeat center center; padding: 0px !important; opacity: 1;
    -moz-transform: rotate(45deg); /* Aey Firefox */
    -ms-transform: rotate(45deg); /* Aey IE */
    -webkit-transform: rotate(45deg); /* Aey Safari, Chrome, iOS */
    -o-transform: rotate(45deg); /* Aey Opera */
    transform: rotate(45deg); }
#pun-fastsearch {width: 114px; position: absolute; top: 52px; right: 170px; z-index: 50000;}  
#pun-fastsearch .io {background: #fff !important; box-shadow: inset 0 0 2px #777; -moz-box-shadow: inset 0 0 2px #777; -webkit-box-shadow: inset 0 0 2px #777; width: 104px; padding: 5px; text-align: left; color: #ccc !important; font-size: 13px !important; border: 0px; border-radius: 3px; -webkit-border-radius: 3px;}
#pun-fastsearch .io:focus, #pun-fastsearch .io:hover {box-shadow: inset 0 0 3px #0a96e6; -moz-box-shadow: inset 0 0 3px #0a96e6; -webkit-box-shadow: inset 0 0 3px #0a96e6;}
#pun-fastsearch .io:focus {color: #333 !important; }
</style>
<div id="pun-fastsearch" class="section">
<form id="punbbsearch2" class="container" method="get" action="http://joannaseymour.mybb.ru/search.php">
<input type="hidden" name="action" value="search" />
<input type="text" id="fld1s" name="keywords" size="40" maxlength="100" class="io"  placeholder="волшебный поиск"  />
</form>
</div>
<script type="text/javascript">
(function($){
    $(function(){
        $('.subrules').tipsy({fade: true, gravity: $.fn.tipsy.autoWE});
        $('#navextra1 a').tipsy({fade: true, gravity: 'nw'});
    });
})(jQuery)
</script>

+1

12

kolobdur74
я тож чуть подправила окошко поиска, а так, всё работает! супер выглядит! спасибо!

+1

13

kolobdur74
единственное, я не нашла, где можно жёлтый цвет окошка заменить, это когда вводишь текст, появляется жёлтый цвет. у меня просто такого цвета нет на форуме, хотелось бы чуть заменить, на голубоватый или светло-серый

0

14

Tusich написал(а):

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

Это забито в браузер Хром намертво.. Можно убрать автозаполнение, тогда подсветки желтой не будет..

+1

15

kolobdur74
ладно, пусть висит, автозаполнение тоже полезная штука.
спасибо огромное!

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

0

16

Tusich написал(а):

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

Ну, это всё можно заменить на картинки, но я на сегодня пас))

0

17

kolobdur74
да, на картинки, у меня есть специальные уже подготовлено всё ))))
завтречко сможешь сделать?

0

18

Tusich написал(а):

да, на картинки, у меня есть специальные уже подготовлено всё ))))
завтречко сможешь сделать?

Думаю, что да))

+1

19

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

Отредактировано Tusich (Сб, 4 Фев 2017 11:07:26)

0

20

Tusich написал(а):

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

Можно.. Ну, попробуй сгенерировать три варианта, вот хороший генератор для кнопок: https://maxzon.ru/button_gen/index.html

0


Вы здесь » Единый форум поддержки » Вопросы по оформлению форума » Оформление, скрипты, правки стиля - Tusich