Files

SmartRootsSrl 10f1b055b3 docs: add design spec for gvScostamentoPerformance grid layout improvement

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

2026-03-27 12:29:29 +01:00

3.5 KiB

Raw Blame History

Design Spec: Miglioramento visivo gvScostamentoPerformance

Data: 2026-03-27 File coinvolti: OlympiaIntranet/ScostamentoPerformance.aspx

Obiettivo

Rendere la griglia gvScostamentoPerformance visivamente gradevole e consultabile facilmente, risolvendo:

Colonne troppo schiacciate (larghezze in % su 15+ colonne visibili)
Bordo inferiore della griglia non visibile
"Create Filter" appena leggibile
Inconsistenza di tema tra il form filtri (Aqua) e la griglia (Office2010Blue)

Decisioni di design

1. Tema: Aqua uniforme

Sia ASPxFormLayout (già Aqua) che ASPxGridView (attualmente Office2010Blue) usano Theme="Aqua". Garantisce coerenza visiva e migliore contrasto per la filter bar.

2. Layout colonne: Fixed + scroll orizzontale + colonne bloccate

Tutte le larghezze colonna passano da percentuale a pixel fissi
La griglia abilita lo scroll orizzontale (HorizontalScrollBarMode="Visible")
Le prime 4 colonne (Edit, Gestore, Portafoglio, Intestazione) vengono bloccate a sinistra tramite Fixed="True", così restano visibili durante lo scroll orizzontale

3. CSS override su tema Aqua

Un blocco <style> inline nella pagina sovrascrive selettivamente il tema Aqua per avvicinarsi al mockup approvato:

Header colonne: gradiente blu Aqua con padding aumentato
Celle dati: padding: 6px 8px (vs default troppo stretto)
Bordo inferiore griglia: border-bottom: 2px solid #4a90d9
Filter bar ("Create Filter"): sfondo #e0f0fb, testo #1a6bb5, bordo #b0cfe8
Separatore visivo tra colonne bloccate e colonne scorrevoli: border-right: 2px solid #2a6fb0 sull'ultima colonna bloccata

Larghezze colonne (pixel fissi)

Colonna	Larghezza
Command (edit)	50px
Gestore	90px — bloccata
Portafoglio	90px — bloccata
Intestazione	150px — bloccata
Linea	90px
Patrimonio	110px
Data Apertura	90px
TWR Ptf	85px
TWR Linea	95px
Delta TWR	80px
Benchmark	90px
Apporti	95px
Prelievi	95px
Addebiti	95px
Commento	210px
Note	170px
Blocco	60px

Larghezza totale stimata: ~1645px — oltre la larghezza tipica di uno schermo, giustifica lo scroll orizzontale.

Modifiche al markup ASPX

ASPxGridView — attributi da modificare/aggiungere

Theme="Aqua"

(sostituisce Office2010Blue)

<Settings
    ShowFilterRow="True"
    ShowHeaderFilterButton="True"
    ShowFilterBar="Visible"
    VerticalScrollBarMode="Visible"
    VerticalScrollableHeight="750"
    HorizontalScrollBarMode="Visible" />

(aggiunge HorizontalScrollBarMode="Visible")

Colonne bloccate

Aggiungere Fixed="True" su:

GridViewCommandColumn (edit)
GridViewDataTextColumn Gestore
GridViewDataTextColumn Portafoglio
GridViewDataTextColumn Intestazione

CSS override (blocco `<style>` nella `<head>`)

/* Padding celle griglia */
.dxgvDataRow_Aqua td,
.dxgvDataRow_Aqua td.dxgvTD_Aqua {
    padding: 6px 8px !important;
}

/* Bordo inferiore griglia */
.dxgvControl_Aqua {
    border-bottom: 2px solid #4a90d9 !important;
}

/* Filter bar visibile */
.dxgvFilterBar_Aqua {
    background-color: #e0f0fb !important;
    border-top: 1px solid #b0cfe8 !important;
    color: #1a6bb5 !important;
}

/* Separatore colonne bloccate */
.dxgvFixedColumnLeftDivider_Aqua {
    border-right: 2px solid #2a6fb0 !important;
}

Fuori scope

Nessuna modifica al code-behind .aspx.cs
Nessuna modifica al datasource o alla logica di business
Nessuna modifica alle altre pagine

3.5 KiB Raw Blame History