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

Article 

<div class="rh-article">
    <h5 class="rh-article-title"><a class="rh-article-title-link" href="#">This is the article title<a/></h5>
	<p class="rh-article-published">Publicerad: 28 mars 2018</p>
    
	<p class="rh-article-description">This is an excerpt that is meant to convey the full article content. Read first and pick the article you want afterwards.</p>

        <span class="rh-labels">Example 1</span>
        <span class="rh-labels">Example 2</span>
        <span class="rh-labels">Example 3</span>
</div>
 
<div class="rh-article">
	<h5 class="rh-article-title"><a class="rh-article-title-link" href="#">{{title}}<a/></h5>
	<p class="rh-article-published">{{published}}</p>
    
	<p class="rh-article-description">{{description}}</p>

    {{#each labels}}
        <span class="rh-labels">{{text}}</span>
    {{/each}}
</div>
 
{
  "title": "This is the article title",
  "published": "Publicerad: 28 mars 2018",
  "description": "This is an excerpt that is meant to convey the full article content. Read first and pick the article you want afterwards.",
  "labels": [
    {
      "text": "Example 1"
    },
    {
      "text": "Example 2"
    },
    {
      "text": "Example 3"
    }
  ]
}
  • Content: 
    .rh-article {

    &-title {
        /* Typografi */
        color: $color-primary;

        &-link {
            /* Typografi */
            font-size: inherit;
            text-decoration: none;
            color: inherit;

            /* Blandat/övrigt */
            cursor: pointer;

            &:hover,
            &:active {
                /* Typografi */
                text-decoration: underline;
            }

            &:visited {
                /* Typografi */
                color: $link-visited;
            }
        }
    }

    &-published {
        /* Typografi */
        color: $grey-dark;
    }

    &-description {
        /* Typografi */
        color: $black;
    }

    ul {
        /* Visuellt */
        list-style-type: bullet;
    }
}
  • URL: /components/raw/article/_article.scss
  • Filesystem Path: components/Molecules/article/_article.scss
  • Size: 772 Bytes
  • Content: 
    {
    "name": "regionhalland/article",
    "description": "Article",
    "type": "styleguide-molecule",
    "license": "GPL-3.0",
    "authors": [
        {
            "name": "Roland Hydén",
            "email": "Roland.Hyden@Regionhalland.se"
        }
    ],
    "require": {}
}
  • URL: /components/raw/article/composer.json
  • Filesystem Path: components/Molecules/article/composer.json
  • Size: 283 Bytes

Molekylen “Article”

Versionshistorik

  • 1.0.0.20191121 Flyttat till gitrepo