<blockquote class="Prose-blockquote">
    <p class="u-layout-prose u-color-grey-90 u-text-p u-padding-r-all">Cumque officiis necessitatibus omnis aut reprehenderit soluta.</p>

</blockquote>
  • Content:
    /** @define Prose; weak; */
    
    :root {
      --Prose-color-text-primary: #1c2024;
      --Prose-color-text-secondary: #5a6772;
      --Prose-color-text-highlighted: #b2ebed;
      --Prose-color-link: #06c;
      --Prose-color-link-hover: #036;
      --Prose-color-link-visited: #06c;
    }
    
    .Prose > p,
    .Prose > pre
    .Prose > figure {
      @extend .u-margin-bottom-xl;
    }
    
    .Prose,
    .Prose > p,
    .Prose > ul > li,
    .Prose > ol > li {
      @extend .u-text-r-xs;
      @extend .u-lineHeight-xl;
    
      color: var(--Prose-color-text-primary);
    }
    
    .Prose > p > small {
      @extend .u-text-r-xxs;
    }
    
    .Prose > a,
    .Prose p > a {
      @extend .u-text-r-xs;
      @extend .u-lineHeight-xl;
    
      color: var(--Prose-color-link);
    }
    
    .Prose {
      color: var(--Prose-color-text-primary);
    }
    
    .Prose--secondary {
      color: var(--Prose-color-text-secondary);
    }
    
    .Prose-blockquote {
      @extend .u-border-left-m;
      @extend .u-padding-left-l;
      @extend .u-margin-bottom-xl;
    }
    
    .Prose-blockquote > p {
      @extend .u-text-r-m;
      @extend .u-textItalic;
      @extend .u-textSecondary;
    }
    
    .Prose > p > a:hover {
      color: var(--Prose-color-link-hover);
    }
    
    .Prose > p > a:visited {
      color: var(--Prose-color-link-visited);
    }
    
    .Prose > ul,
    .Prose > ol {
      @extend .u-margin-bottom-xl;
      @extend .u-margin-left-xl;
    
      list-style-position: outside;
    }
    
    .Prose > ul {
      list-style-type: square;
    }
    
    .Prose > ol {
      list-style-type: decimal;
    }
    
    .Prose > ul > li,
    .Prose > ol > li {
      @extend .u-padding-top-xxs;
      @extend .u-padding-bottom-xxs;
    }
    
    .Prose > h1 {
      @extend .u-text-h1;
    }
    
    .Prose > h2 {
      @extend .u-text-h2;
    }
    
    .Prose > h3 {
      @extend .u-text-h3;
    }
    
    .Prose > h4 {
      @extend .u-text-h4;
    }
    
    .Prose > h5 {
      @extend .u-text-h5;
    }
    
    .Prose > h6 {
      @extend .u-text-h6;
    }
    
  • URL: /components/raw/prose/index.css
  • Filesystem Path: src/modules/prose/index.css
  • Size: 1.7 KB

There are no notes for this item.