|
|
| Line 2: |
Line 2: |
| | Just...so...NUTRITIOUS!! | | Just...so...NUTRITIOUS!! |
| | | | |
| − | {{#css:
| |
| − | .scene {
| |
| − | width: 200px;
| |
| − | height: 200px;
| |
| − | perspective: 600px;
| |
| − | margin: 100px;
| |
| − | }
| |
| | | | |
| − | .cube {
| |
| − | width: 100%;
| |
| − | height: 100%;
| |
| − | position: relative;
| |
| − | transform-style: preserve-3d;
| |
| − | animation: rotatey 5s linear infinite;
| |
| − | }
| |
| | | | |
| − | .cube-face {
| + | |
| − | position: absolute;
| + | |
| − | width: 200px;
| + | |
| − | height: 200px;
| + | |
| − | }
| + | |
| − | .face-front { transform: rotateY( 0deg) translateZ(00px); background-color: rgba(255, 0, 0, 0); }
| + | |
| − | .face-right { transform: rotateY( 90deg) translateZ(00px); background-color: rgba(255, 255, 0, 0); }
| + | [[File:Salaaaaddd.gif|frameless]][[File:Salaaaaddd.gif|frameless]][[File:Salaaaaddd.gif|frameless]][[File:Salaaaaddd.gif|frameless]] |
| − | .face-back { transform: rotateY(180deg) translateZ(00px); background-color: rgba(0, 255, 0, 0); }
| |
| − | .face-left { transform: rotateY(-90deg) translateZ(00px); background-color: rgba(0, 255, 255, 0); }
| |
| − | .face-top { transform: rotateX( 90deg) translateZ(00px); background-color: rgba(0, 0, 255, 0); }
| |
| − | .face-bottom { transform: rotateX(-90deg) translateZ(00px); background-color: rgba(255, 0, 255, 0); }
| |
| − | @keyframes rotatey {
| |
| − | 0% { transform: rotate3d(0, 0, 1, 0deg); }
| |
| − | 100% { transform: rotate3d(1, 0, 1, 360deg); }
| |
| − | }
| |
| − | /* most of the css was taken from https://3dtransforms.desandro.com/cube */
| |
| − | }}
| |
| − | <div class="scene">
| |
| − | <div class="cube">
| |
| − | <div class="cube-face face-front">[[File:Saladtor.png|frameless]]</div>
| |
| − | <div class="cube-face face-back">[[File:Saladtor.png|frameless]]</div>
| |
| − | <div class="cube-face face-right">[[File:Saladtor.png|frameless]]</div>
| |
| − | <div class="cube-face face-left">[[File:Saladtor.png|frameless]]</div></div>
| |
| − | <div class="cube-face face-top"></div>
| |
| − | <div class="cube-face face-bottom"></div>
| |
| − | </div>
| |
| | [[Category:Seals]] | | [[Category:Seals]] |
| − | [[Category:Food]]
| |
