Перейти к содержанию
CMSTOOLS.org - форум поддержки и развития CMS

Стили уведомлений


Рекомендуемые сообщения

Мужики помогите, как нормально стилизовать то что на скрине, тоесть чтобы уведомление ровно справо выводилось? не могу найти не в js не понимаю не style.css там только хеадм посик, но это другая история)) помогите пожалуйста)

post-215-0-67740700-1435491113_thumb.jpg

Ссылка на комментарий
Поделиться на другие сайты

Мужики помогите, как нормально стилизовать то что на скрине, тоесть чтобы уведомление ровно справо выводилось? не могу найти не в js не понимаю не style.css там только хеадм посик, но это другая история)) помогите пожалуйста)

Тут без css никак. Покажу опять на примере моей моб. версии:

            <div class="sidebar_menu">
                <div class="menu_feed">
                    <a href="/news{news-link}" onClick="Page.Go(this.href); return false" id="news_link">
                        <div class="menu_1"><p>Новости</p><div id="new_news">{new-news}</div></div>
                    </a>
                </div>
                <div class="menu_feed">
                    <a href="/news/notifications" onClick="Page.Go(this.href); return false">
                        <div class="menu_2"><p>Ответы</p></div>
                    </a>
                </div>
                <div class="menu_feed">
                    <a href="/messages" onClick="Page.Go(this.href); return false">
                        <div class="menu_3"><p>Сообщения</p><div id="new_msg">{msg}</div></div>
                    </a>
                </div>

....
              
            </div>

Предположим это меню из main.tpl, где: <div id="new_news">{new-news}</div>, <div id="new_msg">{msg}</div>, <div id="new_requests">{demands}</div>, <div id="new_groups">{new_groups}</div>, <div id="new_photos">{new_photos}</div>, <div id="new_support">{new-support}</div> - это как-раз наши выводы этих уведомлений. Сам источник это index.php (в корне), не долго "рывшись" можно обнаружить вывод этих самых выводов, покажу на одном из них:

<div class=\"headm_newac\" style=\"margin-left:18px\">{$CacheNews}</div>

Вот тебе и весь {new-news}. А дальше дело за css и тем самым .headm_newac

.headm_newac{float:right;background:#7a7e87;margin-top:9px;margin-right:10px;padding:3px 10px;border-radius:10px;font-size:11px;color:#fff;}

Я думаю ничего сложного, немного логики и знаний css и можно с позиционировать все элементы. Как? Все просто, достаточно создать класс с фиксированной шириной (.menu_feed) и запихать в него ссылку с картинкой в одну сторону (.menu_1) и вот это уведомление в другую ({new-news}), вот и всё по сути... В голове провернуть сложно, по этому ксс верхнего меню предоставлю:

.sidebar_menu{width:100%;height:420px;margin-top:15px;border-bottom:solid 1px #1c2127;border-top:solid 1px #373c42;}
.menu_feed{width:280px;height:40px;border-top:solid 1px #1c2127;border-bottom:solid 1px #373c42;}
.menu_feed a {width:280px;height:40px;text-decoration:none;}
.menu_1 p,.menu_2 p,.menu_3 p,.menu_4 p,.menu_5 p,.menu_6 p,.menu_7 p,.menu_8 p,.menu_9 p,.menu_10 p {font-size:15px;margin-left:40px;margin-top:10px;
position:absolute;}
.menu_1 {width:280px;height:40px;background:#252932;background-image:url("../images/menu/1.png");background-position: left center;
background-repeat:no-repeat;color:#9fa3ac;}

Итог:

4688da612d.png

  • Upvote 1
Ссылка на комментарий
Поделиться на другие сайты

Иосиф Сталин все верно сказал, посмотри какой класс стоит у тебя на выводе "+1" и подкоректируй стили, так же не забудь что там +1 , +2, +3 . . . +n количество, что бы когда было +10, +11 . . . +nn было ровно. Ну я думаю ты меня понял.

Ссылка на комментарий
Поделиться на другие сайты

Иосиф Сталин все верно сказал, посмотри какой класс стоит у тебя на выводе "+1" и подкоректируй стили, так же не забудь что там +1 , +2, +3 . . . +n количество, что бы когда было +10, +11 . . . +nn было ровно. Ну я думаю ты меня понял.

Если не задаст ширину на этот класс, а только padding к примеру (как указано на примере выше), то, по сути количество n будет не важно, ибо будет авторасширение класса, хоть 10-n, хоть 100...

2d5e5b97dd.png4dcd89d9f1.png692f814b75.png

 

Ссылка на комментарий
Поделиться на другие сайты

нифига не понял это во - 1,а во-2 меню то devisa, но баганое сори... при каждом переходе выдает ошибку в логах))) хз почему, и сразу скажу, тому кто на лицензии 2.0 объяснит все подробно кину 50 рубчиков, а если уж очень подробно сотку (только вебмани)

Ссылка на комментарий
Поделиться на другие сайты

нифига не понял это во - 1,а во-2 меню то devisa, но баганое сори... при каждом переходе выдает ошибку в логах))) хз почему, и сразу скажу, тому кто на лицензии 2.0 объяснит все подробно кину 50 рубчиков, а если уж очень подробно сотку (только вебмани)

 

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

Ссылка на комментарий
Поделиться на другие сайты

 

нифига не понял это во - 1,а во-2 меню то devisa, но баганое сори... при каждом переходе выдает ошибку в логах))) хз почему, и сразу скажу, тому кто на лицензии 2.0 объяснит все подробно кину 50 рубчиков, а если уж очень подробно сотку (только вебмани)

 

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

 

дк а что не посказать по русски на примере какой стиль сделать и куда вписать?

Ссылка на комментарий
Поделиться на другие сайты

 

 

нифига не понял это во - 1,а во-2 меню то devisa, но баганое сори... при каждом переходе выдает ошибку в логах))) хз почему, и сразу скажу, тому кто на лицензии 2.0 объяснит все подробно кину 50 рубчиков, а если уж очень подробно сотку (только вебмани)

 

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

 

дк а что не посказать по русски на примере какой стиль сделать и куда вписать?

 

Если так подсказывать, то, какой толк? Дело будет, когда ты сам поймёшь что нужно сделать, какой стиль и куда добавить. А если так спрашивать, то, за одним таким вопросом последует следующий и следующий...

Ссылка на комментарий
Поделиться на другие сайты

Гость
Эта тема закрыта для публикации ответов.
×
×
  • Создать...