dh_demo

DreamHanks demo project
git clone git://git.lair.cx/dh_demo
Log | Files | Refs | README

WikiArticle.module.scss (1076B)


      1 @use 'core/vars';
      2 @use 'core/colors';
      3 @use 'core/typography';
      4 
      5 .article {
      6   line-height: 1.5;
      7 
      8   h1 {
      9     @include typography.apply('headline-large');
     10   }
     11   h2 {
     12     @include typography.apply('headline-medium');
     13   }
     14   h3 {
     15     @include typography.apply('headline-small');
     16   }
     17   h4 {
     18     @include typography.apply('title-large');
     19   }
     20   h5 {
     21     @include typography.apply('title-medium');
     22   }
     23   h6 {
     24     @include typography.apply('title-small');
     25   }
     26 
     27   ul, ol {
     28     margin: vars.$gap 0;
     29     padding-left: (2 * vars.$gap);
     30 
     31     li {
     32       ul, ol {
     33         margin: 0 1rem;
     34         padding-left: 0;
     35       }
     36     }
     37   }
     38 
     39   blockquote {
     40     border-left: 1px solid transparent;
     41     padding-left: vars.$gap;
     42     margin: vars.$gap 0 (2 * vars.$gap);
     43 
     44     @include colors.apply-themes() using ($theme) {
     45       border-color: colors.get($theme, 'primary');
     46     }
     47   }
     48 
     49   small {
     50     @include typography.apply('body-medium');
     51   }
     52 
     53   hr {
     54     height: 1px;
     55     border: none;
     56 
     57     @include colors.apply-themes() using ($theme) {
     58       background-color: colors.get($theme, 'primary');
     59     }
     60   }
     61 }