mirror of
https://github.com/duckietm/Nitro-V3.git
synced 2026-06-19 23:16:21 +00:00
fix(client): catalogo mobile, BC/navigator/profilo/amici
- Catalogo Hippiehotel responsive su mobile (finestra 96vw/72vh, rail
tappabile, sotto-pannelli ristretti); duckie ripristinato come entita
separata (revert modifiche scrollbar sul suo CSS)
- BC e catalogo normale seguono entrambi il toggle tema; il duckie non
duplica piu il logo nelle pagine info_duckets
- Navigator: highlight della tab segue currentTabCode (era bloccato su
Pubblici mentre il contenuto cambiava)
- Inventario: link inventory/show/<tab> per deep-link a una scheda
- User Profile: avatar visibile e allineato a bg/stand, finestra piu
grande, bordi puliti, Created/Last login mostrano il valore, bottoni
Change Looks/Rooms/Change Badges/Add friends/Achievement funzionanti
- Amici: header non piu sovradimensionati e teste avatar inquadrate
(regole flat: quelle annidate .nitro-friends{&...} non si applicavano)
This commit is contained in:
@@ -142,10 +142,6 @@
|
||||
border-radius: 4px;
|
||||
background: var(--cat-panel);
|
||||
overflow: auto;
|
||||
/* Reserve the scrollbar space at all times (both edges) so the rows and
|
||||
the active highlight stay centered/consistent whether or not the list
|
||||
overflows into a scrollbar (e.g. many sub-pages). */
|
||||
scrollbar-gutter: stable both-edges;
|
||||
}
|
||||
|
||||
.nitro-catalog-classic-navigation-list {
|
||||
|
||||
@@ -176,9 +176,15 @@
|
||||
border: 0 !important;
|
||||
}
|
||||
|
||||
& .nitro-card-accordion-set-header span {
|
||||
font-size: 12px;
|
||||
/* The header title is rendered by the shared <Text> component, which is a
|
||||
<div> (not a <span>) — so target the div too, otherwise it keeps the app
|
||||
default size and shows as oversized "testoni". */
|
||||
& .nitro-card-accordion-set-header span,
|
||||
& .nitro-card-accordion-set-header > div {
|
||||
font-size: 12px !important;
|
||||
font-weight: 700;
|
||||
color: #111 !important;
|
||||
line-height: 1.1;
|
||||
}
|
||||
|
||||
& .nitro-card-accordion-set-header .fa-icon {
|
||||
@@ -800,3 +806,43 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* ------------------------------------------------------------------ *
|
||||
* Flat (non-nested) overrides. The rules above live inside a nested
|
||||
* `.nitro-friends { & ... }` block; these are written flat so they
|
||||
* apply reliably and win by source order. They fix two things the
|
||||
* nested rules didn't: the oversized/overflowing friend-list heads and
|
||||
* the oversized accordion section titles ("testoni").
|
||||
* ------------------------------------------------------------------ */
|
||||
|
||||
/* Friend-list avatar: clip a small box and centre the head, same proven
|
||||
recipe as the messenger head. `inset: auto` cancels the component's
|
||||
`inset-0`, otherwise the 130px head fills the row and overflows. */
|
||||
.nitro-friends .friends-list-avatar {
|
||||
position: relative !important;
|
||||
width: 34px;
|
||||
height: 36px;
|
||||
flex-shrink: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.nitro-friends .friends-list-avatar .avatar-image {
|
||||
position: absolute !important;
|
||||
inset: auto !important;
|
||||
left: 50% !important;
|
||||
top: 56% !important;
|
||||
width: 54px !important;
|
||||
height: 54px !important;
|
||||
margin: 0 !important;
|
||||
background-position: center center !important;
|
||||
transform: translate(-50%, -50%) scale(.95) !important;
|
||||
}
|
||||
|
||||
/* Accordion section titles are rendered by <Text> (a <div>, not a <span>),
|
||||
so size the div too — otherwise they show oversized. */
|
||||
.nitro-friends .nitro-card-accordion-set-header > div,
|
||||
.nitro-friends .nitro-card-accordion-set-header span {
|
||||
font-size: 12px !important;
|
||||
font-weight: 700 !important;
|
||||
line-height: 1.15 !important;
|
||||
}
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
.nitro-extended-profile-window {
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
|
||||
.nitro-extended-profile-window .nitro-card-header-shell {
|
||||
min-height: 34px;
|
||||
max-height: 34px;
|
||||
@@ -46,32 +42,31 @@
|
||||
|
||||
.nitro-extended-profile__identity {
|
||||
display: grid;
|
||||
grid-template-columns: 56px minmax(0, 1fr);
|
||||
gap: 8px;
|
||||
grid-template-columns: 68px minmax(0, 1fr);
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
/* Mirror the room infostand exactly: a 68x135 flex column (= profile-background)
|
||||
that centres the avatar horizontally and clips it; the stand/overlay sit on
|
||||
top as absolute layers. The avatar keeps its component default classes
|
||||
(relative w-[90px] h-[130px] left-[-2px]) so it lines up with bg + stand and
|
||||
isn't crooked. Do NOT absolutely position or force width/height on it. */
|
||||
.nitro-extended-profile__avatar-shell {
|
||||
width: 56px;
|
||||
height: 113px;
|
||||
width: 68px;
|
||||
height: 135px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.nitro-extended-profile__avatar-stand,
|
||||
.nitro-extended-profile__avatar-overlay {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
}
|
||||
|
||||
.nitro-extended-profile__avatar-image {
|
||||
position: absolute !important;
|
||||
left: 50% !important;
|
||||
bottom: -4px;
|
||||
transform: translateX(-50%);
|
||||
width: auto !important;
|
||||
height: auto !important;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.nitro-extended-profile__identity-copy {
|
||||
@@ -253,14 +248,27 @@
|
||||
|
||||
.nitro-extended-profile__relationship-head {
|
||||
position: absolute;
|
||||
right: -2px;
|
||||
right: 3px;
|
||||
top: 50%;
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
width: 30px;
|
||||
height: 32px;
|
||||
transform: translateY(-50%);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* Same proven recipe as the messenger head: clip a small box and centre a
|
||||
54x54 avatar in it. `inset: auto` cancels the component's `inset-0` so the
|
||||
width/position take effect (otherwise the head overflows huge). */
|
||||
.nitro-extended-profile__relationship-head .avatar-image {
|
||||
position: absolute !important;
|
||||
inset: auto !important;
|
||||
left: 50% !important;
|
||||
top: 54% !important;
|
||||
width: 50px !important;
|
||||
height: 50px !important;
|
||||
margin: 0 !important;
|
||||
background-position: center center !important;
|
||||
transform: translate(-50%, -50%) scale(.95) !important;
|
||||
}
|
||||
|
||||
.nitro-extended-profile__relationship-subcopy {
|
||||
|
||||
Reference in New Issue
Block a user