ver 1.4.0
This commit is contained in:
dwindown
317
assets/admin-editor.css
Normal file
317
assets/admin-editor.css
Normal file
@@ -0,0 +1,317 @@
|
||||
#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);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user