|
|
| (40 intermediate revisions by 2 users not shown) |
| Line 1: |
Line 1: |
| /* ========================================================= | | /* CSS placed here will be applied to all skins */ |
| PAGE FORMS – HARD RESET
| |
| ========================================================= */
| |
|
| |
|
| /* Remove table look completely */ | | /* Hide user menu icon for anonymous */ |
| .formtable, | | .personal-tools-icon { |
| .formtable tr,
| | display: none !important; |
| .formtable td {
| |
| border: none !important;
| |
| background: transparent !important;
| |
| padding: 0 !important;
| |
| margin: 0 !important;
| |
| }
| |
| | |
| /* Ensure PF respects outer layout */
| |
| .forminput,
| |
| .formlabel {
| |
| display: block !important;
| |
| width: 100% !important;
| |
| }
| |
| | |
| /* Kill PF default spacing */
| |
| .formtable {
| |
| margin-bottom: 6px !important;
| |
| }
| |
| | |
| /* =========================================================
| |
| INPUT NORMALIZATION (THIS IS THE IMPORTANT PART)
| |
| ========================================================= */
| |
| | |
| .forminput input[type="text"],
| |
| .forminput input[type="search"],
| |
| .forminput input[type="date"],
| |
| .forminput textarea,
| |
| .forminput select {
| |
| width: 100% !important;
| |
| min-width: 0 !important;
| |
| box-sizing: border-box !important;
| |
| padding: 4px 6px;
| |
| font-size: 13px;
| |
| }
| |
| | |
| /* =========================================================
| |
| DATEPICKER FIX (Release Date)
| |
| ========================================================= */
| |
| | |
| /* Prevent calendar button from shrinking input */
| |
| .forminput input.hasDatepicker {
| |
| width: 100% !important;
| |
| }
| |
| | |
| .forminput .ui-datepicker-trigger {
| |
| position: absolute;
| |
| right: 6px;
| |
| top: 50%;
| |
| transform: translateY(-50%);
| |
| }
| |
| | |
| /* Wrap date field correctly */
| |
| .forminput {
| |
| position: relative;
| |
| }
| |
| | |
| /* =========================================================
| |
| TOKEN INPUT FIX (Series, Multiplayer Tools)
| |
| ========================================================= */
| |
| | |
| .forminput .pfTokens {
| |
| width: 100% !important;
| |
| box-sizing: border-box !important;
| |
| display: block !important;
| |
| }
| |
| | |
| .forminput .pfTokens input {
| |
| width: 100% !important;
| |
| min-width: 0 !important;
| |
| box-sizing: border-box !important;
| |
| border: none !important;
| |
| outline: none;
| |
| }
| |
| | |
| /* Make tokens visually match text fields */
| |
| .forminput .pfTokens {
| |
| border: 1px solid #aaa;
| |
| border-radius: 3px;
| |
| padding: 2px 4px;
| |
| background: #fff;
| |
| }
| |
| | |
| /* =========================================================
| |
| FILE UPLOAD FIX
| |
| ========================================================= */
| |
| | |
| .forminput input[type="file"] {
| |
| width: 100% !important;
| |
| box-sizing: border-box !important;
| |
| }
| |
| | |
| /* =========================================================
| |
| FLEX ROW SAFETY (THIS FIXES YOUR EXACT ISSUE)
| |
| ========================================================= */
| |
| | |
| /* Ensure PF fields don't shrink in flex containers */
| |
| div[style*="display: flex"] .forminput {
| |
| flex: 1 1 auto !important;
| |
| min-width: 0 !important;
| |
| }
| |
| | |
| /* =========================================================
| |
| CHECKBOX GRID (YOUR EXISTING SYSTEM, STABLE)
| |
| ========================================================= */
| |
| | |
| .checkbox-grid > span {
| |
| display: grid !important;
| |
| grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important;
| |
| gap: 8px !important;
| |
| width: 100%;
| |
| }
| |
| | |
| .checkbox-grid .checkboxLabel {
| |
| display: flex !important;
| |
| align-items: center;
| |
| background: #f9f9f9;
| |
| border: 1px solid #ccc;
| |
| padding: 6px 10px;
| |
| border-radius: 4px;
| |
| height: 25px;
| |
| font-size: 13px;
| |
| white-space: nowrap;
| |
| }
| |
| | |
| .checkbox-grid .checkboxLabel:hover {
| |
| background: #fff;
| |
| border-color: #2a4b8d;
| |
| cursor: pointer;
| |
| }
| |
| | |
| .checkbox-grid br {
| |
| display: none !important;
| |
| }
| |
| | |
| /* =========================================================
| |
| QUALITY OF LIFE
| |
| ========================================================= */
| |
| | |
| /* Prevent weird label spacing */
| |
| .formlabel {
| |
| margin-bottom: 3px;
| |
| font-weight: bold;
| |
| }
| |
| | |
| /* Make everything predictable */
| |
| * {
| |
| box-sizing: border-box;
| |
| } | | } |
/* CSS placed here will be applied to all skins */
/* Hide user menu icon for anonymous */
.personal-tools-icon {
display: none !important;
}