architwin 1.8.2 → 1.8.4

package/static/atwinui.css

@@ -401,7 +401,7 @@
     border-radius: var(--container-border-radius);
     padding: var(--container-padding);
     justify-content: var(--container-justify-content);
-    flex-wrap: var(--container-wrap);
+    flex-wrap: nowrap;
     gap: 16px;
     flex-direction: column;
     margin: 6px;
@@ -707,12 +707,27 @@
 
 .at_ghost:hover {
     background-color: var(--bg-secondary);
+    /* background-color: var(--bg-accent); */
 }
 
 .at_ghost_active {
     background-color: var(--bg-secondary);
 }
 
+.at_accent {
+    border: solid white 2px;
+}
+
+.at_accent:hover {
+    background-color: var(--bg-accent);
+}
+
+.at_accent_active {
+    background-color: var(--bg-accent);
+}
+
+
+
 /*Card classes*/
 
 /* Equivalent CSS Classes */
@@ -1005,6 +1020,308 @@
     border: 1px solid #4E56EE;
 }
 
+/* Room */
+
+.at_empty-display {
+    display: var(--container-display);
+    justify-content: center;
+    align-items: center;
+    height: 100vh;
+    margin-top: -10px;
+}
+
+.at_draw_partition_btn {
+    background-color: black;
+    border: solid white 2px;
+}
+
+.at_draw_partition_btn_active {
+    background-color: var(--bg-accent);
+    border: solid white 2px;
+}
+
+.at_delete_room_btn {
+    background-color: #E52424;
+    border: solid white 2px;
+}
+
+.at_partition_list_container {
+    display: var(--container-display);
+    border-radius: var(--border-radius);
+    background-color: black;
+    flex-direction: column;
+    padding: 8px 6px 8px 6px;
+    height: 100%;
+}
+
+.at_partition_item_container {
+    display: var(--container-display);
+    flex-direction: column;
+    gap: 4px;
+}
+
+.at_face_title,
+.at_partition_title {
+    display: var(--container-display);
+    background-color: hsla(0,0%,19%,1);
+    border-radius: 4px;
+    align-items: center;
+    justify-content: space-between;
+    margin-bottom: 10px;
+    font-size: 12px;
+    font-family: Arial, sans-serif;
+    padding-left: 2px;
+    padding-right: 18px;
+}
+
+.at_face_title .mdi-chevron-left {
+    cursor: pointer;   
+    background-color: hsla(0, 3%, 6%, 0.8);
+    line-height: 1;
+    padding: 2px;
+    border-radius: 4px;
+}
+
+.at_partition_item {
+    display: var(--container-display);
+    background-color: hsla(0,0%,19%,1);
+    border-radius: 4px;
+    justify-content: space-between;
+    align-items: center;
+    padding: 2px 5px 2px 5px; 
+    margin: 0 4px 0 4px;
+}
+
+.at_partition_name {
+    display: flex;
+    background-color: hsla(0, 3%, 6%, 0.8);
+    border-radius: 4px;
+    justify-content: space-between;
+    flex: 1;
+    padding: 0 5px 0 5px;
+    margin: 0 20px 0 20px;
+    font-size: 12px;
+    font-family: Arial, sans-serif;
+}
+
+.at_icon_left {
+    line-height: 1;
+    background-color: hsla(173,75%,58%,1);
+    color: black;
+    border-radius: 4px;
+    padding: 1px;
+}
+
+.at_icon_right {
+    cursor: pointer;
+}
+
+.at_face_vertex_container {
+    display: none;
+    flex-direction: column;
+    margin: 4px;
+    gap: 6px;
+}
+
+.at_face_vertex_item {
+    display: var(--container-display);
+    background-color: hsla(0,0%,19%,1);
+    flex-direction: column;
+    border-radius: 4px;
+}
+
+.at_face_list {
+    display: var(--container-display);
+    border-radius: var(--border-radius);
+    border-style: dotted;
+    flex-direction: column;
+    padding: 8px 6px 6px 6px;
+}
+
+.at_face_item {
+    display: var(--container-display);
+    flex-direction: row;
+    justify-content: space-between;
+    align-items: center;
+    padding: 2px 5px 2px 5px; 
+}
+
+.at_face_name {
+    background-color: hsla(0, 3%, 6%, 0.8);
+    border-radius: 4px;
+    cursor: pointer;
+    margin: 2px;
+    font-size: 12px;
+    font-family: Arial, sans-serif;
+    text-align: center;
+    width:100px;
+}
+
+.at_face_icon_left {
+    display: inline-block;
+    line-height: 1;
+    background-color: hsla(173,75%,58%,1);
+    color: black;
+    border-radius: 4px;
+    padding: 2px;
+    cursor: default;
+}
+
+.at_face_icon_right {
+    cursor: pointer;
+}
+
+.at_face_icon_right:hover {
+    color: var(--bg-accent-azusa)
+}
+
+.at_face_icon_rotate_90 {
+    display: inline-block;
+    transform: rotate(90deg); 
+}
+
+.at_face_icon_rotate_180 {
+    display: inline-block;
+    transform: rotate(180deg); 
+}
+
+.at_face_icon_rotate_270 {
+    display: inline-block;
+    transform: rotate(270deg); 
+}
+
+.at_edit_name {
+    display: none;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    padding-bottom: 6px;
+}
+
+.at_edit_name_text {
+    display: flex;
+    font-family: Arial, sans-serif;
+    font-size: 10px;
+    text-align: center;
+    cursor: pointer;
+    gap: 5px;
+}
+
+.at_edit_name_input {
+    display: none;
+    align-items: center;
+    padding-bottom: 4px;
+}
+
+.at_edit_face_name_input {
+    background-color: hsla(0,0%,19%,1);
+    font-family: Arial, sans-serif;
+    font-size: 10px;
+    box-sizing: border-box;
+    text-align: center;
+    color: white;
+    border:none;
+    border-bottom: 1px solid;
+    outline: none;
+    padding-bottom: 2px;
+    height: 20px;
+    max-width: 85px;
+} 
+
+.at_edit_partition_name_input {
+    display:flex;
+    background-color: black;
+    font-family: Arial, sans-serif;
+    font-size: 10px;
+    box-sizing: border-box;
+    color: white;
+    border:none;
+    border-bottom: 1px solid;
+    outline: none;
+    padding-bottom: 2px;
+    height: 20px;
+    width: 100%;
+}
+
+.at_edit_name_input .mdi-check {
+    display: inline-flex; 
+    align-items: center; 
+    cursor: pointer;
+    border-bottom: 1px solid;
+    height: 20px;
+    padding-bottom: 3px;
+}
+
+.at_vertex_list {
+    display: none;
+    flex-direction: column;
+    border-radius: 4px;
+    margin-bottom: 6px;
+}
+
+.at_vertex_list.show {
+    display: var(--container-display);
+}
+
+.at_vertex_item {
+    display: var(--container-display);
+    background-color: hsla(0, 3%, 6%, 0.8);
+    border-radius: 4px;
+    flex-direction: row;
+    justify-content: space-between;
+    align-items: center;
+    padding: 2px 5px 2px 5px; 
+    margin: 0px 14px 4px 15px;
+}
+
+.at_vertex_center {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;;
+    align-items: center;
+    gap: 6px;
+}
+
+.at_vertex_distance {
+    background-color:hsla(0,0%,100%,0.8) ;
+    border-radius: 4px;
+    color: black;
+}
+
+.at_vertex_name, 
+.at_vertex_distance {
+    font-size: 12px;
+    font-family: Arial, sans-serif;
+    white-space: nowrap;
+    text-align: center;
+    width: 50px;
+}
+
+.at_vertex_icon_left {
+    display: inline-block;
+    line-height: 1;
+    background-color: hsla(71,96%,62%,1);
+    color: black;
+    border-radius: 4px;
+    padding: 2px;
+    cursor: default;
+    margin: 2px;
+}
+
+.at_vertex_icon_right {
+    cursor: pointer;
+}
+
+.at_vertex_icon_right:hover {
+    color: var(--bg-accent-azusa)
+}
+
+.at_invisible {
+    opacity: 0;        
+    pointer-events: none;
+    cursor: default;
+}
+
 @media screen and (max-width: 540px) {
 
     .at_modal {
@@ -1026,4 +1343,116 @@
 .at_disabled {
     pointer-events: none;
     opacity: 0.4;
-}
+}
+
+/* Basic styling for the tree */
+/* .at_tree {
+    list-style-type: none;
+    margin: 0;
+    padding: 0;
+}
+.at_tree li {
+    margin: 0;
+    padding: 5px 0 5px 20px;
+    position: relative;
+}
+.at_tree li::before {
+    content: "";
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 10px;
+    height: 1px;
+    background: #ccc;
+}
+.at_tree li::after {
+    content: "";
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 1px;
+    height: 100%;
+    background: #ccc;
+}
+.at_tree li:last-child::after {
+    height: 10px;
+}
+.at_tree ul {
+    margin-left: 20px;
+    padding-left: 0;
+}
+.at_tree .toggle {
+    cursor: pointer;
+}
+.at_tree .hidden {
+    display: none;
+} */
+
+/* Simplified tree styles */
+.at_room_tree {
+    list-style-type: none;
+    margin: 0;
+    padding: 0;
+}
+
+.at_room_tree li {
+    margin: 5px 0;
+}
+
+.at_room_tree_parent {
+    padding-left: 0 !important;
+}
+
+.at_room_tree_parent span {
+    padding-left: 5px;
+}
+
+.at_room_tree .toggle {
+    cursor: pointer;
+    /* padding-right: 5px;
+    border-radius: 4px;  */
+    display: flex;
+    justify-content: space-between;
+}
+
+.at_room_tree_child{
+    /* cursor: pointer; */
+    display: block;
+    padding-left: 5px;
+    margin-left: 20px !important;
+    border-radius: 4px; 
+}
+
+.at_room_tree_child li {
+    margin: 5px 0;
+    padding-left: 30px;
+    padding-right: 5px;
+    display: flex;
+    justify-content: space-between;
+}
+
+.at_room_tree .selectable {
+    cursor: pointer;
+    display: block;
+    border-radius: 4px; 
+    display: flex;
+    justify-content: space-between;
+}
+
+.at_room_tree .selected {
+    background-color: #0F0E0E;
+    padding-right: 5px;
+    border-radius: 4px; 
+}
+
+.at_room_tree .hidden {
+    display: none;
+}
+
+.at_room_edit_btn, .at_room_visible_btn {
+    cursor: pointer;
+}
+
+.at_toggle {
+    padding-right: 5px;
+}

package/static/utility.css

@@ -126,6 +126,22 @@ width: 100vw;
     height: 100vh;
   }
 
+  .at_h-min-15 {
+    min-height: 15vh;
+  }
+
+  .at_h-min-20 {
+    min-height: 20vh;
+  }
+  
+  .at_h-min-25 {
+    min-height: 25vh;
+  }
+
+  .at_h-min-40 {
+    min-height: 40vh;
+  }
+
   .at_h-min-45 {
     min-height: 45vh;
   }
@@ -191,6 +207,10 @@ width: 100vw;
     font-weight: bolder;
   }
 
+  .at_text_xxs {
+    font-size: 0.65em
+  }
+
   .at_text_xs {
     font-size: 0.75rem;
   }
@@ -209,4 +229,22 @@ width: 100vw;
 
   .at_text_xl {
     font-size: 1.25rem;
-  }
+  }
+
+  .at_text_white {
+    color: white;
+  }
+
+  .at_opacity_5 {
+    opacity: 50%
+  }
+
+  .at_rotate_minus_90 {
+    display: inline-block;
+    transform: rotate(-90deg); 
+    transition: transform 0.3s ease;
+  }
+
+  .at_pull_right {
+    float: right;
+  }

package/lib/atwinui/components/toolbar/menu-bar.d.ts

@@ -1,4 +0,0 @@
-import { LitElement } from 'lit';
-export declare class Menubar extends LitElement {
-    render(): import("lit-html").TemplateResult<1>;
-}

package/lib/atwinui/components/toolbar/menu-bar.js

@@ -1,35 +0,0 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-import { html, LitElement } from 'lit';
-import { customElement } from 'lit/decorators.js';
-let Menubar = class Menubar extends LitElement {
-    render() {
-        return html `
-    <div class="at_toolbar_container" id="at-menu-bar">
-        <div class="at_sidebar_button_icon">
-            <span class="mdi mdi-bullseye" id="at-expand-btn"></span>
-        </div>
-        <div class="at_sidebar_button_icon">      
-            <span class="mdi mdi-cube-outline" id="at-object-list-btn"></span>
-        </div>
-        <div class="at_sidebar_button_icon">
-            <span class="mdi mdi-map"  id="at-minimap-btn" target-pane="at-map"></span>
-        </div>
-        <div class="at_sidebar_button_icon">
-            <span class="mdi mdi-message-video" id="at-videocall-btn"></span>
-        </div>
-        <div class="at_sidebar_button_icon">
-            <span class="mdi mdi-monitor-screenshot" id="at-screenshot-btn"></span>
-        </div>
-    </div>
-    `;
-    }
-};
-Menubar = __decorate([
-    customElement('at-menubar')
-], Menubar);
-export { Menubar };

package/lib/atwinui/components/toolbar/sidebar-container.d.ts

@@ -1,5 +0,0 @@
-import { LitElement } from 'lit';
-export declare class SidebarContainer extends LitElement {
-    checked: boolean;
-    render(): import("lit-html").TemplateResult<1>;
-}

package/lib/atwinui/components/toolbar/sidebar-container.js

@@ -1,27 +0,0 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-import { html, LitElement } from 'lit';
-import { customElement, property } from 'lit/decorators.js';
-let SidebarContainer = class SidebarContainer extends LitElement {
-    constructor() {
-        super(...arguments);
-        this.checked = false;
-    }
-    render() {
-        return html `
-      <div class="at_sidebar_container at_topRight" id="at-sidebar-container">
-      </div>
-    `;
-    }
-};
-__decorate([
-    property()
-], SidebarContainer.prototype, "checked", void 0);
-SidebarContainer = __decorate([
-    customElement('at-sidebar-container')
-], SidebarContainer);
-export { SidebarContainer };