Вопрос таков на сайте слямзил стиль для текста (css+html)
Под CSS создал отдельный файл (вот сам код, файл называется s-text)
HTML, BODY {
height: 100%;
}
$colors: #360745, #D61C59, #E7D84B, #EFEAC5, #1B8798;
BODY {
background: hsl(200,70,11);
background-size: .12em 100%;
font: 16em/1 Arial;
}
.text--line {
font-size: .5em;
}
svg {
position: absolute;
width: 100%;
height: 100%;
}
$max: 5;
$stroke-step: 7%;
.text-copy {
fill: none;
stroke: white;
stroke-dasharray: $stroke-step $stroke-step * ($max - 1);
stroke-width: 3px;
animation: stroke-offset 9s infinite linear;
@for $item from 1 through $max {
$stroke-color: nth($colors, $item);
&:nth-child(#{$item}) {
stroke: $stroke-color;
stroke-dashoffset: $stroke-step * $item;
}
}
@keyframes stroke-offset {
50% {
stroke-dashoffset: $stroke-step * $max;
stroke-dasharray: 0 $stroke-step * $max*2.5;
}
}
Вот.
А под html(404 называется) вот код:
404!
Not Found!
Что то ничего не работает... +
В html стоит в body
Под CSS создал отдельный файл (вот сам код, файл называется s-text)
HTML, BODY {
height: 100%;
}
$colors: #360745, #D61C59, #E7D84B, #EFEAC5, #1B8798;
BODY {
background: hsl(200,70,11);
background-size: .12em 100%;
font: 16em/1 Arial;
}
.text--line {
font-size: .5em;
}
svg {
position: absolute;
width: 100%;
height: 100%;
}
$max: 5;
$stroke-step: 7%;
.text-copy {
fill: none;
stroke: white;
stroke-dasharray: $stroke-step $stroke-step * ($max - 1);
stroke-width: 3px;
animation: stroke-offset 9s infinite linear;
@for $item from 1 through $max {
$stroke-color: nth($colors, $item);
&:nth-child(#{$item}) {
stroke: $stroke-color;
stroke-dashoffset: $stroke-step * $item;
}
}
@keyframes stroke-offset {
50% {
stroke-dashoffset: $stroke-step * $max;
stroke-dasharray: 0 $stroke-step * $max*2.5;
}
}
Вот.
А под html(404 называется) вот код:
404!
Not Found!
Что то ничего не работает... +
В html стоит в body