Skip to content

Instantly share code, notes, and snippets.

@marklearst

marklearst/nav-last-item-has-slash.css

Created January 12, 2019 10:08
Show Gist options
  • Save marklearst/d32888bfe508b0aa4f9b1e0fe68beeb1 to your computer and use it in GitHub Desktop.
Save marklearst/d32888bfe508b0aa4f9b1e0fe68beeb1 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. marklearst created this gist Jan 12, 2019.
    18 changes: 18 additions & 0 deletions nav-last-item-has-slash.css
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,18 @@
    &::before,
    &:last-child span::before {
    content: '';
    width: 2px;
    background: ${props => props.theme.lightgrey};
    height: 100%;
    left: 0;
    position: absolute;
    transform: skew(-20deg);
    top: 0;
    bottom: 0;
    }
    &:last-child span::before {
    left: 100%;
    @media (min-width: 1300px) {
    display: none;
    }
    }