Skip to content

Instantly share code, notes, and snippets.

@brasofilo
Last active March 30, 2023 02:01
Show Gist options
  • Save brasofilo/e759be47315754cdaa28c12fb666e9b8 to your computer and use it in GitHub Desktop.
Save brasofilo/e759be47315754cdaa28c12fb666e9b8 to your computer and use it in GitHub Desktop.
Orbital :: WordPress Login Form :: adapted by brasofilo, original code by https://codepen.io/guerreiro/pen/rNZajZ
<div id="logoBox">
<svg viewBox="0 0 160 160" width="160" height="160">
<circle cx="80" cy="80" r="50" />
<g transform=" matrix(0.866, -0.5, 0.25, 0.433, 80, 80)">
<path d="M 0,70 A 65,70 0 0,0 65,0 5,5 0 0,1 75,0 75,70 0 0,1 0,70Z" fill="#FFF">
<animateTransform attributeName="transform" type="rotate" from="360 0 0" to="0 0 0" dur="1s" repeatCount="indefinite" />
</path>
</g>
<path d="M 50,0 A 50,50 0 0,0 -50,0Z" transform="matrix(0.866, -0.5, 0.5, 0.866, 80, 80)" />
</svg>
</div>
/* Admin Tweaks: https://wordpress.org/plugins/many-tips-together */
/* Hide stuff as you wish, set a bg color and add the following CSS */
/* Add CSS */
svg {
position: fixed;
top: 20%;
height: 60%;
left: 20%;
width: 60%;
}
#logoBox * {
z-index: -9999999
}
#login > h1 {
display: none;
}
#loginform {
background: none;
}
#login {
width: 250px;
position: absolute;
top: 46%;
transform: translateX(-50%) translateY(-50%);
left: 50%;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment