Template:CreateHub/styles.css: Difference between revisions
Appearance
No edit summary |
No edit summary |
||
| Line 4: | Line 4: | ||
justify-content: center; | justify-content: center; | ||
align-items: center; | align-items: center; | ||
gap: 1rem; | gap: 1rem; | ||
margin: 0.75rem 0; | margin: 0.75rem 0; | ||
} | } | ||
/* | /* Fixed, matching widths */ | ||
.creation-row .inputbox input[type="text"], | .creation-row .inputbox input[type="text"], | ||
.creation-row input[type="submit"] { | .creation-row input[type="submit"] { | ||
width: 260px !important; /* <-- | width: 260px !important; | ||
box-sizing: border-box; | height: 42px !important; /* <-- equal height for both */ | ||
box-sizing: border-box; | |||
} | } | ||
/* --- | /* --- Input Styling --- */ | ||
.creation-row .inputbox input[type="text"] { | .creation-row .inputbox input[type="text"] { | ||
padding: 0 | padding: 0 0.6rem; | ||
border: 1.5px solid #000 !important; | border: 1.5px solid #000 !important; | ||
border-radius: 2px; | border-radius: 2px; | ||
font-size: 0.95rem; | font-size: 0.95rem; | ||
background: #fff; | background: #fff; | ||
text-align: center; /* center typing */ | |||
font-style: italic; /* italic input text too */ | |||
} | } | ||
/* Center + italic placeholder */ | |||
.creation-row .inputbox input[type="text"]::placeholder { | .creation-row .inputbox input[type="text"]::placeholder { | ||
text-align: center; | |||
color: #777; | color: #777; | ||
font-style: italic; | font-style: italic; | ||
} | } | ||
/* --- | /* --- Button Styling (matches create-button aesthetic) --- */ | ||
.creation-row input[type="submit"] { | .creation-row input[type="submit"] { | ||
background: transparent !important; | background: transparent !important; | ||
border: 1.5px solid #000 !important; | border: 1.5px solid #000 !important; | ||
border-radius: 2px | border-radius: 2px; | ||
color: #000 !important; | color: #000 !important; | ||
font-weight: 600; | font-weight: 600; | ||
| Line 61: | Line 62: | ||
} | } | ||
/* Disabled | /* Disabled */ | ||
.creation-row input[type="submit"]:disabled { | .creation-row input[type="submit"]:disabled { | ||
background-color: #f5f5f5 !important; | background-color: #f5f5f5 !important; | ||
Revision as of 14:21, 13 November 2025
/* --- Row Layout --- */
.creation-row {
display: flex;
justify-content: center;
align-items: center;
gap: 1rem;
margin: 0.75rem 0;
}
/* Fixed, matching widths */
.creation-row .inputbox input[type="text"],
.creation-row input[type="submit"] {
width: 260px !important;
height: 42px !important; /* <-- equal height for both */
box-sizing: border-box;
}
/* --- Input Styling --- */
.creation-row .inputbox input[type="text"] {
padding: 0 0.6rem;
border: 1.5px solid #000 !important;
border-radius: 2px;
font-size: 0.95rem;
background: #fff;
text-align: center; /* center typing */
font-style: italic; /* italic input text too */
}
/* Center + italic placeholder */
.creation-row .inputbox input[type="text"]::placeholder {
text-align: center;
color: #777;
font-style: italic;
}
/* --- Button Styling (matches create-button aesthetic) --- */
.creation-row input[type="submit"] {
background: transparent !important;
border: 1.5px solid #000 !important;
border-radius: 2px;
color: #000 !important;
font-weight: 600;
font-size: 0.95rem;
cursor: pointer;
transition:
background-color 0.2s ease,
transform 0.15s ease,
border-color 0.15s ease;
}
/* Hover */
.creation-row input[type="submit"]:hover:not(:disabled) {
background-color: #f2f2f2 !important;
transform: translateY(-1px);
}
/* Active */
.creation-row input[type="submit"]:active:not(:disabled) {
transform: translateY(0);
}
/* Disabled */
.creation-row input[type="submit"]:disabled {
background-color: #f5f5f5 !important;
border-color: #ccc !important;
color: #888 !important;
cursor: not-allowed;
}