mBlog dwa i pół

O stronie

Strona kontynuuje tradycje Blogu mRadnego 2 kadencji

Elementy stałe

Strona główna

Załóż konto w mBanku

Napisz do mnie

Archiwum Blogu Shurikena

Kondensat
Bosego-Einsteina

mBank

Aktualności
Forum
Logowanie
Wersja demonstracyjna
SFI
FAQ

Portale bankowo-finansowe

Bankier
Expander
PR News
Money.pl

Karty bankowe

Karty.pl
KartyBankowe.net
KartyOnline

Fundusze inwestycyjne

Bankier
Wirtualna Polska

Zmieniamy wygląd systemu mBanku 2009.06.18.

Krok po kroku jak zmienić wygląd stron systemu mBanku po wdrożeniu styli CSS, które miało miejsce 14 czerwca 2009 r. Przepis dla Firefoxa (to samo da się zrobić w Operze, ale nie używam jej, więc nie jestm w stanie dokłądnie napisać jak, natomiast nie można tego zrobić w Internet Explorerze):

Zmiany nie zostały przetestowane na wszystkich możliwych konfiguracjach, więc nie biorę odpowiedzialności za ich działanie. STOSUJESZ JE NA WŁASNE RYZYKO!

  1. Wchodzimy na stronę dodatku Stylish i instalujemy go klikając zielony przycisk Dodaj do programu Firefox, a po instalacji restartujemy przeglądarkę.
  2. Wchodzimy na stronę logowania mBanku.
  3. W prawym dolnym rogu okna jest ikona dodatku Stylish z dużą literką S. Klikamy ją, rozwija się menu, z którego wybieramy Write new style i dalej For www.mbank.com.pl. Otworzy się okno zatytułowane New style.
  4. W polu Name wpisujemy dowolną nazwę, np. mBank.
  5. W polu głównym powinien być taki kod:

    @namespace url(http://www.w3.org/1999/xhtml);

    @-moz-document domain("www.mbank.com.pl") {

    }

  6. Ściągamy plik ze stylami CSS, otwieramy go np. w notatniku i przeklejamy jego zawartość do powyższego kodu, tak aby znalazła się w nawiasach klamrowych, czyli powinno to wyglądać tak:

    @namespace url(http://www.w3.org/1999/xhtml);

    @-moz-document domain("www.mbank.com.pl") {
    div#pageHeader {display: none !important;}
    ul li.footer {background-color: #bfa !important;}
    li p.Actions {border-top: 0 !important; padding-top: 0 !important;}
    li p.Actions a {color: #555 !important;}
    li p.Actions a:hover {color: #f00 !important;}
    ul li.footer .strong, #accessControl li p, #AccountsGrid li p, #BaseDefinedTransfersList li p, #cc_CardsGrid li p, #cd_CardsGrid li p, #CustomBaskets li p, #customerDataParameters li p, #cv_CardsGrid li p, #ddListCzsk li p, #DefaultBaskets li p, #directDebitList li p, #future_operation_list li p, #historicalStatementsList li p, #if_future_operations_list li p, #ifStandingOrdersList li p, #InsurancesGrid li p, #InvestitionsGrid li p, #LoansGrid li p, #mtransfer_list li p, #notificationsDetailsGrid li p, #notificationServices li p, #PensionGrid li p, #StandingOrdersList li p, #suspended_transaction_list li p, #TanList li p, #TermDepositsGrid li p, #uw_application_form_list li p {font-weight: normal !important;}
    }

  7. Klikamy Save i gotowe - można się logować i oglądać zmiany !

A teraz wyjaśnienia, co zostaje zmienione (w kolejności instrukcji zawartych w pliku):

  • Znika biały nagłówek w górnej części strony i ciemnoniebieska linia oddzielająca go od reszty strony. W ten sposób zaoszczędzamy sporo miejsca, co jest szczególnie istotne w przypadku netbooków, które mają "niskie" ekrany.
  • Pasek z podsumowaniem zmienia kolor tła z szarego na zielone.
  • Znika szara kreska między produktem czy elementem listy a akcjami pod nimi, same akcje mają też mniejszy odstęp od góry, więc cała lista jest krótsza i zajmuje mniej miesjca - znowu ukłon dla netbooków.
  • Odsyłacze do akcji mają normalnie kolor szary, przez co nie rzucają się tak w oczy jak nazwa produktu, numer rachunku itp.
  • Te same odsyłacze po najechaniu na nie myszką robią się czerwone.
  • Last but not least - znikają wszystkie pogrubienia na listach.

Uwagi:

  • Powyższe zmiany są wprowadzane na poziomie przeglądarki.
  • Usunięcie boldów z list usuwa pogrubienia również z nagłówków list na żółtym tle. Można to rozdzielić, ale wymaga większego nakładu pracy. Natomiast nie wiem czy pogrubienia nie zostały usunięte w zbyt wielu miejscach (jak widać z powyższego kodu, jest ich w całym systemie sporo).
  • Nie jest możliwe usunięcie pogrubienia z samych tylko numerów rachunków, a pozostawienie ich nazw pogrubionych. Podobnie z kartami i innymi produktami.

    Marek Jedziniak

W serwisie prezentowane są wyłącznie prywatne stanowiska autorów poszczególnych artykułów, chyba że zaznaczono inaczej
Wykorzystanie jakichkolwiek materiałów z tej strony dozwolone za zgodą autora. W szczególności dotyczy to dziennikarzy Gazety Wyborczej ;-)
Opracowanie strony: Marek Jedziniak, mRadny