@sequent-org/ifc-viewer 1.2.4-ci.25.0 → 1.2.4-ci.27.0

package/src/styles-local.css

@@ -16,8 +16,8 @@
 
 /* === CSS VARIABLES (THEME COLORS) === */
 .ifc-viewer-container {
-  --color-primary: #3b82f6;
-  --color-primary-hover: #2563eb;
+  --color-primary: #80D8FF;
+  --color-primary-hover: #80D8FF;
   --color-secondary: #64748b;
   --color-secondary-hover: #475569;
   --color-neutral: #374151;
@@ -412,3 +412,63 @@
 .text-orange-600 { color: #ea580c; }
 .text-gray-600 { color: #4b5563; }
 .text-gray-500 { color: #6b7280; }
+
+/* === TOOLBAR BUTTONS SHADOWS === */
+#ifcToolbar .join {
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.25) !important;
+  transition: box-shadow 0.2s ease !important;
+  
+}
+
+/* #ifcToolbar .btn:hover {
+  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3) !important;
+}
+
+#ifcToolbar .btn:active {
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2) !important;
+} */
+
+/* === HOME BUTTON === */
+.nav-cube-home-btn {
+  /* Позиционирование */
+  position: absolute;
+  z-index: 40;
+  
+  /* Стили как у .btn .btn-sm */
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: var(--border-radius);
+  height: 2rem;
+  min-height: 2rem;
+  width: 2rem;
+  padding: 0;
+  font-size: 0.75rem;
+  font-weight: 600;
+  text-decoration: none;
+  border: 1px solid transparent;
+  cursor: pointer;
+  user-select: none;
+  transition-property: color, background-color, border-color, box-shadow;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 200ms;
+  background-color: var(--color-base-200);
+  color: var(--color-neutral);
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+}
+
+.nav-cube-home-btn:hover {
+  background-color: var(--color-base-300);
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
+}
+
+.nav-cube-home-btn:active {
+  background-color: var(--color-base-300);
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
+}
+
+.nav-cube-home-btn svg {
+  fill: #000000;
+  width: 18px;
+  height: 18px;
+}

package/src/viewer/NavCube.js

@@ -90,21 +90,12 @@ export class NavCube {
     this.homeBtn = document.createElement('button');
     this.homeBtn.type = 'button';
     this.homeBtn.title = 'Home';
+    this.homeBtn.className = 'nav-cube-home-btn';
     this.homeBtn.innerHTML = `   
-      <svg fill="#000000" width="20px" height="20px" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" class="icon">
+      <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" class="icon">
         <path d="M946.5 505L534.6 93.4a31.93 31.93 0 0 0-45.2 0L77.5 505c-12 12-18.8 28.3-18.8 45.3 0 35.3 28.7 64 64 64h43.4V908c0 17.7 14.3 32 32 32H448V716h112v224h265.9c17.7 0 32-14.3 32-32V614.3h43.4c17 0 33.3-6.7 45.3-18.8 24.9-25 24.9-65.5-.1-90.5z"/>
       </svg>
     `;
-    this.homeBtn.style.position = 'absolute';
-    this.homeBtn.style.zIndex = '40';   
-    this.homeBtn.style.width = '30px';
-    this.homeBtn.style.height = '30px';    
-    this.homeBtn.style.borderRadius = '6px';
-    this.homeBtn.style.border = '0px solid rgba(255,255,255,0.1)';
-    this.homeBtn.style.background = 'rgba(0, 0, 0, 0.05)';
-    this.homeBtn.style.color = '#fff';
-    this.homeBtn.style.cursor = 'pointer';
-    this.homeBtn.style.userSelect = 'none';    
     // Позиция задаётся в renderOverlay относительно текущего размера
     this.homeBtn.addEventListener('click', () => { try { this.onHome && this.onHome(); } catch(_) {} });
     try { this.container.appendChild(this.homeBtn); } catch(_) {}