35 lines
781 B
CSS
35 lines
781 B
CSS
/* space-status.css - styles the indicator as a pill-shaped button */
|
|
|
|
.space-status-indicator {
|
|
display:inline-flex;
|
|
align-items:center;
|
|
gap:0.4em;
|
|
padding:0.25em 0.75em;
|
|
border-radius:1em; /* fully-rounded corners */
|
|
font-size:0.95em;
|
|
font-weight:600;
|
|
line-height:1;
|
|
border:1px solid transparent;
|
|
user-select:none;
|
|
transition:filter .15s ease-in-out;
|
|
}
|
|
|
|
/* Open = soft green background + dark green text */
|
|
.space-status-indicator.open {
|
|
background:#e7f9ec;
|
|
color:#1e7a34;
|
|
}
|
|
|
|
/* Closed = soft red background + dark red text */
|
|
.space-status-indicator.closed {
|
|
background:#fdeeee;
|
|
color:#c03c3c;
|
|
}
|
|
|
|
/* (Optional) slight hover effect */
|
|
.space-status-indicator:hover,
|
|
.space-status-indicator:focus {
|
|
filter:brightness(1.05);
|
|
outline:none;
|
|
}
|