diff --git a/src/components/catalog/CatalogModernView.tsx b/src/components/catalog/CatalogModernView.tsx index ec19b70..95368b0 100644 --- a/src/components/catalog/CatalogModernView.tsx +++ b/src/components/catalog/CatalogModernView.tsx @@ -111,7 +111,7 @@ const CatalogModernViewInner: FC<{}> = () => className={ `flex items-center gap-2 mx-1 px-1.5 py-1.5 rounded cursor-pointer transition-all duration-150 ${ showFavorites ? 'bg-primary text-white' : 'hover:bg-card-grid-item-active' }` } onClick={ () => setShowFavorites(!showFavorites) } > -
+
0 ? 'text-danger' : 'text-muted' }` } /> { totalFavs > 0 && @@ -163,7 +163,7 @@ const CatalogModernViewInner: FC<{}> = () => activateNode(child); } } > -
+
{ isHidden && }
diff --git a/src/components/catalog/views/catalog-icon/CatalogIconView.tsx b/src/components/catalog/views/catalog-icon/CatalogIconView.tsx index 0178662..4e5ed5a 100644 --- a/src/components/catalog/views/catalog-icon/CatalogIconView.tsx +++ b/src/components/catalog/views/catalog-icon/CatalogIconView.tsx @@ -1,20 +1,20 @@ import { FC, useMemo } from 'react'; import { GetConfigurationValue } from '../../../../api'; -import { LayoutImage } from '../../../../common'; export interface CatalogIconViewProps { icon: number; + className?: string; } export const CatalogIconView: FC = props => { - const { icon = 0 } = props; + const { icon = 0, className = '' } = props; - const getIconUrl = useMemo(() => + const iconUrl = useMemo(() => { return ((GetConfigurationValue('catalog.asset.icon.url')).replace('%name%', icon.toString())); }, [ icon ]); - return ; + return ; }; diff --git a/src/components/catalog/views/catalog-rail/CatalogRailItemView.tsx b/src/components/catalog/views/catalog-rail/CatalogRailItemView.tsx index 3b1cd21..4d1e38e 100644 --- a/src/components/catalog/views/catalog-rail/CatalogRailItemView.tsx +++ b/src/components/catalog/views/catalog-rail/CatalogRailItemView.tsx @@ -19,8 +19,8 @@ export const CatalogRailItemView: FC = props => title={ node.localization } onClick={ onClick } > -
- +
+
{ node.localization } diff --git a/src/components/catalog/views/favorites/CatalogFavoritesView.tsx b/src/components/catalog/views/favorites/CatalogFavoritesView.tsx index 676f771..77b02e6 100644 --- a/src/components/catalog/views/favorites/CatalogFavoritesView.tsx +++ b/src/components/catalog/views/favorites/CatalogFavoritesView.tsx @@ -121,7 +121,7 @@ export const CatalogFavoritesView: FC = props => onClick={ () => { openPageByOfferId(fav.offerId); onClose(); } } > { /* Furni icon */ } -
+
{ fav.iconUrl ? : fav.nodeIconId !== null diff --git a/src/components/catalog/views/navigation/CatalogNavigationItemView.tsx b/src/components/catalog/views/navigation/CatalogNavigationItemView.tsx index d31d801..f897cad 100644 --- a/src/components/catalog/views/navigation/CatalogNavigationItemView.tsx +++ b/src/components/catalog/views/navigation/CatalogNavigationItemView.tsx @@ -86,7 +86,7 @@ export const CatalogNavigationItemView: FC = pro > { adminMode && } -
+
{ node.localization } diff --git a/src/css/index.css b/src/css/index.css index fbfc8a4..709acdb 100644 --- a/src/css/index.css +++ b/src/css/index.css @@ -30,51 +30,45 @@ body { } ::-webkit-scrollbar { - width: .5rem + width: .625rem; } ::-webkit-scrollbar:horizontal { - height: .5rem + height: .625rem; } ::-webkit-scrollbar:not(:horizontal) { - width: .5rem + width: .625rem; } -::-webkit-scrollbar-track:horizontal { - border-bottom: .25rem solid rgba(0, 0, 0, .1) +::-webkit-scrollbar-track { + background: rgba(0, 0, 0, .08); + border-radius: .5rem; } -::-webkit-scrollbar-track:not(:horizontal) { - border-right: .25rem solid rgba(0, 0, 0, .1) +::-webkit-scrollbar-thumb { + background: rgba(30, 114, 149, .35); + border-radius: .5rem; + border: 2px solid transparent; + background-clip: padding-box; } -::-webkit-scrollbar-thumb:horizontal { - border-bottom: .25rem solid rgba(30, 114, 149, .4) +::-webkit-scrollbar-thumb:hover { + background: rgba(30, 114, 149, .6); + border-radius: .5rem; + border: 2px solid transparent; + background-clip: padding-box; } -::-webkit-scrollbar-thumb:horizontal:hover { - border-bottom: .25rem solid rgba(30, 114, 149, .8) -} - -::-webkit-scrollbar-thumb:horizontal:active { - border-bottom: .25rem solid #185D79 -} - -::-webkit-scrollbar-thumb:not(:horizontal) { - border-right: .25rem solid rgba(30, 114, 149, .4) -} - -::-webkit-scrollbar-thumb:not(:horizontal):hover { - border-right: .25rem solid rgba(30, 114, 149, .8) -} - -::-webkit-scrollbar-thumb:not(:horizontal):active { - border-right: .25rem solid #185D79 +::-webkit-scrollbar-thumb:active { + background: #185D79; + border-radius: .5rem; + border: 2px solid transparent; + background-clip: padding-box; } ::-webkit-scrollbar-corner { - background: rgba(0, 0, 0, .1) + background: rgba(0, 0, 0, .08); } @layer components {