Benvenuto, Ospite

ARGOMENTO: tutorial formattazione qweb

tutorial formattazione qweb 1 Anno 9 Mesi fa #28027

ndrini
Offline
Gold Boarder
Messaggi: 291
Ringraziamenti ricevuti 22
Karma: 0

Antoniov ha scritto:

Credo che tu ti stia scontrando con la formattazione web piuttosto che con Odoo.
Ci sono generazioni di sviluppatori e grafici, vittime di questo problema,

Detto questo, nell'ultimo esempio vuoi colorare il fondo di un elemento non concreto.
Mi spiego meglio: sia le tag

<div>  <span>

non sono elementi della videata ma sono raggruppamenti.

Tutti gli elementi all'interno di queste tag ereditano le caratteristiche, ad esempio il colore.
Nel tuo caso hai dichiarato il colore fondo in span ma all'interno di span non esiste nessun elemento tipo

table tr td

che possano ricevere l'attributo di colore

Per capire qualcosa di più leggi le varie guide su html5 e css, w3cschool ha un bellissimo sito, ci passi intere giornate.

Capisco.
Il tutto si complica dal fatto fatto che di mezzo c'è bootstrap.
librosweb.es/libro/bootstrap_3/capitulo_6/paneles.html

Ho capito che un panel, in bootstrap, ha 3 zone
titolo
corpo
piè

con una struttura del tipo

       <div class="row">
                        <div class="col-xs-6">
                            <div class="panel panel-danger">
                              <div class="panel-heading" style="background-color: #e9ecee; ">Titolo</div>  
                              <div class="panel-body">
                                Contenido del panel
                              </div>
                              <div class="panel-footer">Pie del panel</div>
                            </div>
                        </div>

Se inserisco dentro il div del titolo, mi colora tutto lo sfondo, come desideravo.
<div class="panel-heading" style="background-color: #e9ecee; ">Titolo</div>

Andrea

L\'Amministratore ha disattivato l\'accesso in scrittura al pubblico.

tutorial formattazione qweb 1 Anno 9 Mesi fa #28028

Antoniov Online Administrator Messaggi: 1555 Ringraziamenti ricevuti 283 Karma: -115	Corretto. Lo stesso vale per il tag span che è specifico di un solo elemento mentre il tag div dovrebbe essere usato per raggruppare più elementi Seguendo le guide è sconsigliato inserire attributi grafici nelle tag perchè rende il codice illeggibile e difficile da aggiornare
	Questo indirizzo email è protetto dagli spambots. È necessario abilitare JavaScript per vederlo. - Presidente eletto dell'associazione Questo indirizzo email è protetto dagli spambots. È necessario abilitare JavaScript per vederlo. L\'Amministratore ha disattivato l\'accesso in scrittura al pubblico.

tutorial formattazione qweb 1 Anno 9 Mesi fa #28029

ndrini
Offline
Gold Boarder
Messaggi: 291
Ringraziamenti ricevuti 22
Karma: 0

Antoniov ha scritto:

Corretto.
Lo stesso vale per il tag span che è specifico di un solo elemento mentre il tag div dovrebbe essere usato per raggruppare più elementi

Seguendo le guide è sconsigliato inserire attributi grafici nelle tag perchè rende il codice illeggibile e difficile da aggiornare

Effettivamente.
Ho provato a definire un css interno al foglio html/qweb, ma alcune classi le applica, ed alcune no...
Ad esempio:
h1 no, mentre h4 sì, (credo che sia perchè h1 è giá definito da bootstrap e non prevale il mio)

        <template id="report.style" name="style">
            <style type="text/css"> 
                h1 { color: #003300;
                }
                h4 { color: #A5D228;
                }
                .bg_green {
                    color:#ffffff; 
                    background-color: #a5d228;
                }
                .bg_gray {
                    background-color: #e9ecee; 
                    color:#003300;
                }
                .bg_groy {
                    background-color: #6495ED; 
                    color:orange;
                }
            </style> 
        </template>

L\'Amministratore ha disattivato l\'accesso in scrittura al pubblico.

tutorial formattazione qweb 1 Anno 9 Mesi fa #28031

Antoniov
Online
Administrator
Messaggi: 1555
Ringraziamenti ricevuti 283
Karma: -115

La strada corretta è questa con la dichiarazione dello stile. Un domani, cambiando poche righe puoi facilmente cambiare la pagina web.
Puoi incontrare qualche problema in caso di conflitti. Da questo puntodi vista lo standard è carente, non specifica come risolvere questi conflitti.
Di norma la dichiazione di stile all'interno della pagina html (nell'header) ha prevalenza sul foglio di stile e questa è una regola definita dallo standard.
Devi capire come fa passare la dichiarazione nel template dentro l'header del foglio html.

Un'altra strada potrebbe essere creare una classe (css no python) a assegnare al tag h1 la classe ma è una soluzione meno pulita e può dare problemi se dimentichi di dichiarare la classe.

Questo indirizzo email è protetto dagli spambots. È necessario abilitare JavaScript per vederlo. - Presidente eletto dell'associazione
Questo indirizzo email è protetto dagli spambots. È necessario abilitare JavaScript per vederlo.

L\'Amministratore ha disattivato l\'accesso in scrittura al pubblico.

tutorial formattazione qweb 1 Anno 9 Mesi fa #28036

gigidn
Offline
Platinum Boarder
Messaggi: 1925
Ringraziamenti ricevuti 446
Karma: 22

La strada piu' semplice è quella di definire lo stile all'interno del template nella varie sezioni,

<header>
<style>
</style>
quello che vuoi
</header>

<page>
<style>
</style>
quello che vuoi
</page>

Mettendolo direttamente dento la sezione sarà l'ultimo definito e quello che verrà caricato.

Se questo diventa macchinoso perchè legato a molti report e dovrai ripeterlo non ti resta che estendere il css di odoo ..

    <template inherit_id="report.assets_common" id="mio_css">
        <xpath expr="." position="inside">
		    <link href="/mio_modulo/static/style.css" rel="stylesheet" type="text/css"  />
		</xpath>
	</template>

@KTec
www.ktec.it

L\'Amministratore ha disattivato l\'accesso in scrittura al pubblico.

Forum

Avvisi, Associazione e Nuove Iscrizioni

Eventi (... ex Pianificazione Attività)

tutorial formattazione qweb