| | |
| | | } |
| | | |
| | | .field { |
| | | margin: 2rem 0; |
| | | padding: 2rem 0; |
| | | border: 2px solid var(--base); |
| | | border-left: 0; |
| | | border-right: 0; |
| | | position: relative; |
| | | } |
| | | |
| | |
| | | color: var(--contrast-200); |
| | | opacity: .8; |
| | | } |
| | | |
| | | .radio-options.status label { |
| | | .radio-options[data-field="post_status"] fieldset { |
| | | display: flex; |
| | | width: 100%; |
| | | } |
| | | .radio-options[data-field="post_status"] label { |
| | | padding: 0 .5rem; |
| | | } |
| | | |
| | |
| | | margin-left: auto; |
| | | } |
| | | |
| | | .repeater .field-input-wrapper { |
| | | flex-direction: column; |
| | | } |
| | | .repeater .repeater-items { |
| | | width: 100%; |
| | | |
| | | } |
| | | |
| | | .remove-row, |
| | | .add-repeater-row { |
| | | margin-left: auto; |
| | | min-height: 0; |
| | | height: var(--chipchip); |
| | | background-color: var(--action-0); |
| | | } |
| | | |
| | | |
| | | /******************************************************* |
| | | UPLOADER |
| | |
| | | Tag Field |
| | | */ |
| | | /* Tag List Field */ |
| | | .field.tag-list .tag-input-row { |
| | | display: flex; |
| | | gap: 0.5rem; |
| | | align-items: flex-start; |
| | | .field.tag-list .row { |
| | | margin-bottom: 1rem; |
| | | flex-wrap: wrap; |
| | | } |
| | | |
| | | .field.tag-list .tag-input-row .field { |
| | | .field.tag-list .row .field { |
| | | flex: 1; |
| | | min-width: 150px; |
| | | margin: 0; |
| | | } |
| | | |
| | | .field.tag-list .tag-input-row .add-tag-item { |
| | | .field.tag-list .tag .add-tag-item { |
| | | flex-shrink: 0; |
| | | white-space: nowrap; |
| | | margin-top: calc(var(--txt-medium) + 1rem); |
| | |
| | | } |
| | | |
| | | @media (max-width: 768px) { |
| | | .field.tag-list .tag-input-row { |
| | | .field.tag-list .tag { |
| | | flex-direction: column; |
| | | align-items: stretch; |
| | | } |
| | | |
| | | .field.tag-list .tag-input-row .field { |
| | | .field.tag-list .tag .field { |
| | | min-width: 100%; |
| | | } |
| | | } |
| | | |
| | | .pendingChanges { |
| | | position: fixed; |
| | | bottom: var(--btn); |
| | | right: var(--btn_); |
| | | margin-right: 1rem; |
| | | padding: 1rem; |
| | | border-radius: var(--radius); |
| | | background-color: rgba(var(--base-rgb),var(--op-6)); |
| | | z-index: var(--z-6); |
| | | width: 50vw; |
| | | animation: fadeInSlideUp 0.5s ease-out forwards; |
| | | } |
| | | .pendingChanges button { |
| | | min-height: 0; |
| | | width: calc(50% - .7rem); |
| | | padding: .35rem; |
| | | } |
| | | @keyframes fadeInSlideUp { |
| | | from { |
| | | opacity: 0; |
| | | transform: translateY(20px); /* Start 20px below its final position */ |
| | | } |
| | | to { |
| | | opacity: 1; |
| | | transform: translateY(0); /* End at its normal position */ |
| | | } |
| | | } |