Newer
Older
pre-www / src / assets / css / base / typography.css
@font-face {
    font-family: 'Standard';
    src: url('../fonts/standard-book-webfont.woff2') format('woff2'),
         url('../fonts/standard-book-webfont.woff') format('woff'),
         url('../fonts/standard-book-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Standard';
    src: url('../fonts/standard-book-italic-webfont.woff2') format('woff2'),
         url('../fonts/standard-book-italic-webfont.woff') format('woff'),
         url('../fonts/standard-book-italic-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Standard';
    src: url('../fonts/standard-bold-webfont.woff2') format('woff2'),
         url('../fonts/standard-bold-webfont.woff') format('woff'),
         url('../fonts/standard-bold-webfont.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Standard';
    src: url('../fonts/standard-bold-italic-webfont.woff2') format('woff2'),
         url('../fonts/standard-bold-italic-webfont.woff') format('woff'),
         url('../fonts/standard-bold-italic-webfont.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
}

html{
    text-rendering: geometricPrecision;
}

h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{
    /* @apply font-bold; */
}

h1, .h1{
    @apply text-size-3xl;
}

h2, .h2{
    @apply text-size-2xl;
}

h3, .h3{
    @apply text-size-xl;
}

h4, .h4{
    @apply text-size-lg;
}

h5, .h5{
    @apply text-size-md-lg;
}

h6, .h6{
    @apply text-size-md;
}

p{
    @apply text-size-base text-black mb-sm;
    a{
        @apply underline;
        &:hover{
            @apply no-underline;
        }
    }
}

a[target="_blank"]{
    &::after{
        content: '(Apre una nuova finestra)';
        clip: rect(0 0 0 0);
        @apply absolute w-px overflow-hidden whitespace-nowrap;
    }
}

@layer utilities{
    /* .h1{
        @apply text-3xl lg:text-4xl xl:text-5xl leading-snug;
    }
    
    .h2{
        @apply text-2xl lg:text-3xl xl:text-4xl leading-snug;
    }
    
    .h3{
        @apply text-2xl lg:text-4xl xl:text-3xl leading-snug;
    }
    
    .h4{
        @apply text-lg lg:text-xl xl:text-2xl leading-snug;
    }
    
    .h5{
        @apply text-lg xl:text-xl leading-snug;
    }
    
    .h6{
        @apply text-base leading-snug;
    } */
    .text-size-sm{
        @apply text-sm;
    }
    .text-size-base{
        @apply text-base;
    }
    .text-size-md{
        @apply text-md;
    }
    .text-size-md-lg{
        @apply text-md md:text-md-lg;
    }
    .text-size-lg{
        @apply text-md md:text-md-lg xl:text-lg;
    }
    .text-size-xl{
        @apply text-lg md:text-xl-md xl:text-xl;
    }
    .text-size-2xl{
        @apply text-lg md:text-2xl-md xl:text-2xl;
    }
    .text-size-3xl{
        @apply text-lg md:text-2xl-md xl:text-3xl;
    }
}