55 lines
1.7 KiB
CSS
55 lines
1.7 KiB
CSS
|
html, body, main {
|
||
|
|
height: 100%;
|
||
|
|
margin: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
main {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
background: linear-gradient(135deg, purple, red);
|
||
|
|
-webkit-filter: saturate(200%) sepia(50%) hue-rotate(-26deg);
|
||
|
|
filter: saturate(200%) sepia(50%) hue-rotate(-26deg);
|
||
|
|
}
|
||
|
|
|
||
|
|
container {
|
||
|
|
width: 900px; height: 600px;
|
||
|
|
overflow: hidden;
|
||
|
|
-webkit-transform: scale(.8);
|
||
|
|
transform: scale(.8);
|
||
|
|
}
|
||
|
|
|
||
|
|
p {
|
||
|
|
margin: 0;
|
||
|
|
word-break: break-all;
|
||
|
|
text-align: right;
|
||
|
|
line-height: 1.1;
|
||
|
|
font-size: 10px;
|
||
|
|
color: #F0FFF3;
|
||
|
|
--offset: 50;
|
||
|
|
-webkit-mask: linear-gradient(to left, #fff, transparent calc(var(--offset) * 1%));
|
||
|
|
mask: linear-gradient(to left, #fff, transparent calc(var(--offset) * 1%));
|
||
|
|
}
|
||
|
|
|
||
|
|
span {
|
||
|
|
text-shadow:
|
||
|
|
10px 0 10px currentColor,
|
||
|
|
-10px 0 10px currentColor;
|
||
|
|
}
|
||
|
|
|
||
|
|
.shape {
|
||
|
|
width: 400px; height: 600px;
|
||
|
|
float: right;
|
||
|
|
shape-outside: polygon(
|
||
|
|
0.25% 2px, 99.94% 0.27%, 99.75% 100%, 19.87% 100.03%, 0 100%, 30.61% 100.07%,
|
||
|
|
37.38% 99.82%, 44.21% 99.38%, 50.92% 99.34%, 71.39% 98.43%, 76.61% 98.79%,
|
||
|
|
82.65% 97.6%, 85.9% 95.73%, 90.12% 93.85%, 88.45% 89.91%, 87.41% 87.1%,
|
||
|
|
85.48% 85.09%, 84.96% 82.33%, 88.66% 81.41%, 90.55% 79.29%, 91.75% 77.23%,
|
||
|
|
91.23% 75.11%, 88.48% 73.75%, 90.93% 72.26%, 92.34% 70.16%, 91.59% 67.66%,
|
||
|
|
89.87% 64.91%, 87.01% 63.42%, 89.87% 62.01%, 93.04% 60.71%, 96.53% 58.57%,
|
||
|
|
97.8% 55.26%, 95.36% 53.2%, 91.46% 51.56%, 86.6% 49.21%, 83.43% 47%,
|
||
|
|
79.27% 44.12%, 77.05% 40.66%, 75.51% 37.07%, 75.49% 33.04%, 76.3% 28.93%,
|
||
|
|
75.99% 25.46%, 74.57% 22.25%, 72.88% 18.96%, 69.97% 15.51%, 66.59% 12.23%,
|
||
|
|
62.29% 9.2%, 57.33% 7.06%, 52.77% 5.2%, 46.55% 3.55%, 38.59% 1.5%, 27.73% 0.92%
|
||
|
|
);
|
||
|
|
}
|