annotate core/modules/quickedit/css/quickedit.theme.css @ 14:1fec387a4317

Update Drupal core to 8.5.2 via Composer
author Chris Cannam
date Mon, 23 Apr 2018 09:46:53 +0100
parents 4c8ae668cc8c
children af1871eacc83
rev   line source
Chris@0 1 /**
Chris@0 2 * @file
Chris@0 3 * Styling for Quick Edit module.
Chris@0 4 */
Chris@0 5
Chris@0 6 /**
Chris@0 7 * Editable.
Chris@0 8 */
Chris@0 9 .quickedit-field.quickedit-editable,
Chris@0 10 .quickedit-field .quickedit-editable {
Chris@0 11 box-shadow: 0 0 0 2px #74b7ff;
Chris@0 12 }
Chris@0 13
Chris@0 14 /**
Chris@0 15 * Highlighted (hovered) editable.
Chris@0 16 */
Chris@0 17 .quickedit-field.quickedit-highlighted,
Chris@0 18 .quickedit-form.quickedit-highlighted,
Chris@0 19 .quickedit-field .quickedit-highlighted {
Chris@0 20 box-shadow: 0 0 0 1px #74b7ff, 0 0 0 2px #007fff;
Chris@0 21 }
Chris@0 22 .quickedit-field.quickedit-changed,
Chris@0 23 .quickedit-form.quickedit-changed,
Chris@0 24 .quickedit-field .quickedit-changed {
Chris@0 25 box-shadow: 0 0 0 1px #fec17e, 0 0 0 2px #f7870a;
Chris@0 26 }
Chris@0 27 .quickedit-editing.quickedit-validation-error,
Chris@0 28 .quickedit-form.quickedit-validation-error {
Chris@14 29 box-shadow: 0 0 0 1px #ee8b74, 0 0 0 2px #fa2209;
Chris@0 30 }
Chris@0 31 .quickedit-editing.quickedit-editor-is-popup {
Chris@0 32 box-shadow: none;
Chris@0 33 }
Chris@0 34 .quickedit-form .form-item .error {
Chris@0 35 border: 1px solid #eea0a0;
Chris@0 36 }
Chris@0 37
Chris@0 38 /**
Chris@0 39 * Default form styling overrides.
Chris@0 40 */
Chris@0 41 .quickedit-form form {
Chris@0 42 padding: 0.5em;
Chris@0 43 }
Chris@0 44 .quickedit-form .form-item {
Chris@0 45 margin: 0;
Chris@0 46 }
Chris@0 47 .quickedit-form .form-wrapper {
Chris@14 48 margin: 0.5em;
Chris@0 49 }
Chris@0 50
Chris@0 51 /**
Chris@0 52 * Animations.
Chris@0 53 */
Chris@0 54 .quickedit-animate-invisible {
Chris@0 55 opacity: 0;
Chris@0 56 }
Chris@0 57 .quickedit-animate-default {
Chris@14 58 -webkit-transition: all 0.4s ease;
Chris@14 59 transition: all 0.4s ease;
Chris@0 60 }
Chris@0 61 .quickedit-animate-slow {
Chris@14 62 -webkit-transition: all 0.6s ease;
Chris@14 63 transition: all 0.6s ease;
Chris@0 64 }
Chris@0 65 .quickedit-animate-delay-veryfast {
Chris@14 66 -webkit-transition-delay: 0.05s;
Chris@14 67 transition-delay: 0.05s;
Chris@0 68 }
Chris@0 69 .quickedit-animate-delay-fast {
Chris@14 70 -webkit-transition-delay: 0.2s;
Chris@14 71 transition-delay: 0.2s;
Chris@0 72 }
Chris@0 73 .quickedit-animate-disable-width {
Chris@0 74 -webkit-transition: width 0s;
Chris@0 75 transition: width 0s;
Chris@0 76 }
Chris@0 77 .quickedit-animate-only-visibility {
Chris@14 78 -webkit-transition: opacity 0.2s ease;
Chris@14 79 transition: opacity 0.2s ease;
Chris@0 80 }
Chris@0 81
Chris@0 82 /**
Chris@0 83 * In-place editors that don't use a popup.
Chris@0 84 */
Chris@0 85 .quickedit-validation-errors .messages.error {
Chris@14 86 box-shadow: 0 0 1px 1px red, 0 0 3px 3px rgba(153, 153, 153, 0.5);
Chris@0 87 background-color: white;
Chris@0 88 }
Chris@0 89
Chris@0 90 /**
Chris@0 91 * Styling specific to the 'form' in-place editor.
Chris@0 92 */
Chris@0 93 .quickedit-form {
Chris@0 94 box-shadow: 0 0 30px 4px #4f4f4f;
Chris@0 95 background-color: white;
Chris@0 96 }
Chris@0 97
Chris@0 98 /**
Chris@0 99 * Toolbars.
Chris@0 100 */
Chris@0 101 .quickedit-toolbar-container {
Chris@0 102 font-family: 'Source Sans Pro', 'Lucida Grande', sans-serif;
Chris@0 103 padding-bottom: 7px;
Chris@0 104 padding-top: 7px;
Chris@0 105 -webkit-transition: all 1s;
Chris@0 106 transition: all 1s;
Chris@0 107 }
Chris@0 108 .quickedit-toolbar-container > .quickedit-toolbar-content {
Chris@0 109 background-image: -webkit-linear-gradient(top, #fff, #e4e4e4);
Chris@14 110 background-image: linear-gradient(to bottom, #fff, #e4e4e4);
Chris@0 111 box-sizing: border-box;
Chris@0 112 color: black;
Chris@0 113 padding: 0.1667em;
Chris@0 114 position: relative;
Chris@0 115 -webkit-user-select: none;
Chris@0 116 -moz-user-select: none;
Chris@0 117 -ms-user-select: none;
Chris@0 118 user-select: none;
Chris@0 119 z-index: 2;
Chris@0 120 }
Chris@0 121 .quickedit-toolbar-container > .quickedit-toolbar-pointer {
Chris@0 122 background-color: #e4e4e4;
Chris@0 123 bottom: 2px;
Chris@14 124 box-shadow: 0 0 0 1px #818181, 0 0 0 4px rgba(150, 150, 150, 0.5);
Chris@0 125 display: block;
Chris@0 126 height: 16px;
Chris@0 127 left: 18px; /* LTR */
Chris@0 128 position: absolute;
Chris@0 129 -webkit-transform: rotate(45deg);
Chris@0 130 -ms-transform: rotate(45deg);
Chris@0 131 transform: rotate(45deg);
Chris@0 132 width: 16px;
Chris@0 133 z-index: 1;
Chris@0 134 }
Chris@0 135 [dir="rtl"] .quickedit-toolbar-container > .quickedit-toolbar-pointer {
Chris@0 136 left: auto;
Chris@0 137 right: 18px;
Chris@0 138 }
Chris@0 139 .quickedit-toolbar-container.quickedit-toolbar-pointer-top > .quickedit-toolbar-pointer {
Chris@0 140 bottom: auto;
Chris@0 141 top: 2px;
Chris@0 142 }
Chris@0 143 .quickedit-toolbar-container > .quickedit-toolbar-lining {
Chris@0 144 bottom: 7px;
Chris@14 145 box-shadow: 0 0 0 1px #818181, 0 3px 0 1px rgba(150, 150, 150, 0.5);
Chris@0 146 display: block;
Chris@0 147 left: 0;
Chris@0 148 position: absolute;
Chris@0 149 right: 0;
Chris@0 150 top: 7px;
Chris@0 151 z-index: 0;
Chris@0 152 }
Chris@0 153
Chris@0 154 .quickedit-toolbar-label {
Chris@0 155 font-style: italic;
Chris@0 156 overflow: hidden;
Chris@0 157 padding: 0.333em 0.4em;
Chris@0 158 text-overflow: ellipsis;
Chris@0 159 white-space: nowrap;
Chris@0 160 }
Chris@0 161 .quickedit-toolbar-label .field:after {
Chris@0 162 content: ' → '; /* LTR */
Chris@0 163 }
Chris@0 164
Chris@0 165 [dir="rtl"] .quickedit-toolbar-label .field:after {
Chris@0 166 content: ' ← ';
Chris@0 167 }
Chris@0 168
Chris@0 169 /* The toolbar; these are not necessarily visible. */
Chris@0 170 .quickedit-toolbar {
Chris@0 171 font-family: 'Droid sans', 'Lucida Grande', sans-serif;
Chris@0 172 }
Chris@0 173 .quickedit-toolbar-entity {
Chris@0 174 padding: 0.1667em 0.2em;
Chris@0 175 }
Chris@0 176
Chris@0 177 /**
Chris@0 178 * Info toolgroup.
Chris@0 179 */
Chris@0 180 .quickedit-toolbar-fullwidth {
Chris@0 181 width: 100%;
Chris@0 182 }
Chris@0 183 .quickedit-toolgroup.wysiwyg-floated {
Chris@0 184 float: right; /* LTR */
Chris@0 185 }
Chris@0 186 [dir="rtl"] .quickedit-toolgroup.wysiwyg-floated {
Chris@0 187 float: left;
Chris@0 188 }
Chris@0 189 .quickedit-toolgroup.wysiwyg-main {
Chris@0 190 clear: both;
Chris@0 191 width: 100%;
Chris@0 192 padding-left: 0; /* LTR */
Chris@0 193 }
Chris@0 194 [dir="rtl"] .quickedit-toolgroup.wysiwyg-main {
Chris@0 195 padding-left: 0;
Chris@0 196 padding-right: 0;
Chris@0 197 }
Chris@0 198
Chris@0 199 /**
Chris@0 200 * Buttons.
Chris@0 201 */
Chris@0 202 .quickedit-button {
Chris@0 203 background-color: #e4e4e4;
Chris@0 204 border: 1px solid #d2d2d2;
Chris@0 205 color: #5a5a5a;
Chris@0 206 cursor: pointer;
Chris@0 207 display: inline-block;
Chris@0 208 margin: 0;
Chris@0 209 opacity: 1;
Chris@0 210 padding: 0.345em;
Chris@14 211 -webkit-transition: opacity 0.1s ease;
Chris@14 212 transition: opacity 0.1s ease;
Chris@0 213 }
Chris@0 214 .quickedit-button[aria-hidden="true"] {
Chris@0 215 visibility: hidden;
Chris@0 216 opacity: 0;
Chris@0 217 }
Chris@0 218 .quickedit-button + .quickedit-button {
Chris@0 219 margin-left: 0.2em; /* LTR */
Chris@0 220 }
Chris@0 221 [dir="rtl"] .quickedit-button + .quickedit-button {
Chris@0 222 margin-left: auto;
Chris@0 223 margin-right: 0.25em;
Chris@0 224 }
Chris@0 225 /* Button with icons. */
Chris@0 226 .quickedit-button:hover,
Chris@0 227 .quickedit-button:active {
Chris@0 228 background-color: #c8c8c8;
Chris@0 229 border: 1px solid #a0a0a0;
Chris@0 230 color: #2e2e2e;
Chris@0 231 }
Chris@0 232 .quickedit-toolbar-container .quickedit-button.action-cancel {
Chris@0 233 background-color: transparent;
Chris@0 234 border: 1px solid transparent;
Chris@0 235 }
Chris@0 236 .quickedit-button.action-save {
Chris@0 237 color: white;
Chris@0 238 background-color: #50a0e9;
Chris@0 239 background-image: -webkit-linear-gradient(top, #50a0e9, #4481dc);
Chris@14 240 background-image: linear-gradient(to bottom, #50a0e9, #4481dc);
Chris@0 241 border: 1px solid transparent;
Chris@0 242 }
Chris@0 243 .quickedit-button.action-save:hover,
Chris@0 244 .quickedit-button.action-save:active {
Chris@0 245 border: 1px solid #a0a0a0;
Chris@0 246 }
Chris@0 247 .quickedit-button.action-saving,
Chris@0 248 .quickedit-button.action-saving:hover,
Chris@0 249 .quickedit-button.action-saving:active {
Chris@0 250 background-color: #e4e4e4;
Chris@0 251 background-image: none;
Chris@0 252 border-color: #d2d2d2;
Chris@0 253 color: #5a5a5a;
Chris@0 254 }