Topic: problema linea bordo nel campo di ricerca della libreria e download

[Schwanz]

dalla versione 141, nella finestra di libreria e download, quando clicco sul campo di ricerca, la linea di bordo mi evidenzia in nero anzichè blu, ho ricevuto il primo codice da Aris e ho sistemato il valore della dimensione del campo a 270px, poi ho creato il secondo codice, e ho notato che la linea di bordo blu è nascosto dietro e quindi nel secondo codice me ne appaiono due, come posso posso mettere all'interno il campo anteriore nel campo posteriore? oppure come ripristinare per ottenere la linea blu la stessa in altri campi come quello di waterfox?

PRIMO CODICE

Codice: [Seleziona]

#searchFilter {
border: 3px solid #698ab7 !important;
min-width: 270px !important;
width: 270px !important;
max-width: 270px !important;
}
SECONDO CODICE

Codice: [Seleziona]

#searchFilter {
border: 3px solid #698ab7 !important;
min-width: 400px !important;
width: 400px !important;
max-width: 400px !important;
margin-top: 0px !important;
margin-bottom: 0px !important;
padding-top: 10px !important;
padding-bottom: 10px !important;
}

OUTLINE BORDO NERO


DUE SEARCHFILTER


SEARCHFILTER WATERFOX



questo è codice di tutta la finestra di libreria

Codice: [Seleziona]

/* COLORE DI SFONDO DELLA LIBRERIA - CRONOLOGIA E DOWNLOAD (VISUALIZZA LA CRONOLOGIA) */
/* Searchbox */
#searchFilter {
  background-color: #f0f0f4 !important;
  background-image: #f0f0f4 !important;
  box-shadow: #fdfdff !important;
  border-top-color: transparent !important;
  color: #000 !important;
 }
}
/* Searchbox Focus */
#searchFilter[focused] {
  box-shadow: #f0f0f4 !important;
  background-color: #f0f0f4 !important;
  color: #000 !important;
}

/* All List Colors */
#placesView,
#placesView .scrollbox-innerbox,
#infoPane, #placesList, #font, #placeContent {
  -moz-appearance: none !important;
  background-color: #fafafa !important;
  color: #000 !important;
  opacity: 100% !important;
}

/* cronologia (Searchbox) */
#searchFilter {
  -moz-appearance: none !important;
  background-color: #fdfdff !important;
  border: 1px dotted var(--bordercolor) !important;
  color: #000 !important;
  opacity: 100% !important;
  font-size: 11.5pt !important;
  margin-top: 1px !important;
  margin-bottom: 20px !important;
  margin-left: 25px !important;
  margin-right: 0px !important;
  height: 9px !important;
}

/* download (Searchbox Focus) */
#searchFilter[focused] {
  box-shadow: var(--input-field-focus-shadow) !important;
  background-color: #fdfdff !important;
  border: 1px dotted var(--bordercolor) !important;
  color: #000 !important;
  font-size: 11.5pt !important;
  padding: 4px !important;
}

/* spessore altezza barra strumenti (toolbar spacer) */
#libraryToolbarSpacer {
  max-width: 700px !important;
  padding: 14px !important;
  margin-right: 15px !important;
  margin-left: 4px !important;
  opacity: 100% !important;
}

/* dimensione pulsanti avanti e indietro (forward and back buttons) */
#placesToolbar > #back-button > .toolbarbutton-icon,
#placesToolbar > #forward-button > .toolbarbutton-icon {
  fill: var(--iconcolor) !important;
  width: 17px !important;
  height: 17px !important;
  opacity: 100% !important;
}

/* dimensione testo barra strumenti (toolbar text) */
#placesMenu > menu > .menubar-text {
  color: #000 !important;
  font-size: 10pt !important; }

[Schwanz]

sono riuscito a rimuovere l'outline quando non viene cliccato, e il bordo è correttamente all'interno quando ci clicco, manca da far colorare in blu, ho scritto outline-color: #5d80b0 !important;, ma non va. il bordo interno lo vorrei quadrato e non ad angoli smussati

Codice: [Seleziona]

#search-box,
#searchFilter,
input:not(#urlbar-input){
-moz-appearance:none !important;
border: 1px #698ab7 !important;
outline-color: #5d80b0 !important;
min-width: 270px !important;
width: 270px !important;
max-width: 270px !important;
}

[Schwanz]

su waterfox il blu chiaro è #5d80b0
su firefox il blu scuro è #0060df

[Schwanz]

ho trovato il modo di colorare il bordo blu aggiungendo il focus, ma c'è un problema che fa comparire il bordo nella finestra di salva file, come lo rimuovo da quella finestra?

/* focus bordo linea blu searchbox */
#search-box,
#searchFilter,
input:not(#urlbar-input){
-moz-appearance:none !important;
border: 1px #698ab7 !important;
outline-color: solid #698ab7 !important;
border-radius: inherit !important;
min-height: 27px !important;
margin-right: 7px !important;  }
}
:focus {
    outline: 1.6pt solid #0060df; }

[Schwanz]

con questo codice, non fa apparire i pulsanti di stampa che vedete nella parte evidenziata, come posso farlo visualizzare senza intasare la barra di ricerca? il problema è queste due funzioni evdenziati in grassetto. tutto questo codice è lo stesso stile e comportamento della barra ricerca su waterfox e firefox 56.0.2

/* focus bordo linea blu searchbox */
#search-box,
#searchFilter,
input:not(#urlbar-input){
-moz-appearance:none !important;
border: 1px #698ab7 !important;
outline-color: solid #698ab7 !important;
border-radius: inherit !important;
min-height: 27px !important;
margin-right: 7px !important;  }

[Schwanz]

risolto. bisognava togliere questa riga in rosso, però il colore del bordo non va ancora.

/* focus bordo linea blu searchbox */
#search-box,
#searchFilter,
input:not(#urlbar-input){
-moz-appearance:none !important;
border: 1px #698ab7 !important;
outline-color: solid #698ab7 !important;
border-radius: inherit !important;
min-height: 27px !important;
margin-right: 7px !important;  }

[Schwanz]

ora rimettendo il comando di focus, ottengo la linea blu, ma come vedete, c'è una differenza con waterfox, mi colora la parte bordata bianca sottile anzichè quella del grigio scuro che corrisponde al ciano di waterfox, quindi come posso fare in modo di colorare quella parte grigia e non da quel sottile bianco?

/* focus bordo linea blu searchbox */
#search-box,
#searchFilter,
input:not(#urlbar-input){
   -moz-appearance:none !important;
border: 1px #698ab7 !important;
outline-color: solid #698ab7 !important;
border-radius: inherit !important;
min-height: 27px !important;
margin-right: 7px !important;  }
:focus {
    outline: 0.6pt solid #0060df; }