#checker_preview.postbox { display:none; } li#menu-posts-checker img { width: 18px; } .pointer { cursor: pointer; } #checker_options > .inside { padding-bottom: 0; margin-top: 0; } label#title-prompt-text { padding: 3px 8px!important; } .inset { box-shadow: inset 3px 3px 15px #33333350, inset -3px -3px 5px #ffffff!important; border-radius: .5rem; padding: 1rem!important; } .inset .card:first-child { margin-top: 0!important; } /* .repeater-form-field .card:first-child .delete-form-card { display:none; } */ .repeater-form-field:not(:has(.card)) { display: none; } table.checker-setting th { width: 100px !important; border-right: 1px solid lightgrey; } .card.shadow.repeater-card.gap-2, .result-value-output.inset.bg-light > .card { max-width: unset; } /** Preview **/ .dw-checker-container { display: flex; justify-content: center; align-items: center; margin-bottom: 2em; } .dw-checker-wrapper { background-color: #ccc; padding: 1em; border-radius: 1em; /* width: 500px; */ max-width: 100%; /* box-shadow: 0px 5px 15px -5px #333333; */ } .dw-checker-title { font-size:24px; font-weight: bold; } .dw-checker-field { display: flex; flex-direction: column; margin: .5em 0; } .dw-checker-field > label { font-weight: 600; } .dw-checker-field > input, .dw-checker-field > select { height: 38px; border-radius: .5em; border: 1px solid #ccc; padding-left: 1em; padding-right: 1em; } .dw-checker-buttons { display: flex; gap: .5em; flex: 0 1 fit-content; } .dw-checker-wrapper button { padding: .65em .75em; border: none; border-radius: 0.5em; } .dw-checker-result-div-item { border-bottom-style: solid; padding: .5em 0; } .card-buttons { top: 1em; right: -1em; } input[type=color] { height: 34px; } li.list-group-item.option-nav-menu.mb-0.pointer.active { background-color: white; color: var(--bs-bg-secondary); font-weight: 800; } li.list-group-item.option-nav-menu.mb-0.pointer { background-color: var(--bs-bg-secondary); color: white; } .form-check { display: flex!important; align-items: center; gap: .5em; } .form-check-input:checked { background-color: unset; } /** result **/ .dw-checker-results { padding: 1em; } table.dw-checker-result-table { width: 100%; } .dw-checker-results table, .dw-checker-results th, .dw-checker-results td { border-style: solid; } .dw-checker-results th, .dw-checker-results td { padding: .75em .5em; } .dw-checker-value-button { border: none; border-radius: .5em; padding: .5em 1em; text-decoration: none; } .result-header { font-weight: bold; } .dw-checker-result-div { border-bottom-style: solid; display: flex; flex-direction: column; gap: .5em; padding: .75em 0; } .dw-checker-result-div:last-child{ border: none; } /** Outside Result Container **/ .dw-checker-container { flex-direction: column; } #dw-checker-form > .dw-checker-wrapper:is(.standard-table-output-type, .cards-output-type) { display: flex; flex-direction: row; flex-wrap: wrap; gap: 10px; } #dw-checker-form > .dw-checker-wrapper:is(.standard-table-output-type, .cards-output-type) > *:is(:first-child, :nth-child(2)) { flex: 0 0 100%; margin-bottom: 10px; } #dw-checker-form > .dw-checker-wrapper:is(.standard-table-output-type, .cards-output-type) > .dw-checker-divider { display: none; } #dw-checker-form > .dw-checker-wrapper:is(.standard-table-output-type, .cards-output-type) .dw-checker-form-fields { display: flex; gap: 9px; flex-direction: row; max-width: 100%; flex: 1 1 calc(100% - 110px); } #dw-checker-form > .dw-checker-wrapper:is(.standard-table-output-type, .cards-output-type) .dw-checker-title { margin-bottom: 0; } #dw-checker-form > .dw-checker-wrapper:is(.standard-table-output-type, .cards-output-type) .dw-checker-buttons.dw-checker-form-button button { height: 100%; } #dw-checker-form > .dw-checker-wrapper:is(.standard-table-output-type, .cards-output-type) .dw-checker-field { margin: 0!important; flex: -1 0 calc(25% - 3px); width: 100%; } #dw-checker-form > .dw-checker-wrapper:is(.standard-table-output-type, .cards-output-type) .dw-checker-form-fields *:is(select, input) { min-width: unset!important; max-width: 100%; width: 100%; } /* Grid layout for cards */ .dw-cards-container > .result-page { display: grid; grid-template-columns: repeat(4, 1fr); /* 4 columns */ gap: 16px; /* Space between cards */ margin-bottom: 20px; } .dw-card { border: 1px solid #ddd; padding: 16px; border-radius: 8px; background-color: #f9f9f9; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } .dw-card-item { margin-bottom: 8px; } .dw-card-title { font-size: 14px; font-weight: bold; margin: 0; } .dw-card-value { font-size: 14px; margin: 0; color: #333; } .dw-card-title, .dw-card-value { word-break: break-all; } /* Pagination controls */ .pagination-controls { text-align: center; margin-top: 20px; } .prev-page, .next-page { padding: 8px 16px; background-color: #007bff; color: white; border: none; border-radius: 4px; cursor: pointer; } .prev-page:hover, .next-page:hover { background-color: #0056b3; } .current-page { margin: 0 16px; font-weight: bold; } /** Standard-Table **/ /* Ensure horizontal scrolling for tables */ .dw-checker-results-container, #dw-checker-outside-results { overflow-x: auto; /* Enable horizontal scrolling */ max-width: 100%; /* Restrict the container width */ } #dw-checker-outside-results { padding: 0; } #dw-checker-outside-results > .dt-container > .dt-layout-row:first-child { display: none; } #dw-checker-outside-results > .dt-container > .dt-layout-row:nth-child(2) { margin-top: 0; } table.dw-checker-result-table, table.dw-standard-table { width: 100%; /* Full width */ min-width: max-content; /* Ensure table expands to fit content */ border-collapse: collapse; /* Remove gaps between borders */ display: block; /* Ensure proper rendering */ table-layout: fixed; /* Prevent misalignment */ } th, td { white-space: nowrap; /* Prevent text wrapping */ padding: 8px; /* Add padding for readability */ border: 1px solid #ddd; /* Add borders for clarity */ } .dw-checker-container:has(.dt-container) .dw-checker-wrapper { padding: 0!important; background-color: unset; } .dw-checker-container:has(.dt-container) select#dt-length-2 { width: 50px; margin-right: 10px; border-radius: 8px!important; } .dw-checker-container:has(.dt-container) button.dt-paging-button { border-radius: 8px!important; } .dw-cards-container > .result-page { grid-template-columns: var(--card-output-grid-column-desktop); } @media only screen and (max-width: 820px) { .dw-cards-container > .result-page { grid-template-columns: var(--card-output-grid-column-tablet); } } @media only screen and (max-width: 482px) { .dw-cards-container > .result-page { grid-template-columns: var(--card-output-grid-column-mobile); } }