Template:CreateHub/styles.css: Difference between revisions
Appearance
No edit summary |
No edit summary |
||
| Line 1: | Line 1: | ||
/* Row | /* --- Row Layout --- */ | ||
.creation-row { | .creation-row { | ||
display: flex; | display: flex; | ||
justify-content: center; | justify-content: center; | ||
margin: 0. | align-items: center; | ||
gap: 1rem; /* uniform spacing */ | |||
margin: 0.75rem 0; | |||
} | } | ||
.creation-row .inputbox | /* Give both elements the same fixed width */ | ||
.creation-row .inputbox input[type="text"], | |||
.creation-row input[type="submit"] { | |||
width: 260px !important; /* <-- adjust this to fit your layout */ | |||
box-sizing: border-box; /* ensures borders don’t change width */ | |||
} | } | ||
/* Text | /* --- Text Input --- */ | ||
.creation-row .inputbox input[type="text"] { | .creation-row .inputbox input[type="text"] { | ||
padding: 0.45rem 0.6rem; | |||
padding: 0. | |||
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; | ||
text-align: center; | text-align: center; | ||
background: #fff; | |||
} | } | ||
| Line 28: | Line 30: | ||
} | } | ||
/* Submit | /* --- Submit Button (matches Noarticletext buttons) --- */ | ||
.creation-row input[type="submit"] { | .creation-row input[type="submit"] { | ||
padding: 8px 0; | padding: 8px 0; | ||
text-align: center; | text-align: center; | ||
| Line 37: | Line 38: | ||
border: 1.5px solid #000 !important; | border: 1.5px solid #000 !important; | ||
border-radius: 2px !important; | border-radius: 2px !important; | ||
color: #000 !important; | color: #000 !important; | ||
font-weight: 600; | font-weight: 600; | ||
font-size: 0.95rem; | font-size: 0.95rem; | ||
cursor: pointer; | cursor: pointer; | ||
transition: | transition: | ||
background-color 0.2s ease, | |||
transform 0.15s ease, | transform 0.15s ease, | ||
border-color 0.15s | border-color 0.15s ease; | ||
} | } | ||
/* Hover */ | /* Hover */ | ||
.creation-row input[type="submit"]:hover:not(:disabled) { | .creation-row input[type="submit"]:hover:not(:disabled) { | ||
background-color: #f2f2f2 !important; | background-color: #f2f2f2 !important; | ||
transform: translateY(-1px); | transform: translateY(-1px); | ||
| Line 62: | Line 61: | ||
} | } | ||
/* Disabled state | /* Disabled state */ | ||
.creation-row input[type="submit"]:disabled { | .creation-row input[type="submit"]:disabled { | ||
background-color: #f5f5f5 !important; | background-color: #f5f5f5 !important; | ||
border-color: # | border-color: #ccc !important; | ||
color: # | color: #888 !important; | ||
cursor: not-allowed; | cursor: not-allowed; | ||
} | } | ||
Revision as of 14:19, 13 November 2025
/* --- Row Layout --- */
.creation-row {
display: flex;
justify-content: center;
align-items: center;
gap: 1rem; /* uniform spacing */
margin: 0.75rem 0;
}
/* Give both elements the same fixed width */
.creation-row .inputbox input[type="text"],
.creation-row input[type="submit"] {
width: 260px !important; /* <-- adjust this to fit your layout */
box-sizing: border-box; /* ensures borders don’t change width */
}
/* --- Text Input --- */
.creation-row .inputbox input[type="text"] {
padding: 0.45rem 0.6rem;
border: 1.5px solid #000 !important;
border-radius: 2px;
font-size: 0.95rem;
text-align: center;
background: #fff;
}
.creation-row .inputbox input[type="text"]::placeholder {
color: #777;
font-style: italic;
}
/* --- Submit Button (matches Noarticletext buttons) --- */
.creation-row input[type="submit"] {
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;
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 state */
.creation-row input[type="submit"]:disabled {
background-color: #f5f5f5 !important;
border-color: #ccc !important;
color: #888 !important;
cursor: not-allowed;
}