style.css (3208B)
1 /* Styles for 'normal' meta boxes 2 -------------------------------------------------------------- */ 3 4 /* Clearfix for field */ 5 .rwmb-field { 6 display: flex; 7 } 8 .rwmb-field:not(:last-of-type) { 9 margin: 0 0 12px; 10 } 11 .rwmb-label { 12 width: 25%; 13 } 14 .rwmb-input { 15 flex: 1; 16 } 17 18 .rwmb-label > label { 19 font-weight: 600; 20 } 21 .rwmb-required { 22 color: #dc3232; 23 font-weight: bold; 24 margin-left: 3px; 25 } 26 27 .rwmb-input h4 { 28 margin: 0; 29 } 30 .rwmb-input input:not([size]), 31 .rwmb-input-group, 32 .rwmb-input select, 33 .rwmb-input .select2-container, 34 .rwmb-input textarea { 35 width: 100%; 36 } 37 .rwmb-input input[type="checkbox"], 38 .rwmb-input input[type="radio"] { 39 width: 1em; 40 } 41 .rwmb-input input[type="button"] { 42 width: auto; 43 } 44 .rwmb-textarea { 45 resize: vertical; 46 } 47 48 /* Clone */ 49 .rwmb-clone { 50 min-height: 24px; 51 margin-bottom: 12px; 52 padding-right: 24px; 53 position: relative; 54 clear: both; 55 background: #fff; 56 } 57 .rwmb-clone > input[type='radio'], 58 .rwmb-clone > input[type='checkbox'] { 59 margin: 6px 0 0 4px; 60 } 61 .rwmb-button.remove-clone { 62 text-decoration: none; 63 color: #ccc; 64 display: inline-block; 65 position: absolute; 66 top: 0; 67 right: 0; 68 width: 20px; 69 height: 20px; 70 transition: color 200ms; 71 } 72 .rwmb-button.remove-clone .dashicons { 73 font-size: 20px; 74 } 75 .rwmb-button.remove-clone:hover { 76 color: #dc3232; 77 } 78 .remove-clone:focus { 79 outline: 0; 80 box-shadow: none; 81 } 82 .rwmb-button.add-clone { 83 margin-top: 4px; 84 } 85 .rwmb-clone-icon { 86 cursor: move; 87 background: url(../img/drag_icon.gif) no-repeat; 88 height: 23px; 89 width: 15px; 90 vertical-align: top; 91 display: inline-block; 92 position: absolute; 93 left: 0; 94 top: 0; 95 } 96 .rwmb-sort-clone { 97 padding-left: 15px; 98 } 99 100 /* jQuery validation */ 101 p.rwmb-error { 102 color: #dc3232; 103 margin: 4px 0; 104 clear: both; 105 } 106 input.rwmb-error.rwmb-error, 107 textarea.rwmb-error, 108 select.rwmb-error { 109 border-color: #dc3232; 110 background: #ffebe8; 111 } 112 113 /* Utilities 114 -------------------------------------------------------------- */ 115 .rwmb-sortable-placeholder { 116 background: #fcf8e3; 117 border: 1px solid #faebcc; 118 display: block; 119 } 120 121 122 /* Styles for 'side' meta boxes 123 -------------------------------------------------------------- */ 124 #side-sortables .rwmb-field { 125 flex-direction: column; 126 } 127 #side-sortables .rwmb-label { 128 width: 100%; 129 margin-bottom: 4px; 130 } 131 132 /* Mobile style */ 133 @media (max-width: 782px) { 134 .rwmb-field { 135 flex-direction: column; 136 } 137 .rwmb-label { 138 width: 100%; 139 margin-bottom: 4px; 140 } 141 .rwmb-input input[type="radio"], 142 .rwmb-input input[type="checkbox"] { 143 width: 1.5625rem; 144 } 145 } 146 147 /* Seamless style 148 --------------------------------------------------------------*/ 149 .rwmb-seamless { 150 background: none; 151 border: none; 152 box-shadow: none; 153 } 154 .rwmb-seamless .inside { 155 padding-left: 0; 156 padding-right: 0; 157 } 158 .postbox.rwmb-seamless .hndle, 159 .postbox.rwmb-seamless .handlediv, 160 .postbox.rwmb-seamless .postbox-header { 161 display: none; 162 } 163 .rwmb-seamless .rwmb-clone { 164 background: none; 165 } 166 167 /* CSS fixes 168 --------------------------------------------------------------*/ 169 /* Fix color picker field is hidden by the post editor at after_title position. https://metabox.io/support/topic/bug-color-picker-field-is-showed-below-the-title-field/ */ 170 .postarea { 171 position: relative; 172 z-index: 0; 173 } 174 .rwmb-hidden-wrapper { 175 display: none; 176 }