How to use @typographist/styled - 1 common examples

To help you get started, we’ve selected a few @typographist/styled examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github howtocards / frontend / src / ui / templates / sidebar-template.js View on Github external
const SidebarContainer = styled.div`
  display: grid;
  grid-column-gap: 2rem;
  padding: 2rem 0;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  grid-template-columns: auto;
  grid-template-rows: 1fr 1fr;
  grid-template-areas:
    "sidebar"
    "main"
    "footer";

  ${up("tablet")} {
    grid-template-rows: 1fr auto;
    grid-template-columns: auto 30%;
    grid-template-areas:
      "main sidebar"
      "footer footer";
  }
`

const Sidebar = styled.aside`
  grid-area: sidebar;
`

const Main = styled.div`
  grid-area: main;
`

@typographist/styled

[![Build Status](https://travis-ci.org/typographist/styled.svg?branch=master)](https://travis-ci.org/typographist/styled)

MIT
Latest version published 4 years ago

Package Health Score

46 / 100
Full package analysis

Popular @typographist/styled functions