diff --git a/Art/nfluk/Screenshot.png b/Art/nfluk/Screenshot.png new file mode 100644 index 000000000..ea9b958c0 Binary files /dev/null and b/Art/nfluk/Screenshot.png differ diff --git a/Art/nfluk/index.html b/Art/nfluk/index.html new file mode 100644 index 000000000..53d502441 --- /dev/null +++ b/Art/nfluk/index.html @@ -0,0 +1,14 @@ + + + + + + Animation + + + + + + + + diff --git a/Art/nfluk/style.css b/Art/nfluk/style.css new file mode 100644 index 000000000..e49d0c56f --- /dev/null +++ b/Art/nfluk/style.css @@ -0,0 +1,29 @@ +body { + background-color: black; +} + +container { + display: flex; + align-items: center; + justify-content: center; + height: 100vh; +} + +button { + background-image: linear-gradient(45deg, blue, red); + height: 5rem; + width: 5rem; + border-radius: 10px; + font-weight: 900; + animation: rotate 25s infinite ease-out paused; +} + +@keyframes rotate { + to { + transform: rotate(7360deg) scale(15); + } +} + +button:hover { + animation-play-state: running; +} diff --git a/include.js b/include.js index 20bd7d97e..f072faf35 100644 --- a/include.js +++ b/include.js @@ -6532,6 +6532,13 @@ let cards = [ imageLink: './Art/marion/smiles.gif', author: 'Marion', githubLink: 'https://github.com/marionjudy13' + }, + { + artName: 'Spinning Button', + pageLink: './Art/nfluk/index.html', + imageLink: './Art/nfluk/Screenshot.png', + author: 'nfluk', + githubLink: 'https://github.com/nfluk' } ];