Template:CreateHub/styles.css: Difference between revisions
Appearance
No edit summary |
No edit summary |
||
| Line 1: | Line 1: | ||
/* | /* Row container stays the same */ | ||
.creation-row { | .creation-row { | ||
display: flex; | display: flex; | ||
justify-content: center; | justify-content: center; | ||
margin: | margin: 0.5rem 0; | ||
} | } | ||
.creation-row .inputbox form { | .creation-row .inputbox form { | ||
display: flex; | display: flex; | ||
align-items: center; | align-items: center; | ||
gap: 0.75rem; | gap: 0.75rem; | ||
} | } | ||
/* Text input | /* Text input */ | ||
.creation-row .inputbox input[type="text"] { | .creation-row .inputbox input[type="text"] { | ||
width: 220px; | width: 220px; | ||
padding: 0.4rem 0.6rem; | padding: 0.4rem 0.6rem; | ||
border: 1.5px solid #000; | border: 1.5px solid #000 !important; | ||
border-radius: 2px; | border-radius: 2px; | ||
background: #fff; | background: #fff; | ||
| Line 29: | Line 28: | ||
} | } | ||
/* Submit button | /* Submit button: force same look as create-button links */ | ||
.creation-row | .creation-row input[type="submit"] { | ||
width: 220px; | width: 220px; | ||
padding: 8px 0; | padding: 8px 0; | ||
text-align: center; | text-align: center; | ||
background: transparent !important; | background: transparent !important; | ||
border: 1.5px solid #000; | border: 1.5px solid #000 !important; | ||
border-radius: 2px; | border-radius: 2px !important; | ||
color: | color: #000 !important; | ||
font-weight: 600; | font-weight: 600; | ||
font-size: 0.95rem; | font-size: 0.95rem; | ||
text-decoration: none !important; | |||
box-shadow: none !important; | |||
cursor: pointer; | cursor: pointer; | ||
| Line 49: | Line 50: | ||
} | } | ||
/* Hover | /* Hover */ | ||
.creation-row | .creation-row input[type="submit"]:hover:not(:disabled) { | ||
border-color: #000; | border-color: #000 !important; | ||
background-color: #f2f2f2 !important; | background-color: #f2f2f2 !important; | ||
transform: translateY(-1px); | transform: translateY(-1px); | ||
} | } | ||
.creation-row | /* Active */ | ||
.creation-row input[type="submit"]:active:not(:disabled) { | |||
transform: translateY(0); | transform: translateY(0); | ||
} | |||
/* Disabled state: still readable, but muted */ | |||
.creation-row input[type="submit"]:disabled { | |||
background-color: #f5f5f5 !important; | |||
border-color: #cccccc !important; | |||
color: #888888 !important; | |||
opacity: 1 !important; | |||
transform: none; | |||
cursor: not-allowed; | |||
} | } | ||
Revision as of 14:16, 13 November 2025
/* Row container stays the same */
.creation-row {
display: flex;
justify-content: center;
margin: 0.5rem 0;
}
.creation-row .inputbox form {
display: flex;
align-items: center;
gap: 0.75rem;
}
/* Text input */
.creation-row .inputbox input[type="text"] {
width: 220px;
padding: 0.4rem 0.6rem;
border: 1.5px solid #000 !important;
border-radius: 2px;
background: #fff;
font-size: 0.95rem;
text-align: center;
}
.creation-row .inputbox input[type="text"]::placeholder {
color: #777;
font-style: italic;
}
/* Submit button: force same look as create-button links */
.creation-row input[type="submit"] {
width: 220px;
padding: 8px 0;
text-align: center;
background: transparent !important;
border: 1.5px solid #000 !important;
border-radius: 2px !important;
color: #000 !important;
font-weight: 600;
font-size: 0.95rem;
text-decoration: none !important;
box-shadow: none !important;
cursor: pointer;
transition:
transform 0.15s ease,
border-color 0.15s ease,
background-color 0.2s ease;
}
/* Hover */
.creation-row input[type="submit"]:hover:not(:disabled) {
border-color: #000 !important;
background-color: #f2f2f2 !important;
transform: translateY(-1px);
}
/* Active */
.creation-row input[type="submit"]:active:not(:disabled) {
transform: translateY(0);
}
/* Disabled state: still readable, but muted */
.creation-row input[type="submit"]:disabled {
background-color: #f5f5f5 !important;
border-color: #cccccc !important;
color: #888888 !important;
opacity: 1 !important;
transform: none;
cursor: not-allowed;
}