Własny styl dla AwesomeBar w Firefox 3 @ Dziennik Yano

22 czerwca 2008, 19:08:58

Własny styl dla AwesomeBar w Firefox 3

Tzw. AwesomeBar jest chyba najbardziej kontrowersyjną zmianą w nowym Firefoksie. Niektórzy polubili go od razu, inni wprost znienawidzili i biadolą, jaki to on jest niewygodny. Pojawiło się nawet rozszerzenie, żeby przywrócić poprzedni wygląd paska adresu. Jest jednak jeszcze jedno wyjście.

Rozszerzenie oldbar

oldbar jest prostą zamianą nowego paska na stary. Samo rozszerzenie jest banalnie proste, bo tak naprawdę stary pasek nadal jest zaszyty w Firefoksie. Podejrzewam też, że po licznych protestach w kolejnej wersji będzie to osiągalne opcją w about:config.

Co się nie podoba?

Nie wiem, co tak bardzo razi użytkowników w tej funkcji, że koniecznie chcą wrócić do starego paska. Sama funkcjonalność jest bardzo pożyteczna, bo pozwala wyszukać w historii nawet te strony, których adresu nie pamiętamy.

Może więc o wygląd chodzi? Fakt, dwie linijki na każdą pozycję historii to dużo, ale idzie się przyzwyczaić. Osobiście nawet preferuję taką formę prezentacji. Natomiast tym, którym się właśnie wygląd nie podoba proponuję dodanie małego UserCSS przy pomocy rozszerzenia Stylish (i tak każdy go posiada, prawda?).

Zróbmy własny styl

Poszczególne elementy w nowym pasku opatrzone są klasą autocomplete-richlistitem. Żeby z dwóch linii zrobić jedną wystarczy skorzystać z poniższego stylu:

@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
.autocomplete-richlistitem{
  -moz-box-orient:horizontal !important;
  font-size:.9em !important
}
.autocomplete-richlistitem > hbox{
  width:35em !important;
}

Pozwoliłem sobie minimalnie zmniejszyć font, żeby uczynić pasek bardziej kompaktowym oraz dodałem szerokość, żeby tytuł i adres były w dwóch równych kolumnach. Jeśli komuś to nadal nie wystarcza, może pobawić się dalej. Sama struktura poszczególnych elementów przedstawia się następująco:

<hbox>
  <image class="ac-site-icon"/>
  <hbox class="ac-title">
    <description class="ac-normal-text ac-comment"/>
    <hbox class="ac-extra">
      <image class="ac-result-type-tag"/>
      <description class="ac-normal-text ac-comment"/>
    </hbox>
  </hbox>
  <label class="ac-ellipsis-after ac-comment"/>
  <image class="ac-type-icon"/>
</hbox>
<hbox>
  <spacer class="ac-site-icon"/>
  <hbox class="ac-url">
    <description class="ac-normal-text ac-url-text"/>
  </hbox>
  <label class="ac-ellipsis-after ac-url-text"/>
  <spacer class="ac-type-icon"/>
</hbox>

Jeśli wcześniej dodaliśmy zakładkę to w pierwszym hbox do elementu z klasą ac-type-icon dodawana jest jeszcze druga: ac-result-type-bookmark.

Tak naprawdę, to tego kodu jest więcej, ale zostawiłem tylko tyle, ile trzeba, żeby zacząć zabawę ze stylami. Cały kod może każdy posiadacz Firefoksa 3 zobaczyć u siebie.

Teraz każdy może dowolnie dopasować wygląd AwesomeBar do swoich własnych potrzeb.

Poprzedni wpis:
Ręce precz od takiego SEO! Następny wpis:
Nasza-Klasa łamie prawo?

Ostatni odwiedzający:

Komentarze do notki Własny styl dla AwesomeBar w Firefox 3

KosciaK powiedział(a):
22 czerwca 2008 o 19:19:20
Wygląd to sprawa drugorzędna. W narzekaniach chodzi właśnie o to co czyni AwesomeBar awesome (przynajmniej według twórców) – wyszukiwanie nie tylko po wpisanych ale i po zakładkach, tytułach. W pewnym sensie traci się kontrolę nad tym co się tam pojawia, wyniki są zaśmiecane dodatkowymi elementami
Krzysiek powiedział(a):
22 czerwca 2008 o 20:08:03
@KosciaK: kiedy to kwestia przestawienia się po prostu. Ja na początku za tym udogodnieniem nie przepadałem ale wrodzone lenistwo nie pozwoliło mi przywrócić starego paska i teraz nie żałuję. Po pewnym czasie zmieniasz przyzwyczajenia i nowy pasek staje się bardzo użyteczny (ile już razy dzięki niemu znalazłem stronę z której pamiętałem tylko kawałek tytułu..).
Yano powiedział(a):
22 czerwca 2008 o 20:10:43
Ot właśnie. Kwestia przyzwyczajenia. Podobnie jak ze wstęgami w nowym MS Office. W pierwszej chwili mi się spodobało, bo 5 minutach używania miałem tego dosyć. Po kolejnych kilku dniach wydaje mi się to bardziej intuicyjne niż dotychczasowe rozwiązania.
MySZ powiedział(a):
22 czerwca 2008 o 21:06:16
Ja bez awesome bara nie wyobrażam sobie teraz życia ;) zmniejszyłem tylko nieco rozmiar fonta i kolorki, poza tym śmiga i jestem zachwycony
Mr. Am/Pm powiedział(a):
22 czerwca 2008 o 21:51:08
Ile razy mam powtarzać co mi się nei podobało w nowym barze :F
YaaL powiedział(a):
22 czerwca 2008 o 22:31:53
Yano, ja do MSO2k7 próbowałam się przyzwyczaić 3 miesiące i nie dałam rady. To jest może doskonały interfejs dla początkującego użytkownika, ale zaawansowanym bardziej życie utrudnia, niż ułatwia.

A wszystkim marudzącym na Awesome Bar polecam zajrzenie w about:config i pomacanie opcji browser.urlbar.* i places.*, bo w odróżnieniu od MSO tutaj można sobie przywrócić stary interfejs.
KosciaK powiedział(a):
22 czerwca 2008 o 23:05:35
Na Lifehacker.com niedawno było trochę o zmianie działania AwesomeBara – jakieś wagi dla różnych elementów (wpisywane, historia, zakładki), chyba nawet mam na del.icio.us… o! jest: http://lifehacker.com/396603/tweak-the-awesomebars-suggestion-algorithm
Mad powiedział(a):
23 czerwca 2008 o 11:46:41
Dobra to wszystko pikus powiedzcie jak wylaczyc wyszukiwanie w ulubionych bo to mnie doprowadza do szalu!
Grzegorz powiedział(a):
25 lipca 2008 o 21:24:03
Chciałbym zobaczyć jakieś zrzuty ekrany z paskiem po modyfikacjach.

Chciałbym porównać używany/wyprodukowanych przeze mnie styl z proponowanymi ustawień dla Awesomebara w Firefox 3
gshegosh powiedział(a):
14 sierpnia 2008 o 14:58:14
Bardzo fajnie to teraz wygląda, dzięki!

Zostaw komentarz

Komentarze nie mające związku z tematem wpisu mogą (ale nie muszą) zostać usunięte. Bezwzględnie będą usuwane komentarze obraźliwe, wulgarne czy reklamowe (także w stylu onet.blog).

W komentarzach możesz korzystać z Textile.

yano78@jabber.org

22 czerwca 2008, 19:08:58