From 5a0f7833889c07a48c62eac282da3741433aad6a Mon Sep 17 00:00:00 2001 From: Kazhnuz Date: Sat, 13 Oct 2018 17:18:12 +0200 Subject: [PATCH] scss: add a debug class to show text lines --- css/clear-typography.css | 8 ++++++++ scss/clear-typography.scss | 10 ++++++++++ 2 files changed, 18 insertions(+) diff --git a/css/clear-typography.css b/css/clear-typography.css index 9e8e9d6..e7dac82 100644 --- a/css/clear-typography.css +++ b/css/clear-typography.css @@ -69,6 +69,14 @@ a { font-size: calc(2.5mm + 1vw); margin: auto; line-height: 1.5em; } + .text-wrapper.debug { + background-image: -webkit-linear-gradient(transparent 95%, rgba(159, 96, 96, 0.5) 95%); + background-image: -moz-linear-gradient(transparent 95%, rgba(159, 96, 96, 0.5) 95%); + background-image: -ms-linear-gradient(transparent 95%, rgba(159, 96, 96, 0.5) 95%); + background-image: -o-linear-gradient(transparent 95%, rgba(159, 96, 96, 0.5) 95%); + background-image: linear-gradient(transparent 95%, rgba(159, 96, 96, 0.5) 95%); + background-position: 50% 0; + background-size: 1.5em 1.5em; } @media screen and (min-width: 640px) { .text-wrapper.size-640 { diff --git a/scss/clear-typography.scss b/scss/clear-typography.scss index e22c686..8e9f5ec 100644 --- a/scss/clear-typography.scss +++ b/scss/clear-typography.scss @@ -82,6 +82,16 @@ a { font-size: calc(2.5mm + 1vw); margin: auto; line-height: 1.5em; + + &.debug { + background-image: -webkit-linear-gradient(hsla(0,0%,0%,0) 95%, hsla(0,25%,50%,.5) 95%); + background-image: -moz-linear-gradient(hsla(0,0%,0%,0) 95%, hsla(0,25%,50%,.5) 95%); + background-image: -ms-linear-gradient(hsla(0,0%,0%,0) 95%, hsla(0,25%,50%,.5) 95%); + background-image: -o-linear-gradient(hsla(0,0%,0%,0) 95%, hsla(0,25%,50%,.5) 95%); + background-image: linear-gradient(hsla(0,0%,0%,0) 95%, hsla(0,25%,50%,.5) 95%); + background-position: 50% 0; + background-size: 1.5em 1.5em; + } } @media screen and (min-width: 640px) {