|
|
@@ -1,42 +0,0 @@
|
|
|
-<svg fill="none" viewBox="0 0 600 300" width="600" height="300" xmlns="http://www.w3.org/2000/svg">
|
|
|
- <foreignObject width="100%" height="100%">
|
|
|
- <div xmlns="http://www.w3.org/1999/xhtml">
|
|
|
- <style>
|
|
|
- @keyframes hi {
|
|
|
- 0% { transform: rotate( 0.0deg) }
|
|
|
- 10% { transform: rotate(14.0deg) }
|
|
|
- 20% { transform: rotate(-8.0deg) }
|
|
|
- 30% { transform: rotate(14.0deg) }
|
|
|
- 40% { transform: rotate(-4.0deg) }
|
|
|
- 50% { transform: rotate(10.0deg) }
|
|
|
- 60% { transform: rotate( 0.0deg) }
|
|
|
- 100% { transform: rotate( 0.0deg) }
|
|
|
- }
|
|
|
- .container {
|
|
|
- display: flex;
|
|
|
- width: 100%;
|
|
|
- height: 300px;
|
|
|
- background-color: black;
|
|
|
- color: white;
|
|
|
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- }
|
|
|
- .hi {
|
|
|
- animation: hi 1.5s linear -0.5s infinite;
|
|
|
- display: inline-block;
|
|
|
- transform-origin: 70% 70%;
|
|
|
- }
|
|
|
- @media (prefers-reduced-motion) {
|
|
|
- .hi {
|
|
|
- animation: none;
|
|
|
- }
|
|
|
- }
|
|
|
- </style>
|
|
|
-
|
|
|
- <div class="container">
|
|
|
- <h1>Hi there, my name is Nikola <div class="hi">👋</div></h1>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </foreignObject>
|
|
|
-</svg>
|
frux-c
