x_ite 5.0.2 → 6.0.0

package/dist/x_ite.css

@@ -1,69 +1,10 @@
-/* X_ITE v5.0.2-1147 */
+/* X_ITE v6.0.0-1154 */
 @charset "utf-8";
-@import url(https://fonts.googleapis.com/css?family=PT+Sans:400,400italic,700,700italic);
-X3DCanvas .x_ite-private-splash-screen {
-  display: none;
-  z-index: 100;
-  position: absolute;
-  inset: 0;
-  background: #1b1d21;
-  background: -moz-radial-gradient(center, ellipse cover, #2f3135 0%, #1b1d21 100%);
-  background: -webkit-radial-gradient(center, ellipse cover, #2f3135 0%,#1b1d21 100%);
-  background: radial-gradient(ellipse at center, #2f3135 0%,#1b1d21 100%);
-}
-X3DCanvas .x_ite-private-spinner {
-  position: absolute;
-  top: calc(50% - (138px / 2));
-  left: calc(50% - (134px / 2));
-  width: 138px;
-  height: 134px;
-  background: url(assets/images/logo.128.png) no-repeat;
-  -webkit-animation: spinner-animation-spin 32s linear infinite;
-  -moz-animation: spinner-animation-spin 32s linear infinite;
-  animation: spinner-animation-spin 32s linear infinite;
-}
-@-moz-keyframes spinner-animation-spin { 100% { -moz-transform: rotate(360deg); } }
-@-webkit-keyframes spinner-animation-spin { 100% { -webkit-transform: rotate(360deg); } }
-@keyframes spinner-animation-spin { 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }
-X3DCanvas .x_ite-private-progress {
-  position: absolute;
-  top: calc(50% - 28pt - 11pt);
-  left: calc(50% - 100px);
-  width: 200px;
-}
-X3DCanvas .x_ite-private-x_ite {
-  color: white;
-  font-size: 28pt;
-  text-align: center;
-  text-shadow: 1px 1px 0 black;
-  font-family: PT Sans, sans-serif;
-}
-X3DCanvas .x_ite-private-x_ite span.x_ite-private-x3d {
-  font-weight: bold;
-}
-X3DCanvas .x_ite-private-spinner-text {
-  color: white;
-  font-size: 11pt;
-  text-align: center;
-  text-shadow: 1px 1px 0 black;
-  font-family: PT Sans, sans-serif;
-}
-X3DCanvas .x_ite-private-progressbar {
-  margin: 8px;
-  border-left:  2px solid rgba(255, 255, 255, 0.5);
-  border-right: 2px solid rgba(255, 255, 255, 0.5);
-  padding: 0 2px;
-  text-align: left;
-}
-X3DCanvas .x_ite-private-progressbar div {
-  width: 0%;
-  height: 6px;
-  background: rgba(255, 255, 255, 0.5);
-}
+@import url("https://fonts.googleapis.com/css?family=PT+Sans:400,400italic,700,700italic");
+:host,
 X3DCanvas {
-  overflow: hidden;
-  position: relative;
   display: inline-block;
+  overflow: hidden;
   outline: none;
   margin: 0;
   padding: 0;
@@ -71,29 +12,33 @@ X3DCanvas {
   border-radius: 0;
   width: 300px;
   height: 150px;
+  user-select: none;
+  -webkit-user-select: none;
+}
+:host([hidden]) {
+  display: none;
 }
-X3DCanvas.x_ite-fullscreen {
+:host(.x_ite-fullscreen) {
   width: 100vw !important;
   height: 100vh !important;
 }
-X3DCanvas > *:not(.x_ite-fallback) {
+X3DCanvas > :not(.x_ite-private-browser, .x_ite-private-menu) {
   display: none;
 }
-.x_ite-console {
-  font-family: monospace;
-  white-space: pre;
-}
-X3DCanvas .x_ite-private-browser {
-  z-index: 0;
+.x_ite-private-browser {
+  overflow: hidden;
   display: block;
-  position: absolute;
-  inset: 0;
+  position: relative;
+  width: 100%;
+  height: 100%;
   margin: 0;
   padding: 0;
   border: 0;
   border-radius: 0;
+  user-select: none;
+  -webkit-user-select: none;
 }
-X3DCanvas .x_ite-private-surface {
+.x_ite-private-surface {
   margin: 0;
   padding: 0;
   border: 0;
@@ -101,7 +46,7 @@ X3DCanvas .x_ite-private-surface {
   height: 100%;
   margin-right: 0;
 }
-X3DCanvas canvas.x_ite-private-canvas {
+.x_ite-private-canvas {
   display: block;
   outline: none;
   margin: 0;
@@ -111,8 +56,7 @@ X3DCanvas canvas.x_ite-private-canvas {
   width: 100%;
   height: 100%;
 }
-X3DCanvas .x_ite-private-notification {
-  display: none;
+.x_ite-private-notification {
   padding: 5px;
   position: absolute;
   top: 20px;
@@ -135,12 +79,11 @@ X3DCanvas .x_ite-private-notification {
   white-space: pre;
   pointer-events: none;
 }
-X3DCanvas .x_ite-private-notification span {
+.x_ite-private-notification span {
   padding: 0 24px 0 20px;
-  background: url(assets/images/icon.bw.png) no-repeat 0 2px;
+  background: url("assets/images/icon.bw.png") no-repeat 0 2px;
 }
-X3DCanvas .x_ite-private-browser-timings {
-  display: none;
+.x_ite-private-browser-timings {
   position: absolute;
   bottom: -4px;
   left: -4px;
@@ -162,13 +105,13 @@ X3DCanvas .x_ite-private-browser-timings {
   white-space: pre;
   pointer-events: none;
 }
-X3DCanvas .x_ite-private-browser-timings table,
-X3DCanvas .x_ite-private-browser-timings thead,
-X3DCanvas .x_ite-private-browser-timings tbody,
-X3DCanvas .x_ite-private-browser-timings tfoot,
-X3DCanvas .x_ite-private-browser-timings tr,
-X3DCanvas .x_ite-private-browser-timings th,
-X3DCanvas .x_ite-private-browser-timings td {
+.x_ite-private-browser-timings table,
+.x_ite-private-browser-timings thead,
+.x_ite-private-browser-timings tbody,
+.x_ite-private-browser-timings tfoot,
+.x_ite-private-browser-timings tr,
+.x_ite-private-browser-timings th,
+.x_ite-private-browser-timings td {
   box-sizing: border-box;
   outline: 0;
   margin: 0;
@@ -184,36 +127,36 @@ X3DCanvas .x_ite-private-browser-timings td {
   line-height: 1;
   text-align: left;
 }
-X3DCanvas .x_ite-private-browser-timings table {
+.x_ite-private-browser-timings table {
   overflow: hidden;
-  background: url(assets/images/Time.png) no-repeat;
+  background: url("assets/images/Time.png") no-repeat;
   width: 100%;
   max-width: 100%;
   border-collapse: separate;
   border-spacing: 2px;
   empty-cells: show;
 }
-X3DCanvas .x_ite-private-browser-timings thead th {
+.x_ite-private-browser-timings thead th {
   padding-left: 20px;
   padding-bottom: 5px;
   font-weight: bold;
 }
-X3DCanvas .x_ite-private-browser-timings td:first-child {
+.x_ite-private-browser-timings td:first-child {
   padding-right: 10px;
 }
-X3DCanvas .x_ite-private-browser-timings tr.x_ite-private-more td {
+.x_ite-private-browser-timings tr.x_ite-private-more td {
   padding-bottom: 5px;
 }
-X3DCanvas .x_ite-private-browser-timings td {
+.x_ite-private-browser-timings td {
   padding-bottom: 2px;
 }
-X3DCanvas .x_ite-private-browser-timings tfoot td:first-child {
+.x_ite-private-browser-timings tfoot td:first-child {
   padding-right: 0;
 }
-X3DCanvas .x_ite-private-browser-timings tfoot td {
+.x_ite-private-browser-timings tfoot td {
   padding-top: 4px;
 }
-X3DCanvas .x_ite-private-browser-timings button {
+.x_ite-private-browser-timings button {
   box-sizing: border-box;
   border: 0;
   border-radius: 10px;
@@ -230,26 +173,32 @@ X3DCanvas .x_ite-private-browser-timings button {
   pointer-events: all;
   cursor: pointer;
 }
-X3DCanvas .x_ite-private-world-info-overlay {
+.x_ite-private-world-info-overlay {
   position: absolute;
   inset: 0;
 }
-X3DCanvas .x_ite-private-world-info {
+.x_ite-private-world-info {
   overflow-y: auto;
   position: absolute;
   inset: 0;
   -webkit-backdrop-filter: blur(8px);
   backdrop-filter: blur(8px);
   background: rgba(0,0,0,0.61803);
-  margin: 21pt;
+  background: -moz-linear-gradient(top, rgba(50,50,50,0.61803) 0%, rgba(0,0,0,0.61803) 100%); 
+  background: -webkit-linear-gradient(top, rgba(50,50,50,0.61803) 0%,rgba(0,0,0,0.61803) 100%); 
+  background: linear-gradient(to bottom, rgba(50,50,50,0.61803) 0%,rgba(0,0,0,0.61803) 100%); 
   border: 4px solid rgba(60,60,60,0.61803);
+  border-radius: 5px;
+  -webkit-background-clip: padding-box; 
+  background-clip: padding-box; 
+  margin: 21pt;
   border-radius: 15px;
   padding: 21pt;
 }
-X3DCanvas .x_ite-private-world-info .x_ite-private-world-info-top,
-X3DCanvas .x_ite-private-world-info .x_ite-private-world-info-title,
-X3DCanvas .x_ite-private-world-info .x_ite-private-world-info-info,
-X3DCanvas .x_ite-private-world-info p {
+.x_ite-private-world-info .x_ite-private-world-info-top,
+.x_ite-private-world-info .x_ite-private-world-info-title,
+.x_ite-private-world-info .x_ite-private-world-info-info,
+.x_ite-private-world-info p {
   box-sizing: border-box;
   outline: 0;
   margin: 0;
@@ -266,130 +215,97 @@ X3DCanvas .x_ite-private-world-info p {
   line-height: 1.2;
   text-align: left;
 }
-X3DCanvas .x_ite-private-world-info .x_ite-private-world-info-top {
+.x_ite-private-world-info .x_ite-private-world-info-top {
   font-weight: bold;
   font-style: italic;
   font-size: 9pt;
 }
-X3DCanvas .x_ite-private-world-info .x_ite-private-world-info-title {
+.x_ite-private-world-info .x_ite-private-world-info-title {
   margin: 0.3em 0 1em 0;
   font-weight: bold;
   font-size: 21pt;
 }
-X3DCanvas .x_ite-private-world-info .x_ite-private-world-info-info,
-X3DCanvas .x_ite-private-world-info .x_ite-private-world-info-info p {
+.x_ite-private-world-info .x_ite-private-world-info-info,
+.x_ite-private-world-info .x_ite-private-world-info-info p {
   margin: 1em 0 1em 0;
   font-size: 14pt;
 }
-X3DCanvas .x_ite-private-world-info a {
+.x_ite-private-world-info a {
   text-decoration: underline;
   color: #fd9f2e;
 }
-/*!
- * jQuery contextMenu - Plugin for simple contextMenu handling
- *
- * Version: v1.8.1
- *
- * Authors: Björn Brala (SWIS.nl), Rodney Rehm, Addy Osmani (patches for FF)
- * Web: http://swisnl.github.io/jQuery-contextMenu/
- *
- * Copyright (c) 2011-2015 SWIS BV and contributors
- *
- * Licensed under
- *   MIT License http://www.opensource.org/licenses/mit-license
- * Date: 2015-09-20T18:47:54.927Z
- */
-X3DCanvas #context-menu-layer {
-  z-index: 0 !important;
-}
-.x_ite-private-menu.x_ite-private-menu-title:before {
-   content: "X_ITE Browser v5.0.2";
-   display: block;
-   padding: 4px 32px 4px 8px;
-   font-weight: bold;
+.x_ite-private-menu.context-menu-layer {
+  position: fixed;
+  inset: 0;
 }
-.x_ite-private-menu .context-menu-selected {
-  font-weight: bold;
-  font-style: italic;
+.x_ite-private-menu.context-menu-list {
+  position: fixed;
 }
-.x_ite-private-menu.context-menu-list,
 .x_ite-private-menu .context-menu-list {
   position: absolute;
-  display: inline-block;
+}
+.x_ite-private-menu.context-menu-list,
+.x_ite-private-menu .context-menu-list {
+  display: block;
+  box-sizing: border-box;
   min-width: 120px;
-  padding: 0;
   margin: 0;
   margin-left: 1px;
-  white-space: pre;
+  padding: 5px 10px 9px 9px;
+  -webkit-backdrop-filter: blur(8px);
+  backdrop-filter: blur(8px);
+  background: rgba(0,0,0,0.61803);
+  background: -moz-linear-gradient(top, rgba(50,50,50,0.61803) 0%, rgba(0,0,0,0.61803) 100%); 
+  background: -webkit-linear-gradient(top, rgba(50,50,50,0.61803) 0%,rgba(0,0,0,0.61803) 100%); 
+  background: linear-gradient(to bottom, rgba(50,50,50,0.61803) 0%,rgba(0,0,0,0.61803) 100%); 
+  border: 4px solid rgba(60,60,60,0.61803);
+  border-radius: 5px;
+  -webkit-background-clip: padding-box; 
+  background-clip: padding-box; 
+  color: white;
   font-family: PT Sans, sans-serif;
   font-size: 10pt;
+  white-space: pre;
   line-height: 1.2;
   list-style-type: none;
-  background: #222;
-  color: #eee;
-  border: 0 solid #ddd;
-  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, .5);
-          box-shadow: 0 2px 5px rgba(0, 0, 0, .5);
 }
 .x_ite-private-menu .context-menu-item {
+  cursor: pointer;
   position: relative;
-  background-color: #222;
+  border-radius: 5px;
   margin: 0;
-  border-top: 1px solid #222;
-  border-bottom: 1px solid #222;
-  padding: 3px 24px 3px 24px;
-  -webkit-user-select: none;
-     -moz-user-select: none;
-      -ms-user-select: none;
-          user-select: none;
+  padding: 5px 24px;
   font-size: 10pt;
   line-height: 1;
   letter-spacing: unset;
+  text-align: left;
 }
-.x_ite-private-menu .context-menu-item > label > input,
-.x_ite-private-menu .context-menu-item > label > textarea {
-  all: revert;
-  -webkit-user-select: text;
-     -moz-user-select: text;
-      -ms-user-select: text;
-          user-select: text;
-}
-.x_ite-private-menu .context-menu-input > label > input[type="checkbox"] {
-  -webkit-appearance: checkbox;
-  -moz-appearance: checkbox;
+.x_ite-private-menu .context-menu-item:hover:not(.context-menu-not-selectable) {
+  background-color: rgba(255, 69, 58, 0.8);
 }
-.x_ite-private-menu .context-menu-input > label > input[type="radio"] {
-  -webkit-appearance: radio;
-  -moz-appearance: radio;
+.x_ite-private-menu .context-menu-item:hover > .context-menu-list {
+  display: block;
 }
-.x_ite-private-menu .context-menu-item:hover {
-  cursor: pointer;
-  background-color: #444;
-  border-top: 1px solid #eee;
-  border-bottom: 1px solid #eee;
+.x_ite-private-menu .context-menu-not-selectable {
+  cursor: default;
 }
-.x_ite-private-menu .context-menu-item.context-menu-separator {
+.x_ite-private-menu .context-menu-separator {
+  cursor: default;
+  margin: 2px 0;
   padding-top: 0;
   padding-bottom: 0;
   border-top: 0;
-  border-bottom: 1px solid #111;
+  border-bottom: 1px solid rgb(138, 138, 138);
 }
 .x_ite-private-menu .context-menu-separator + .context-menu-separator {
   display: none !important;
 }
-.x_ite-private-menu .context-menu-disabled {
-  color: #666;
-}
-.x_ite-private-menu .context-menu-input.context-menu-hover,
-.x_ite-private-menu .context-menu-disabled.context-menu-hover {
-  cursor: default;
-}
 .x_ite-private-menu .context-menu-submenu:after {
   content: "";
   position: absolute;
   display: block;
   right: 0;
-  top: 5px;
+  top: 8px;
   margin-right: 2px;
   
   width: 0;
@@ -398,9 +314,16 @@ X3DCanvas #context-menu-layer {
   border-width: 4px 0 4px 5px;
   border-color: transparent transparent transparent #eee;
 }
-.x_ite-private-menu .context-menu-item.context-menu-icon {
-  background-repeat: no-repeat;
-  background-position: 3px 2px;
+.x_ite-private-menu .context-menu-input > label {
+  cursor: pointer;
+  display: block;
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  width: 100%;
+  font-size: 10pt;
+  letter-spacing: unset;
+  line-height: 1;
 }
 .x_ite-private-menu .context-menu-input > label > * {
   vertical-align: top;
@@ -409,32 +332,21 @@ X3DCanvas #context-menu-layer {
   letter-spacing: unset;
   line-height: 1;
 }
+.x_ite-private-menu .context-menu-item > label > input {
+  all: revert;
+  cursor: pointer;
+}
 .x_ite-private-menu .context-menu-input > label > input[type="checkbox"],
 .x_ite-private-menu .context-menu-input > label > input[type="radio"] {
+  accent-color: rgb(255, 69, 58);
   display: inline;
+  width: 12px;
   margin: 0;
   margin-left: -20px;
-  margin-right: 3px;
   padding: 0;
 }
 .x_ite-private-menu .context-menu-input > label > span {
-  margin-left: 2px;
-}
-.x_ite-private-menu .context-menu-input > label,
-.x_ite-private-menu .context-menu-input > label > input[type="text"],
-.x_ite-private-menu .context-menu-input > label > textarea,
-.x_ite-private-menu .context-menu-input > label > select {
-  display: block;
-  box-sizing: border-box;
-  margin: 0;
-  padding: 0;
-  width: 100%;
-  font-size: 10pt;
-  letter-spacing: unset;
-  line-height: 1;
-}
-.x_ite-private-menu .context-menu-input > label > textarea {
-  height: 100px;
+  padding-left: 8px;
 }
 .x_ite-private-menu .context-menu-item > .context-menu-list {
   top: -9px;
@@ -442,14 +354,17 @@ X3DCanvas #context-menu-layer {
   right: -5px;
   display: none;
 }
-.x_ite-private-menu.x_ite-private-menu-submenus-left .context-menu-item > .context-menu-list {
-  left: unset !important;
+.x_ite-private-menu .context-menu-title {
+  font-weight: bold;
+  padding: 4px 32px 4px 8px;
 }
-.x_ite-private-menu .context-menu-item:hover > .context-menu-list {
-  display: block;
+.x_ite-private-menu .context-menu-selected {
+  font-weight: bold;
+  font-style: italic;
 }
-.x_ite-private-menu .context-menu-accesskey {
-  text-decoration: underline;
+.x_ite-private-menu .context-menu-icon {
+  background-repeat: no-repeat;
+  background-position: 2px 3px;
 }
 .x_ite-private-icon-viewpoint {
   background: url("assets/images/Viewpoint.png");
@@ -484,7 +399,7 @@ X3DCanvas #context-menu-layer {
 .x_ite-private-icon-texture-quality {
   background: url("assets/images/TextureQuality.png");
 }
-.x_ite-private-icon-fullscreen {
+.x_ite-private-icon-enter-fullscreen {
   background: url("assets/images/gtk-fullscreen.png");
 }
 .x_ite-private-icon-leave-fullscreen {
@@ -496,3 +411,60 @@ X3DCanvas #context-menu-layer {
 .x_ite-private-icon-help-about {
   background: url("assets/images/help-about.png");
 }
+.x_ite-private-splash-screen {
+  position: absolute;
+  inset: 0;
+  background: #1b1d21;
+  background: -moz-radial-gradient(center, ellipse cover, #2f3135 0%, #1b1d21 100%);
+  background: -webkit-radial-gradient(center, ellipse cover, #2f3135 0%,#1b1d21 100%);
+  background: radial-gradient(ellipse at center, #2f3135 0%,#1b1d21 100%);
+}
+.x_ite-private-spinner {
+  position: absolute;
+  top: calc(50% - (138px / 2));
+  left: calc(50% - (134px / 2));
+  width: 138px;
+  height: 134px;
+  background: url("assets/images/logo.128.png") no-repeat;
+  -webkit-animation: spinner-animation-spin 32s linear infinite;
+  -moz-animation: spinner-animation-spin 32s linear infinite;
+  animation: spinner-animation-spin 32s linear infinite;
+}
+@-moz-keyframes spinner-animation-spin { 100% { -moz-transform: rotate(360deg); } }
+@-webkit-keyframes spinner-animation-spin { 100% { -webkit-transform: rotate(360deg); } }
+@keyframes spinner-animation-spin { 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }
+.x_ite-private-progress {
+  position: absolute;
+  top: calc(50% - 28pt - 11pt);
+  left: calc(50% - 100px);
+  width: 200px;
+}
+.x_ite-private-x_ite {
+  color: white;
+  font-size: 28pt;
+  text-align: center;
+  text-shadow: 1px 1px 0 black;
+  font-family: PT Sans, sans-serif;
+}
+.x_ite-private-x_ite span.x_ite-private-x3d {
+  font-weight: bold;
+}
+.x_ite-private-spinner-text {
+  color: white;
+  font-size: 11pt;
+  text-align: center;
+  text-shadow: 1px 1px 0 black;
+  font-family: PT Sans, sans-serif;
+}
+.x_ite-private-progressbar {
+  margin: 8px;
+  border-left:  2px solid rgba(255, 255, 255, 0.5);
+  border-right: 2px solid rgba(255, 255, 255, 0.5);
+  padding: 0 2px;
+  text-align: left;
+}
+.x_ite-private-progressbar div {
+  width: 0%;
+  height: 6px;
+  background: rgba(255, 255, 255, 0.5);
+}