reviewed
This commit is contained in:
parent
62a385e4c9
commit
7959fe85cc
1 changed files with 1679 additions and 498 deletions
164
src/styles.css
164
src/styles.css
|
|
@ -557,41 +557,46 @@ summary span {
|
|||
color: white;
|
||||
font-weight: 600;
|
||||
}
|
||||
.stock-input {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
gap: 7px;
|
||||
}
|
||||
.stock-input .field {
|
||||
flex: 1;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.stock-input + .stock-input {
|
||||
margin-top: 12px;
|
||||
}
|
||||
.stock-input + .text-button {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.drawing-card {
|
||||
border: 1px solid var(--ink);
|
||||
background: white;
|
||||
}
|
||||
.drawing-header {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 8px;
|
||||
padding: 17px 20px 12px;
|
||||
border-top: 4px solid var(--ink);
|
||||
gap: 8px 16px;
|
||||
padding: 10px 14px;
|
||||
border-top: 3px solid var(--ink);
|
||||
}
|
||||
.drawing-header h2 {
|
||||
font-size: 17px;
|
||||
font-size: 14px;
|
||||
min-width: 0;
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
.drawing-header h2 small {
|
||||
display: inline-block;
|
||||
margin-left: 8px;
|
||||
font: 11px var(--mono);
|
||||
font-size: 11px;
|
||||
font-weight: 400;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.drawing-legend {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px 12px;
|
||||
font-size: 11px;
|
||||
}
|
||||
.floor-code {
|
||||
cursor: pointer;
|
||||
}
|
||||
.floor-code:hover rect {
|
||||
fill: #17263f;
|
||||
}
|
||||
.floor-code.is-highlighted rect {
|
||||
stroke: #17263f;
|
||||
stroke-width: 2px;
|
||||
vector-effect: non-scaling-stroke;
|
||||
}
|
||||
.badge {
|
||||
display: inline-flex;
|
||||
|
|
@ -603,12 +608,6 @@ summary span {
|
|||
.badge.pending {
|
||||
color: #a13e00;
|
||||
}
|
||||
.drawing-legend {
|
||||
display: flex;
|
||||
gap: 25px;
|
||||
padding: 0 20px 16px;
|
||||
font-size: 11px;
|
||||
}
|
||||
.drawing-legend > span {
|
||||
display: flex;
|
||||
gap: 7px;
|
||||
|
|
@ -953,23 +952,9 @@ summary span {
|
|||
.tooltip-content {
|
||||
right: 0;
|
||||
}
|
||||
.drawing-header {
|
||||
padding: 14px 13px 12px;
|
||||
}
|
||||
.drawing-header h2 {
|
||||
font-size: 16px;
|
||||
}
|
||||
.drawing-header h2 small {
|
||||
font-size: 10px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
.badge {
|
||||
font-size: 9px;
|
||||
}
|
||||
.drawing-legend {
|
||||
padding: 0 13px 13px;
|
||||
gap: 23px;
|
||||
}
|
||||
.purchase-summary h2 {
|
||||
font-size: 17px;
|
||||
}
|
||||
|
|
@ -1246,11 +1231,6 @@ summary span {
|
|||
.cut-preview-code > span {
|
||||
margin-left: 4px;
|
||||
}
|
||||
.drawing-legend {
|
||||
flex-wrap: wrap;
|
||||
gap: 8px 16px;
|
||||
padding-bottom: 8px;
|
||||
}
|
||||
.uncut-key {
|
||||
width: 17px;
|
||||
height: 10px;
|
||||
|
|
@ -1258,11 +1238,6 @@ summary span {
|
|||
background: #deddd8;
|
||||
border: 1px solid #79756b;
|
||||
}
|
||||
.drawing-help {
|
||||
font-size: 11px;
|
||||
padding: 0 20px 12px;
|
||||
color: #4b5c73;
|
||||
}
|
||||
.svg-cut:hover > polygon,
|
||||
.svg-cut:focus-visible > polygon {
|
||||
stroke: #17263f;
|
||||
|
|
@ -1272,6 +1247,9 @@ summary span {
|
|||
.skirting-code {
|
||||
cursor: pointer;
|
||||
}
|
||||
.skirting-code:hover rect {
|
||||
fill: #17263f;
|
||||
}
|
||||
.skirt-cut:hover .skirting-code rect,
|
||||
.skirt-cut:focus-visible .skirting-code rect {
|
||||
fill: #17263f;
|
||||
|
|
@ -1524,26 +1502,49 @@ summary span {
|
|||
background: #fffdf7;
|
||||
}
|
||||
.drawing-column .drawing-viewport {
|
||||
height: clamp(180px, calc(100dvh - 330px), 780px);
|
||||
height: clamp(180px, calc(100dvh - 260px), 780px);
|
||||
}
|
||||
.drawing-column:has(.plan-search-status) .drawing-viewport {
|
||||
height: clamp(160px, calc(100dvh - 390px), 720px);
|
||||
height: clamp(160px, calc(100dvh - 335px), 720px);
|
||||
}
|
||||
.drawing-column .room-svg {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.drawing-column .drawing-header h2 small {
|
||||
display: block;
|
||||
margin: 4px 0 0;
|
||||
}
|
||||
.plan-search-status {
|
||||
padding: 10px 12px;
|
||||
padding: 8px 12px;
|
||||
border: 1px solid var(--ink);
|
||||
border-top: 0;
|
||||
background: white;
|
||||
border-bottom: 0;
|
||||
background: #ffe6a3;
|
||||
color: #17263f;
|
||||
font-size: 12px;
|
||||
}
|
||||
.search-mode-heading {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 10px;
|
||||
}
|
||||
.search-mode-text {
|
||||
min-width: 0;
|
||||
}
|
||||
.search-mode-text strong {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
}
|
||||
.search-mode-text p {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
margin-top: 3px;
|
||||
}
|
||||
.clear-plan-search {
|
||||
flex-shrink: 0;
|
||||
border-color: #17263f;
|
||||
font-size: 12px;
|
||||
padding-inline: 9px;
|
||||
}
|
||||
.matching-rooms {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
|
@ -1581,6 +1582,26 @@ summary span {
|
|||
color: #345c55;
|
||||
}
|
||||
@media (max-width: 899px) {
|
||||
.drawing-header {
|
||||
padding: 8px 10px;
|
||||
gap: 6px;
|
||||
}
|
||||
.drawing-header h2 {
|
||||
font-size: 13px;
|
||||
}
|
||||
.drawing-legend {
|
||||
font-size: 10px;
|
||||
gap: 10px;
|
||||
}
|
||||
.plan-search-status {
|
||||
padding: 6px 9px;
|
||||
font-size: 11px;
|
||||
}
|
||||
.clear-plan-search {
|
||||
font-size: 11px;
|
||||
padding-inline: 7px;
|
||||
gap: 3px;
|
||||
}
|
||||
.app-main {
|
||||
padding-inline: 16px;
|
||||
}
|
||||
|
|
@ -1602,29 +1623,6 @@ summary span {
|
|||
.drawing-column:has(.plan-search-status) .drawing-viewport {
|
||||
height: clamp(150px, 25dvh, 240px);
|
||||
}
|
||||
.drawing-column .drawing-header {
|
||||
padding: 8px 12px;
|
||||
}
|
||||
.drawing-column .drawing-header h2 {
|
||||
font-size: 14px;
|
||||
}
|
||||
.drawing-column .drawing-header h2 small {
|
||||
display: inline;
|
||||
font-size: 10px;
|
||||
margin-left: 8px;
|
||||
}
|
||||
.drawing-column .drawing-legend {
|
||||
padding: 0 12px 7px;
|
||||
font-size: 10px;
|
||||
gap: 12px;
|
||||
}
|
||||
.drawing-column .drawing-help {
|
||||
display: none;
|
||||
}
|
||||
.plan-search-status {
|
||||
padding: 7px 10px;
|
||||
font-size: 11px;
|
||||
}
|
||||
.panel-toggle {
|
||||
font-size: 18px;
|
||||
min-height: 50px;
|
||||
|
|
|
|||
Loading…
Reference in a new issue