Thomas/Piwigo_Bratonien_Tools
1
0
Fork 0
mirror of https://github.com/Terranom674/Piwigo_Bratonien_Tools.git synced 2026-09-19 14:04:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

Compact public selection controls

Browse Source
This commit is contained in:
Terranom674
2026-08-16 14:30:33 +02:00
parent 4ef8ccd196
commit 54d218cdea
1 changed files with 83 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
css/public_selection.css
View File

@@ -14,40 +14,45 @@
z-index:1000; z-index:1000;
display:flex; display:flex;
flex-wrap:wrap; flex-wrap:wrap;
gap: .65rem 1rem; gap:.45rem;
align-items:center; align-items:center;
justify-content: space-between; width:max-content;
padding: .7rem .85rem; max-width:100%;
margin: 0 0 1rem; margin:.35rem .6rem .75rem auto;
padding:.45rem .55rem;
border:1px solid rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.16);
border-radius: .35rem; border-radius:.4rem;
background: rgba(32,32,32,.96); background:rgba(27,27,27,.96);
box-shadow: 0 .25rem .8rem rgba(0,0,0,.2); box-shadow:0 .2rem .7rem rgba(0,0,0,.22);
} }
.bratonien-selection-status { .bratonien-selection-status {
padding:0 .45rem 0 .2rem;
white-space:nowrap; white-space:nowrap;
color:#d7d7d7;
} }
.bratonien-selection-actions { .bratonien-selection-actions {
display:flex; display:flex;
flex-wrap:wrap; flex-wrap:wrap;
gap: .45rem; gap:.35rem;
} }
.bratonien-selection-actions button { .bratonien-selection-actions button {
min-height: 2.25rem; min-height:2rem;
padding: .35rem .7rem; padding:.3rem .58rem;
border:1px solid rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.18);
border-radius:.25rem; border-radius:.25rem;
background: rgba(255,255,255,.05); background:rgba(255,255,255,.045);
color:inherit; color:inherit;
cursor:pointer; cursor:pointer;
font:inherit;
} }
.bratonien-selection-actions button:hover:not(:disabled), .bratonien-selection-actions button:hover:not(:disabled),
.bratonien-selection-actions button:focus:not(:disabled) { .bratonien-selection-actions button:focus:not(:disabled) {
border-color: rgba(240,166,70,.7); border-color:rgba(240,166,70,.72);
color:#f0a646;
} }
.bratonien-selection-actions .bratonien-selection-primary { .bratonien-selection-actions .bratonien-selection-primary {
@@ -57,13 +62,20 @@
font-weight:700; font-weight:700;
} }
.bratonien-selection-actions .bratonien-selection-primary:hover:not(:disabled),
.bratonien-selection-actions .bratonien-selection-primary:focus:not(:disabled) {
color:#242424;
}
.bratonien-selection-actions button:disabled { .bratonien-selection-actions button:disabled {
opacity: .45; opacity:.42;
cursor:default; cursor:default;
} }
.bratonien-selection-error { .bratonien-selection-error {
flex-basis:100%; flex-basis:100%;
max-width:34rem;
padding:.15rem .25rem 0;
color:#e58b8b; color:#e58b8b;
} }
@@ -109,13 +121,15 @@
@media (max-width:640px) { @media (max-width:640px) {
.bratonien-selection-bar { .bratonien-selection-bar {
align-items: stretch; width:auto;
margin:.35rem .5rem .75rem;
}
.bratonien-selection-status {
width:100%;
} }
.bratonien-selection-actions { .bratonien-selection-actions {
width:100%; width:100%;
} }
.bratonien-selection-actions button { .bratonien-selection-actions button {
flex:1 1 auto; flex:1 1 auto;
} }