vue-wp/vue-theme/src/sss/_typography.sss

@import './variables.sss'
@import './theme.sss'

.t
    &-cntr
        text-align: center
    &-left
        text-align: left
    &-right
        text-align: right
    &-justify
        text-align: justify
        text-justify: inter-word
    &-b
        font-weight: 800
    &-i
        text-style: italic
    &-up
        text-transform: uppercase
    &-cap
        text-transform: capitalize
    &-sans
        font-family: $sans
    &-serif
        font-family: $serif
    &-mono
        font-family: $mono

a
    /* text-decoration: none,  leave for now to show links underlined */
    &:hover
        cursor: pointer

h1, h2, h3, h4, h5, h6 /* common */
    /* font-weight: 400 */
    display: block
    margin-left: 0
    margin-right: 0
p 
    font-size: $ms-0
    line-height: 1.4
    /* margin-top: $ms-0 */
    margin-bottom: $ms-0

h1
    font-size: $ms-4
    margin-top: $ms--3
    margin-bottom: $ms--3   

h2
    font-size: $ms-3
    margin-top: 0.8em
    /* margin-bottom: $ms--1 */
h3
    font-size: $ms-2
    /* margin-top: 1em */
    margin-bottom: $ms-0
h4
    font-size: $ms-1
    /* margin-top: 1.33em */
    margin-bottom: $ms-1
h5
    font-size: $ms-0
    /* margin-top: 1.6em */
    margin-bottom: $ms-2
h6
    font-size: $ms--1
    /* margin-top: 2em */
    margin-bottom: $ms-3