Add Filament / Printer window & web based windows improvements (#9431)

* update

* update

* Update 23.css

* update

* update

* Update 21.css

* update
This commit is contained in:
yw4z 2025-04-24 11:23:28 +03:00 committed by GitHub
parent 07634d2ba2
commit 0d3683c3e1
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
22 changed files with 211 additions and 81 deletions

View file

@ -1,7 +1,7 @@
#Content
{
overflow-y:auto;
padding: 32px; /* ORCA Specify & Reduce horizontal paddings to fit 4 items per row */
}
.BlockBanner
@ -21,7 +21,11 @@
align-items: center;
height: 40px;
text-align: center;
margin-right: 10px;
margin-right: 0px; /* ORCA align buttons with end of horizontal separator/line */
}
.BannerBtns>.SmallBtn_Green.trans{
margin-right: 7px; /* ORCA adds a small gap between buttons */
}
.BlockBanner a
@ -36,7 +40,7 @@
.PrinterArea
{
padding: 10px;
padding: 10px 0px; /* ORCA Reduce horizontal paddings to fit 4 items per row */
display: flex;
flex-wrap: wrap;
}
@ -57,7 +61,7 @@
.PName
{
font-weight: 700;
text-align: left;
text-align:left;
}
.pNozzel
@ -66,7 +70,7 @@
align-items: center;
justify-content:flex-start;
color: #5A5A5A;
padding-left: 10px;
padding-left: 0px; /* ORCA Align checkboxes with with model text */
}
.pNozzel input
@ -129,26 +133,47 @@
width: 100%;
position: relative;
display: flex;
}
}
.searchTerm {
.searchTerm {
width: 100%;
border: 3px solid #009688;
border: 1px solid #DBDBDB; /* ORCA Searchbox > match border style */
/*border-right: none;*/
padding: 5px;
height: 20px;
padding-left:32px;
height: 20px; /* ORCA match height */
line-height: 20px; /* ORCA center text vertically */
border-radius: 5px 5px 5px 5px;
outline: none;
color: #9DBFAF;
}
.searchTerm:focus{
color: #009688;
}
/*Resize the wrap to see the search bar change!*/
.wrap{
}
@media (prefers-color-scheme: dark) { /* ORCA Searchbox > add dark mode support */
.searchTerm {border: 1px solid #4A4A51;}
}
.searchTerm:focus{
color: #363636; /* ORCA Searchbox > use normal text color */
border-color:#009688; /* ORCA Searchbox > highlight border color when focused. like on normal UI */
}
@media (prefers-color-scheme: dark) { /* ORCA Searchbox > add dark mode support */
.searchTerm:focus{color: #FFFFFF}
}
#search-icon{ /* ORCA */
position:absolute;
top: 50%;
transform: translateY(-50%);
left:8px;
margin:0px auto;
fill:#7C8282
}
@media (prefers-color-scheme: dark) { /* ORCA Searchbox > add dark mode support */
#search-icon{fill:#949494}
}
/*Resize the wrap to see the search bar change!*/
.wrap{
width: 30%;
padding-bottom: 5px;
padding-left: 42px;
}
padding-left: 32px; /* ORCA Align with content */
}

View file

@ -98,7 +98,8 @@ function HandleModelList( pVal )
for(let m=0;m<NozzleArray.length;m++)
{
let nNozzel=NozzleArray[m];
HtmlNozzel += '<div class="pNozzel TextS2"><input type="checkbox" model="' + OneModel['model'] + '" nozzel="' + nNozzel + '" vendor="' + strVendor +'" onclick="CheckBoxOnclick(this)" /><span>'+nNozzel+'</span><span class="trans" tid="t13">mm nozzle</span></div>';
/* ORCA use label tag to allow checkbox to toggle when user ckicked to text */
HtmlNozzel += '<label class="pNozzel TextS2"><input type="checkbox" model="' + OneModel['model'] + '" nozzel="' + nNozzel + '" vendor="' + strVendor +'" onclick="CheckBoxOnclick(this)" /><span>'+nNozzel+'</span><span class="trans" tid="t13">mm nozzle</span></label>';
}
let CoverImage=OneModel['cover'];
@ -261,7 +262,8 @@ function FilterModelList(keyword) {
let HtmlNozzel = '';
for (let m = 0; m < NozzleArray.length; m++) {
let nNozzel = NozzleArray[m];
HtmlNozzel += '<div class="pNozzel TextS2"><input type="checkbox" model="' + OneModel['model'] + '" nozzel="' + nNozzel + '" vendor="' + strVendor + '" onclick="CheckBoxOnclick(this)" /><span>' + nNozzel + '</span><span class="trans" tid="t13">mm nozzle</span></div>';
/* ORCA use label tag to allow checkbox to toggle when user ckicked to text */
HtmlNozzel += '<label class="pNozzel TextS2"><input type="checkbox" model="' + OneModel['model'] + '" nozzel="' + nNozzel + '" vendor="' + strVendor + '" onclick="CheckBoxOnclick(this)" /><span>' + nNozzel + '</span><span class="trans" tid="t13">mm nozzle</span></label>';
}
let CoverImage = OneModel['cover'];

View file

@ -22,6 +22,10 @@
<div class="wrap">
<div class="search">
<input type="text" class="searchTerm" placeholder="Device keyword" oninput="textInput(this)">
<svg id="search-icon" width="16px" height="16px"> <!-- ORCA -->
<path d="M6.5,2A4.505,4.505,0,0,0,2,6.5a.5.5,0,0,0,1,0A3.5,3.5,0,0,1,6.5,3a.5.5,0,0,0,0-1Z"/>
<path d="M14.854,14.146l-3.423-3.422a6.518,6.518,0,1,0-.707.707l3.422,3.423a.5.5,0,0,0,.708-.708ZM1,6.5A5.5,5.5,0,1,1,6.5,12,5.507,5.507,0,0,1,1,6.5Z"/>
</svg>
</div>
</div>
<div id="Content" class="ZScrol">