Баннеры групп для форумов SA:MP

Мануал Баннеры групп для форумов SA:MP

Нет прав для скачивания

Skaiman

Администратор
Регистрация
29.06.18
Сообщения
1 328
Решения
4
Реакции
1 104
Баллы
85
Skaiman разместил(а) новый ресурс:

Баннеры групп для форумов SA:MP - Баннеры групп для форумов серверов SA:MP

Картинки хорошо, но вот ресурсы с баннерами изображением без исходника PSD, мало имеют смысла, так как содержат только уже готовые названия групп, которые не всегда есть на другом форуме. Уже не первый раз делаю подобные баннеры на CSS/LESS.
Предварительно сделаны логотипы для серверов:
  • Arizona RP - arizona-logo.png
  • NextRP - next-logo.png
  • Evolve RP - evolve-logo.png
  • Diamond RP - diamond-logo.png
  • Radmir RP - radmir-logo.png
Скачиваем архив и содержимое папки...

Посмотреть страницу этого ресурса...
 

Skaiman

Администратор
Регистрация
29.06.18
Сообщения
1 328
Решения
4
Реакции
1 104
Баллы
85

Skaiman

Администратор
Регистрация
29.06.18
Сообщения
1 328
Решения
4
Реакции
1 104
Баллы
85

Skaiman

Администратор
Регистрация
29.06.18
Сообщения
1 328
Решения
4
Реакции
1 104
Баллы
85
Skaiman обновил ресурс Баннеры групп для форумов SA:MP новой записью:

Добавление логотипа нового сервера

Добавил логотип сервера Матрешка RP - matreshka-logo.png, изменил качество других логотипов.
Посмотреть вложение 733

Посмотреть подробности об этом обновлении...
 

Andrey$

Проверенный
Регистрация
25.10.22
Сообщения
7
Реакции
0
Баллы
13
Здравствуйте. Как перенести текст?
IMG_20230103_150332_923.jpg
 

Skaiman

Администратор
Регистрация
29.06.18
Сообщения
1 328
Решения
4
Реакции
1 104
Баллы
85
Здравствуйте. Как перенести текст?
Попробуй ниже кода добавить:
Код:
.userBanner strong {
    display: inline-block;
    max-width: 70%;
}
С максимальной шириной можно поэксперементировать по месту
 

Andrey$

Проверенный
Регистрация
25.10.22
Сообщения
7
Реакции
0
Баллы
13
Хотелось бы немного нижний текст подсунуть вниз
IMG_20230103_230347_157.jpg
 

Skaiman

Администратор
Регистрация
29.06.18
Сообщения
1 328
Решения
4
Реакции
1 104
Баллы
85
По идеи не обязательно применять ко всем баннерам перенос текста, можно делать индивидуально, например,
есть код баннера группы состоящим из двух слов:
Баннер группы:
    &moder {
        .svg-userBannerVariation(#fff, #019875);
        .gradientUserBanner();       
    }
добавляем для него перенос текста:
Баннер группы с переносом текста:
    &moder {
        .svg-userBannerVariation(#fff, #019875);
        .gradientUserBanner();
        strong {
            display: inline-block;
            max-width: 70%;
        }               
    }
Таким образом не затронутся другие баннеры, где перенос текста не требуется
 

Andrey$

Проверенный
Регистрация
25.10.22
Сообщения
7
Реакции
0
Баллы
13
Я имею ввиду расстояние от текста "Руководитель" до текста "проекта".
 

Skaiman

Администратор
Регистрация
29.06.18
Сообщения
1 328
Решения
4
Реакции
1 104
Баллы
85
Andrey$ - Masha Jones, зачем морочить голову людям на другом форуме, ресурс мой и находится он здесь, логично и вопросы задавать автору и в теме ресурса. На инфо просто люди не понимают о чем идет речь и соответственно не смогут дать вменяемого ответа. Да и не совсем корректно приписывать се6е то, что сделано не самим или самой :)
 

Andrey$

Проверенный
Регистрация
25.10.22
Сообщения
7
Реакции
0
Баллы
13
Вау, это ты что с форума XenForo Info?
Круто.
Теперь помоги, как подсунуть иконку немного вправо?
 

Skaiman

Администратор
Регистрация
29.06.18
Сообщения
1 328
Решения
4
Реакции
1 104
Баллы
85
Теперь помоги, как подсунуть иконку немного вправо?
Не понятно что тебе требуется, как подсунуть? Нижний текст ни как не подсунешь под верхний, по причине того, что это текст и идет он последовательно, сначала верхний, потом нижний.
 

Andrey$

Проверенный
Регистрация
25.10.22
Сообщения
7
Реакции
0
Баллы
13
Иконку нужно подсунуть.
Сообщение автоматически объединено:

IMG_20230105_210708_860.jpg
Вот эту иконку нужно подсунуть вправо.
 

Skaiman

Администратор
Регистрация
29.06.18
Сообщения
1 328
Решения
4
Реакции
1 104
Баллы
85
В этом участке кода:
Код:
.userBanner {
    font-style: normal;
    text-transform: uppercase;
    font-weight: 600;
    padding: 3px 5px 3px 3px;
в свойстве padding, последнее значение 3px, измени на большее
 

Andrey$

Проверенный
Регистрация
25.10.22
Сообщения
7
Реакции
0
Баллы
13
Получилось.
И последнее: как изменить цвет самого круга, где находиться логотип?
 
Верх Низ