E-tjänster - Styleguide

Innehållsförteckning över exempelsidor, komponenter och funktioner.

Syftet med prototypen är att tillhandahålla utvecklarhjälp i form av konkreta exempel på hur moduler och funktioner ska byggas för e-tjänster inom Stockholms stad. Prototypen är baserad på Twitter Bootstrap.

Dokumentation

Länklista till intern och extern dokumentation


Generellt

  • Bootstrapkomponenter

    Översikt över alla tillgängliga Bootstrapkomponenter i Stockholm stads E-tjänster.

  • Ikoner

    Alla tillgängliga ikoner i Stadens E-tjänster.

  • Startsida

    Exempel på hur en generell startsida kan se ut.

  • Cookie

    Sida med cookie disclaimer.

  • Utilityklasser

    Dokumentation för samtliga tillgängliga utilityklasser.

  • Global laddningsikon

    Laddningsikon som visas när AJAX-requests tar över 500ms. T.ex. när filtreringen laddar ny data.

  • Lokal laddningsikon

    Laddningsikon som visas när AJAX-requests tar över 500ms. Begränsad till en mindre del av siten (panel) som laddas om. T.ex. när ett formulär postas.

Felsidor & underhåll

  • Underhållssida

    Sida som visas när E-tjänsten ligger nere p.g.a. underhåll eller avbrott.

  • 400

    Felsida för Error 400.

  • 401

    Felsida för Error 401.

  • 403

    Felsida för Error 403.

  • 404

    Felsida för Error 404.

  • 408

    Felsida för Error 408.

  • 500

    Felsida för Error 500.

Systemmeddelanden


Wizard med formulärsvalidering

  • Wizard Steg 1

    Steg 1 i en Wizard, formulär med validering på obligatoriska fält, e-post, personnumer och matchande lösenord.

  • Wizard Steg 2

    Steg 2 i en Wizard, formulär med validering på siffror.

  • Wizard Steg 3

    Steg 3 i en Wizard, formulär med validering på obligatoriska fält.

Filtering & stadsdelsväljare

Kartor


Övriga sidor


Mina sidor