We are working on something new! Check it out here!

Stripe

The iconic Helsingborg brand stripe.
ATTENTION: Do not use the gray stripe, it's only for demonstration purpose. The default behaviour of the stripe is to inherit color from the currently active color theme.

Modifiers

  • .stripe-red - Red stripe
  • .stripe-blue - Blue stripe
  • .stripe-green - Green stripe
  • .stripe-pruple - Purple stripe
  • .has-stripe - Put this class on the parent container to get corretct padding-left for the stripe

Example

<div class="stripe">
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
</div>
<div class="stripe stripe-red">
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
</div>
<div class="stripe stripe-blue">
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
</div>
<div class="stripe stripe-green">
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
</div>
<div class="stripe stripe-purple">
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
</div>
Source file: ~/source/sass/components/stripe/_stripe.scss