mirror of
https://github.com/SoftFever/OrcaSlicer.git
synced 2025-08-06 21:44:08 -06:00
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:
parent
07634d2ba2
commit
0d3683c3e1
22 changed files with 211 additions and 81 deletions
|
@ -1,6 +1,7 @@
|
|||
#Content
|
||||
{
|
||||
overflow-y:auto;
|
||||
padding: 32px; /* ORCA Specify & Reduce horizontal paddings to fit 4 items per row */
|
||||
}
|
||||
|
||||
.BlockBanner
|
||||
|
@ -20,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 */
|
||||
}
|
||||
|
||||
/*.Banner-Btn
|
||||
|
@ -59,7 +64,7 @@
|
|||
|
||||
.PrinterArea
|
||||
{
|
||||
padding: 10px;
|
||||
padding: 10px 0px; /* ORCA Reduce horizontal paddings to fit 4 items per row */
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
@ -89,7 +94,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
|
||||
|
@ -152,26 +157,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 */
|
||||
}
|
||||
|
|
|
@ -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'];
|
||||
|
|
|
@ -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"s>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue