<a class="c-promo" href="https://grabaperch.com/?ref=24w01">
    <img class="c-promo__image" src="/assets/images/logo-perch.png" alt="Perch - A really little CMS" width="152" height="64" />
    <p class="c-promo__message">The easiest way to publish <strong>fast, flexible HTML5 websites</strong> your clients will love.</p>
    <p class="c-promo__url">grabaperch.com</p>
</a>
<a class="c-promo" href="{{ href }}">
  <img class="c-promo__image" src="{{ img.src }}" alt="{{ img.alt }}" width="152" height="64"/>
  <p class="c-promo__message">{{ message | markdownInline }}</p>
  <p class="c-promo__url">{{ url }}</p>
</a>
{
  "site": {
    "title": "24 ways",
    "handle": "24ways",
    "description": "24 ways is the advent calendar for web geeks. Each day throughout December we publish a daily dose of web design and development goodness to bring you all a little Christmas cheer.",
    "url": "https://24ways.org",
    "feed": "https://feeds.feedburner.com/24ways",
    "theme_color": "#f04"
  },
  "theme": {
    "year": [
      348,
      344,
      340,
      336,
      332,
      328,
      324,
      320,
      316,
      312,
      308,
      304,
      300,
      296,
      292,
      288
    ],
    "day": [
      360,
      353,
      346,
      339,
      332,
      325,
      318,
      311,
      304,
      297,
      290,
      283,
      276,
      269,
      262,
      255,
      248,
      241,
      234,
      227,
      220,
      213,
      206,
      199
    ]
  },
  "href": "https://grabaperch.com/?ref=24w01",
  "img": {
    "src": "/assets/images/logo-perch.png",
    "alt": "Perch - A really little CMS"
  },
  "message": "The easiest way to publish **fast, flexible HTML5 websites** your clients will love.",
  "url": "grabaperch.com"
}
  • Content:
    .c-promo {
      display: block;
      margin-bottom: map(spaces, small);
    }
    
    .c-promo__image {
      height: auto;
      max-width: 100%;
    }
    
    .c-promo__message {
      margin-bottom: map(spaces, small);
      color: $color-text;
    }
    
    .c-promo__url {
      @apply --typeset-label;
    }
    
  • URL: /components/raw/promo/promo.css
  • Filesystem Path: src/components/common/promo/promo.css
  • Size: 251 Bytes

There are no notes for this item.