Перейти к публикации
View in the app

A better way to browse. Learn more.

Дизайн и модификация Invision Community

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Реакции и скин

Опубликовано:

Как исправить отображение реакции для гостя?

2.PNG.ce6fe9e00649d3663a9bcfee5a006c42.PNG

После авторизации проблем нет:

1.PNG.c1940947b72110dc29aa7b1b66a07553.PNG

и как сделать вот так ( овал )

1053830447_.PNG.9d78dea7920738ed9ea0364486e6d26c.PNG

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

Опубликовано:
1 час назад, t_reks сказал:

Как исправить отображение реакции для гостя?

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

 

1 час назад, t_reks сказал:

и как сделать вот так ( овал )

Как-то так:

.ipsReact_reactCount {
    display: inline-block;
    border: 1px solid #6b8092;
    border-radius: 50%;
    padding: 3px;
}

 

Опубликовано:
  • Автор
/*====\\Reputation//====>*/
	.ipsReact_button,
.ipsReact_types ul,
.ipsReact_name,
body.ipsApp_noTouch .ipsReact_types:hover .ipsReact_button,
body:not( .ipsApp_noTouch ) .ipsReact_types.ipsReact_types_active .ipsReact_button {
	background: {hextorgb="react_bg" opacity="0.70"};
}
.ipsReact_reactCount {
	background: {hextorgb="light_button" opacity="0.2"};
	border-color: rgba(0,0,0,0.03);
}
.ipsReact_reactCount > span > span:last-child,
.ipsReact_reactCount > a > span:last-child {
	background: {hextorgb="light_button" opacity="0.5"};
	color: {hextorgb="light_button_font" opacity="0.90"};
}
.ipsReact_unreact {
	background: {hextorgb="light_button" opacity="0.90"};
	color: {hextorgb="light_button_font" opacity="0.90"};
}
.ipsReactOverview ul img{
	border: 2px solid {hextorgb="react_bg" opacity="0.90"};
}
.ipsReact_reactCount{
	padding-left: 5px;
}
.ipsReact_reactCount span:last-child{
	background: {theme="react_bg"};
	padding: 0 9px;
}
html[dir="ltr"] .ipsReact_types ul li {
    padding: 0 2px;
}
html[dir="ltr"] .ipsReact_blurb:not( .ipsHide ) + .ipsReact_types{
	border-left: 1px solid {theme="react_bg"};
}
html[dir="rtl"] .ipsReact_unreact{
	left: -7px;
	top: -7px;
}
html[dir="ltr"] .ipsReact_unreact{
	right: -7px;
	top: -7px;
}

куда именно вставить ваш код?

Опубликовано:

Наверное должно быть очевидно, что если используется класс:

.ipsReact_reactCount

То его и нужно найти и модифицировать.

2021-11-04_14-31-16.png

 

И необходимо обратить внимание, что если скин платныйсудя по css комментариям, все такие правки лучше вносить в custom.css, а не трогать стили "ядра" темы, для облегчения обновления в будущем, это в том случае если сделан правильно кастомный скин.

Опубликовано:
  • Автор

а как всё же решить проблему с черным фоном?

и, всё же хотелось овал, как на скрине ...

если можно ...

сейчас как-то не особо ...

1501894088_.PNG.f2659a26b8a058c4a77bcbf64a24f629.PNG

Опубликовано:

Да, нужно было задать параметр высоты - height: 25px;

Попробуйте так, ещё здесь фон теперь прозрачный задан, должно решить проблему.

.ipsReact_reactCount {
    background: transparent !important;
    display: inline-block;
    border: 1px solid #6b8092;
    border-radius: 50%;
    padding: 3px;
    height: 25px;
}
Опубликовано:
  • Автор

1293545879_.PNG.b27f63cb16cf4d03e35860c1a0d7c322.PNG

без авторизации

2.PNG.89f284ef8c73013885ae6a671be1f1c9.PNG

 

Опубликовано:

Ссылку на страницу в студию, и всё будет понятно, а то сейчас гадание на кофейной гуще.)

Опубликовано:
  • Автор

подсказали исправить строку: 

.ipsReact_reactCount span:last-child{

фон вроде стал прозрачный

осталось разобраться с бордюром

Опубликовано:

У вас сейчас так:

image.png

 

А нужно так:

image.png

 

Код:

.ipsReact_reactCount {
    background: rgba(61,61,61,0.2) !important;
    border-radius: 12.5px !important;
    border: 1px solid #6b8092 !important;
    height: 25px;
}

 

Если всё таки фон нужен прозрачный, то:

background: transparent !important;
Опубликовано:
  • Автор

Lesovsky, спасибо большое за помощь!

Всё работает ).

Создайте аккаунт или войдите в него для комментирования

Сейчас на странице 0

  • Нет пользователей, просматривающих эту страницу.

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.