More actions
Created page with ".main-page-header { position: relative; margin-top: -2rem; margin-bottom: -4rem; padding-top: 6rem; padding-bottom: 6rem; clear: both; overflow: hidden; →Prevent circular inscription from affecting element size: pointer-events: none; →So that you can click elements overlap with the header: } .main-page-header::before { content: ''; position: absolute; inset: 0; background-image: url(https://credoth-spaces.nyc3.digitaloceanspaces.com/wiki/Ouroboros_Pi..." |
mNo edit summary |
||
Line 14: | Line 14: | ||
position: absolute; | position: absolute; | ||
inset: 0; | inset: 0; | ||
background-image: url(https://credoth-spaces.nyc3.digitaloceanspaces.com/wiki/ | background-image: url(https://credoth-spaces.nyc3.digitaloceanspaces.com/wiki/Ouroboros_Pin_no_bars_or_pin_SVG.svg); | ||
background-repeat: no-repeat; | background-repeat: no-repeat; | ||
background-position: center; | background-position: center; |
Revision as of 23:20, 26 December 2024
.main-page-header { position: relative; margin-top: -2rem; margin-bottom: -4rem; padding-top: 6rem; padding-bottom: 6rem; clear: both; overflow: hidden; /* Prevent circular inscription from affecting element size */ pointer-events: none; /* So that you can click elements overlap with the header */ } .main-page-header::before { content: ''; position: absolute; inset: 0; background-image: url(https://credoth-spaces.nyc3.digitaloceanspaces.com/wiki/Ouroboros_Pin_no_bars_or_pin_SVG.svg); background-repeat: no-repeat; background-position: center; background-size: contain; opacity: 0.1; filter: var(--filter-invert); pointer-events: none; animation: spin 60s infinite linear; } @keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }