Joomla.it Forum

Joomla! 3 => I Template di Joomla! 3 => : $Red 14 Sep 2013, 20:38:06

: Gantry e BT Login in posizione drawer
: $Red 14 Sep 2013, 20:38:06

ciao a tutti, sono un pò di mesi che vorrei spostare il modulo BT Login nella posizione drawer di gantry che è la stessa che utilizzo per il menu, e impostando opzione di allineamento del modulo a destra si allinea perfettamente, la cosa brutta è che giustamente si crea uno spazio superiore al modulo che lo distanzia e la posizione drawer diventa troppo alta e brutta da vedere, ho provato ad aggiungere qualche linea di codice su gantry-custom.css ma sicuramente errata  :-[ , ora lascio il modulo in quella posizione cosi potete vederlo qui (http://redwebsite.altervista.org), e allego uno screen, spero in un vostro aiuto grazie mille a tutti come sempre  :)

 

(http://oi41.tinypic.com/23sair8.jpg)

: Re:Gantry e BT Login in posizione drawer
: xplosion 14 Sep 2013, 21:28:06

Nel file CSS del tuo template aggiungi questa istruzione:

:

.gf-menu:after {
    clear: none!important;}

: Re:Gantry e BT Login in posizione drawer
: $Red 14 Sep 2013, 21:58:23

ciao xplosion e grazie, in effetti funziona ma smette di funzionare il menu  :-\

: Re:Gantry e BT Login in posizione drawer
: xplosion 14 Sep 2013, 22:06:43

A questo punto temo che c'è qualche conflitto mootools, jQuery...

: Re:Gantry e BT Login in posizione drawer
: $Red 15 Sep 2013, 13:55:56

ho capito, e magari inserendo la dinstanza in pixel?

: Re:Gantry e BT Login in posizione drawer
: Dieda12 16 Sep 2013, 09:57:57

Ottieni l'allineamento (se ho capito bene quello che vorresti) settando la larghezza del modulo menu e dandogli float:left, poi settando la larghezza del modulo login e dandogli float:right.
Al momento i due moduli sono larghi entrambi 100% e quindi possono solo disporsi uno sotto l'altro.

Una prima prova potrebbe essere

http://redwebsite.altervista.org/templates/gantry/css/gantry-custom.css (http://redwebsite.altervista.org/templates/gantry/css/gantry-custom.css) (riga 20):

:

#rt-drawer .rt-grid-12 .rt-block {    float: left;    margin: 0;    padding: 0;    width: 300px;}
http://redwebsite.altervista.org/modules/mod_bt_login/tmpl/css/style2.0.css (http://redwebsite.altervista.org/modules/mod_bt_login/tmpl/css/style2.0.css) (riga 49):

:

#btl {      position: relative;   float: right;   width: 200px;}Userei gli em invece dei px e darei dei margin-top per allineare in verticale.

: Re:Gantry e BT Login in posizione drawer
: $Red 16 Sep 2013, 13:51:31

ciao grazie mille Dieda12 per l'aiuto, in effetti sono 2 giorni che provo con le righe di codice che hai postato, e con quella della posizone drawer configurandola cosi:

:

#rt-drawer .rt-grid-12 .rt-block {margin: 5; padding: 0px 0px; height: 30px}piu o meno ottengo il risultato che vorrei anche se non completamente, il problema è che il menu torna a funzionare ma non correttamente, cioè nel momento che cerco di spostare il mouse verso le voce secondarie si richiudono

: Re:Gantry e BT Login in posizione drawer
: Dieda12 16 Sep 2013, 14:04:43

 :)

Puoi fare le modifiche css in modo da vedere il risultato che più o meno vorresti, e il problema conseguente sulle voci di menu ?

: Re:Gantry e BT Login in posizione drawer
: $Red 16 Sep 2013, 15:20:48

scusami ci ho messo un pò ha replicare il risultato che avevo ottenuto ieri non mi ricordavo il codice e non lo avevo salvato  ;D , ora l'ho inserito e come puoi vedere il drawer diventa piu basso ma purtroppo il menu non funziona correttamente, lo puoi vedere provando ad andare ad una delle voci di menu sotto la voce joomla, il codice inserito su gantry-custom.css è questo

:

    #rt-drawer .rt-container .rt-grid-12 .rt-block {
    margin: 0;
    padding: 0;
    height: 30px;! Important}se provo ad inserire meno di 30px di height il menu non funziona proprio piu

: Re:Gantry e BT Login in posizione drawer
: Dieda12 16 Sep 2013, 15:51:11

Scusa, sempre come prova, puoi mettere anche il codice .css che ti suggerivo?
Se lo applico via Firebug la reattività del menu migliora, anche se il risultato rimane un po' erratico (ho un problema simile in un sito che sto sviluppando).

: Re:Gantry e BT Login in posizione drawer
: $Red 16 Sep 2013, 18:08:41

certamente, vuoi che inserisco anche quello #btl o che sostituisco il drawer con quello che hai postato tu? però se su quello drawer inserisco float left si sposta a sinistra anche il modulo bt-login, anche se lo imposto a destra nella sua configurazione

: Re:Gantry e BT Login in posizione drawer
: Dieda12 17 Sep 2013, 09:07:46

Scusa, ieri non sono riuscita a riguardarci.

Per me è solo un problema di sovrapposizione di div, che ti vanno a "limare" l'area sensibile per l'hover, rendendo non cliccabili le voci di menu.

Devi separare le due div (menu e login) in modo che abbiano una larghezza che non si sovrapponga e un float opposto. Anche la barra che contiene il tutto va dimensionata in altezza in modo che la ul non debordi, se no ti ritrovi con lo stesso problema (occhio che ci sono elementi diversi che hanno la stessa classe assegnata, ma ne hanno anche altre, quindi bisogna assegnare le regole al giusto blocco di classi).

Esempio "farlocco" fatto velocemente su Firebug:

-http://redwebsite.altervista.org/templates/gantry/css/gantry-custom.css (riga 20):

:

#rt-drawer .rt-container .rt-grid-12 .rt-block {   
float: right;   
margin: 0;   
padding: 0;   
width: 300px;
height:50px;
}

Così non va bene perchè puntiamo entrambe i moduli, che hanno classe .rt-block, però otteniamo anche che si separino senza sovrapporsi (entrambe width: 300px e float:right, cioè uno dopo l'altro sulla destra). Vedi che le voci di menu sono tutte perfettamente cliccabili, anche nelle sottopagine.

Devi cercare il modo di puntare ai due elementi separatamente nel .css, dare una larghezza prefissata e una distanza nel posizionamento (float right e left), aggiustare di conseguenza l'altezza dell'elemento contenitore. Dovrebbe funzionare.

Elena

: Re:Gantry e BT Login in posizione drawer
: $Red 17 Sep 2013, 12:10:46

buon giorno e grazie mille ancora per l'aiuto che mi stai dando, allora con il tuo codice a parte width: che sposta comunque il modulo login un pò a sinistra ma è facilmente risolvibile impostando width: 100%; il drawer a 50 px rimane comunque troppo alto, una soluzione che sembra abbastanza accettabile l'ho trovata inserendo il padding-bottom: 0% non è proprio il massimo ma rispetto a come viene senza inserire css personalizzato potrebbe essere passabile, anche io da inesperto avevo pensato a un problema di div ma sinceramente non so dove e quali modifiche effettuare e comunque penso rimarrebbe il problema di rifarle ad ogni aggiornamento, la cosa buona sarebbe avere 2 posizioni sulla stessa riga drawer come ci sono nelle altre, infatti per ora sto pensando di spostare menu e login in posizione Top A  e Top B. Allego lo screen del risultato del tuo codice, non avevo ancora inserito width: 100%;

(http://i42.tinypic.com/nyv09g.jpg)

Edit: li ho spostati nella posizione showcase a e b perche impostandoli sopra il logo non c'è linea di demarcazione che li divide da quelli inferiori, ma sopratutto il menu si accavalla al logo e non funziona correttamente, messi nelle posizioni showcase e impostando lo stile del modulo bt-login in basic l'altezza diminuisce, non è proprio il massimo ma non è male, puoi vedere il risultato
 (http://redwebsite.altervista.org/)