diff options
Diffstat (limited to 'basicsuite/webengine/content/csstetrahedron/style.css')
-rw-r--r-- | basicsuite/webengine/content/csstetrahedron/style.css | 109 |
1 files changed, 0 insertions, 109 deletions
diff --git a/basicsuite/webengine/content/csstetrahedron/style.css b/basicsuite/webengine/content/csstetrahedron/style.css deleted file mode 100644 index 70d872a..0000000 --- a/basicsuite/webengine/content/csstetrahedron/style.css +++ /dev/null @@ -1,109 +0,0 @@ -#pyramid { - position: relative; - margin: 0px auto; - height: 350px; - width: 100px; - -webkit-transform-style: preserve-3d; - -webkit-animation: spin 10s linear infinite; - -webkit-transform-origin: 116px 200px 116px; - - -moz-transform-style: preserve-3d; - -moz-animation: spin 10s linear infinite; - -moz-transform-origin: 116px 200px 116px; - - -ms-transform-style: preserve-3d; - -ms-animation: spin 10s linear infinite; - -ms-transform-origin: 116px 200px 116px; - - transform-style: preserve-3d; - animation: spin 10s linear infinite; - transform-origin: 116px 200px 116px; - -} - -@-webkit-keyframes spin { - from { - -webkit-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg); - } - to { - -webkit-transform: rotateX(360deg) rotateY(360deg) rotateZ(360deg); - } -} - -@-moz-keyframes spin { - from { - -moz-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg); - } - to { - -moz-transform: rotateX(360deg) rotateY(360deg) rotateZ(360deg); - } -} - -@-ms-keyframes spin { - from { - -ms-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg); - } - to { - -ms-transform: rotateX(360deg) rotateY(360deg) rotateZ(360deg); - } -} - -@keyframes spin { - from { - transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg); - } - to { - transform: rotateX(360deg) rotateY(360deg) rotateZ(360deg); - } -} - -#pyramid > div { - position: absolute; - border-style: solid; - border-width: 200px 0 200px 346px; - -webkit-transform-origin: 0 0; - -moz-transform-origin: 0 0; - -ms-transform-origin: 0 0; - transform-origin: 0 0; -} - -/* Put some text on each face */ -#pyramid > div:after { - position: absolute; - content: "QtWebEngine"; - color: #fff; - left: -250px; - text-align: center; -} - -#pyramid > div:first-child { - border-color: transparent transparent transparent rgba(40, 150, 10, 0.6); - -webkit-transform: rotateY(-19.5deg) rotateX(180deg) translateY(-400px); - -moz-transform: rotateY(-19.5deg) rotateX(180deg) translateY(-400px); - -ms-transform: rotateY(-19.5deg) rotateX(180deg) translateY(-400px); - transform: rotateY(-19.5deg) rotateX(180deg) translateY(-400px); -} - -#pyramid > div:nth-child(2) { - border-color: transparent transparent transparent rgba(30, 120, 10, 0.6); - -webkit-transform: rotateY(90deg) rotateZ(60deg) rotateX(180deg) translateY(-400px); - -moz-transform: rotateY(90deg) rotateZ(60deg) rotateX(180deg) translateY(-400px); - -ms-transform: rotateY(90deg) rotateZ(60deg) rotateX(180deg) translateY(-400px); - transform: rotateY(90deg) rotateZ(60deg) rotateX(180deg) translateY(-400px); -} - -#pyramid > div:nth-child(3) { - border-color: transparent transparent transparent rgba(20, 100, 10, 0.9); - -webkit-transform: rotateX(60deg) rotateY(19.5deg); - -moz-transform: rotateX(60deg) rotateY(19.5deg); - -ms-transform: rotateX(60deg) rotateY(19.5deg); - transform: rotateX(60deg) rotateY(19.5deg); -} - -#pyramid > div:nth-child(4) { - border-color: transparent transparent transparent rgba(10, 80, 10, 0.8); - -webkit-transform: rotateX(-60deg) rotateY(19.5deg) translateX(-116px) translateY(-200px) translateZ(326px); - -moz-transform: rotateX(-60deg) rotateY(19.5deg) translateX(-116px) translateY(-200px) translateZ(326px); - -ms-transform: rotateX(-60deg) rotateY(19.5deg) translateX(-116px) translateY(-200px) translateZ(326px); - transform: rotateX(-60deg) rotateY(19.5deg) translateX(-116px) translateY(-200px) translateZ(326px); -} |