/** * @file * Styling for edit module. */ /** * Editable. */ .edit-field.edit-editable, .edit-field .edit-editable { box-shadow: 0 0 0 2px #74b7ff; } /** * Highlighted (hovered) editable. */ .edit-field.edit-highlighted, .edit-form.edit-highlighted, .edit-field .edit-highlighted { box-shadow: 0 0 0 1px #74b7ff, 0 0 0 2px #007fff; } .edit-field.edit-changed, .edit-form.edit-changed, .edit-field .edit-changed { box-shadow: 0 0 0 1px #fec17e, 0 0 0 2px #f7870a; } .edit-editing.edit-validation-error, .edit-form.edit-validation-error { box-shadow: 0 0 0px 1px #ee8b74, 0 0 0 2px #fa2209; } .edit-editing.edit-editor-is-popup { box-shadow: none; } .edit-form .form-item .error { border: 1px solid #eea0a0; } /** * Default form styling overrides. */ .edit-form form { padding: 0.5em; } .edit-form .form-item { margin: 0; } .edit-form .form-wrapper { margin: .5em; } /** * Animations. */ .edit-animate-invisible { opacity: 0; } .edit-animate-default { -webkit-transition: all .4s ease; transition: all .4s ease; } .edit-animate-slow { -webkit-transition: all .6s ease; transition: all .6s ease; } .edit-animate-delay-veryfast { -webkit-transition-delay: .05s; transition-delay: .05s; } .edit-animate-delay-fast { -webkit-transition-delay: .2s; transition-delay: .2s; } .edit-animate-disable-width { -webkit-transition: width 0s; transition: width 0s; } .edit-animate-only-visibility { -webkit-transition: opacity .2s ease; transition: opacity .2s ease; } /** * In-place editors that don't use a popup. */ .edit-validation-errors .messages.error { box-shadow: 0 0 1px 1px red, 0 0 3px 3px rgba(153, 153, 153, .5); background-color: white; } /** * Styling specific to the 'form' in-place editor. */ .edit-form { box-shadow: 0 0 30px 4px #4f4f4f; background-color: white; } /** * Toolbars. */ .edit-toolbar-container { font-family: 'Source Sans Pro','Lucida Grande', sans-serif; padding-bottom: 7px; padding-top: 7px; -webkit-transition: all 1s; transition: all 1s; } .edit-toolbar-container > .edit-toolbar-content { background-image: -webkit-linear-gradient(top, #fff, #e4e4e4); background-image: -moz-linear-gradient(top, #fff, #e4e4e4); background-image: -o-linear-gradient(top, #fff, #e4e4e4); background-image: linear-gradient(to bottom, #fff, #e4e4e4); -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; color: black; padding: 0.1667em; position: relative; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; z-index: 2; } .edit-toolbar-container > .edit-toolbar-pointer { background-color: #e4e4e4; bottom: 2px; box-shadow: 0 0 0 1px #818181, 0px 0px 0 4px rgba(150, 150, 150, 0.5); display: block; height: 16px; left: 18px; /* LTR */ position: absolute; -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); width: 16px; z-index: 1; } [dir="rtl"] .edit-toolbar-container > .edit-toolbar-pointer { left: auto; right: 18px; } .edit-toolbar-container.edit-toolbar-pointer-top > .edit-toolbar-pointer { bottom: auto; top: 2px; } .edit-toolbar-container > .edit-toolbar-lining { bottom: 7px; box-shadow: 0 0 0 1px #818181, 0px 3px 0px 1px rgba(150, 150, 150, 0.5); display: block; left: 0; position: absolute; right: 0; top: 7px; z-index: 0; } .edit-toolbar-label { font-style: italic; overflow: hidden; padding: 0.333em 0.4em; text-overflow: ellipsis; white-space: nowrap; } .edit-toolbar-label .field:after { content: ' → '; } /* The toolbar; these are not necessarily visible. */ .edit-toolbar { font-family: 'Droid sans', 'Lucida Grande', sans-serif; } .edit-toolbar-entity { padding: 0.1667em 0.2em; } /** * Info toolgroup. */ .edit-toolbar-fullwidth { width: 100%; } .edit-toolgroup.wysiwyg-floated { float: right; /* LTR */ } [dir="rtl"] .edit-toolgroup.wysiwyg-floated { float: left; } .edit-toolgroup.wysiwyg-main { clear: both; width: 100%; padding-left: 0; /* LTR */ } [dir="rtl"] .edit-toolgroup.wysiwyg-main { padding-left: 0; padding-right: 0; } /** * Buttons. */ .edit-button { background-color: #e4e4e4; border: 1px solid #d2d2d2; color: #5a5a5a; cursor: pointer; display: inline-block; margin: 0; opacity: 1; padding: 0.345em; -webkit-transition: opacity .1s ease; transition: opacity .1s ease; } .edit-button[aria-hidden="true"] { visibility: hidden; opacity: 0; } .edit-button + .edit-button { margin-left: 0.2em; /* LTR */ } [dir="rtl"] .edit-button + .edit-button { margin-left: auto; margin-right: 0.25em; } /* Button with icons. */ .edit-button:hover, .edit-button:active { background-color: #c8c8c8; border: 1px solid #a0a0a0; color: #2e2e2e; } .edit-toolbar-container .edit-button.action-cancel { background-color: transparent; border: 1px solid transparent; } .edit-button.action-save { color: white; background-color: #50a0e9; background-image: -webkit-linear-gradient(top, #50a0e9, #4481dc); background-image: -moz-linear-gradient(top, #50a0e9, #4481dc); background-image: -o-linear-gradient(top, #50a0e9, #4481dc); background-image: linear-gradient(to bottom, #50a0e9, #4481dc); border: 1px solid transparent; } .edit-button.action-save:hover, .edit-button.action-save:active { border: 1px solid #a0a0a0; } .edit-button.action-saving, .edit-button.action-saving:hover, .edit-button.action-saving:active { background-color: #e4e4e4; background-image: none; border-color: #d2d2d2; color: #5a5a5a; }