BETA Hej! Denna webbplats är under utveckling. Bidra gärna med feedback!
Stilguide
Bidra

Tillbaka-navigering 

<div class="rh-label-previous">
    <span class="rh-label-previous-icon"></span>
    <p class="rh-label-previous-title">Link to previous page</p>
</div>
 
<div class="rh-label-previous">
	<span class="rh-label-previous-icon"></span>
	<p class="rh-label-previous-title">{{previousText}}</p>	
</div>
 
{
  "caption": "",
  "name": "",
  "previousText": "Link to previous page"
}
  • Content: 
    .rh-label-previous {
    /* Positionering */
    align-items: center;

    /* Box-modell/beteende */
    display: flex;

    &-icon {
        &:after {
            /* Box-modell/beteende */
            margin-right: em(10);
            padding: em(8);

            /* Visuellt */
            background: $base3;

            /* Typografi */
            color: white;
            border-radius: 50%;

            /* Typografi */
            font-family: "feather";
            font-size: $p-small;

            /* Blandat/övrigt */
            content: "\e828";

            @include medium {
                /* Typografi */
                font-size: $p-large;
            }
        }

        &--blue {
            &:after {
                /* Box-modell/beteende */
                margin-right: em(10);
                padding: em(8);

                /* Visuellt */
                background: $base1;
                border-radius: 50%;

                /* Typografi */
                color: white;
                font-family: "feather";
                font-size: $p-small;

                /* Blandat/övrigt */
                content: "\e828";

                @include medium {
                    /* Typografi */
                    font-size: $p-large;
                }
            }
        }
    }

    &-title {
        /* Box-modell/beteende */
        margin: 0;

        /* Typografi */
        color: $black;
        font-size: $p-small;

        @include medium {
            /* Typografi */
            font-size: $p-large;
        }
    }
}
  • URL: /components/raw/label-previous/_label-previous.scss
  • Filesystem Path: components/Molecules/label-previous/_label-previous.scss
  • Size: 1.6 KB
  • Content: 
    {
    "name": "regionhalland/label-previous",
    "description": "Label previous",
    "type": "styleguide-molecule",
    "license": "GPL-3.0",
    "authors": [
        {
            "name": "Roland Hydén",
            "email": "Roland.Hyden@Regionhalland.se"
        }
    ],
    "require": {}
}
  • URL: /components/raw/label-previous/composer.json
  • Filesystem Path: components/Molecules/label-previous/composer.json
  • Size: 297 Bytes

Molekylen “Label previous”

Planerad utveckling

  • Använd “button circle” och “rh-link–navigation”

Versioner

  • 1.0.0.20191121 Flyttat till gitrepo
  • 1.0.0.20191113 readme-fil skapad