20 > .redactorAutosaveNotice {
21 background-color: $wcfContentBackground;
22 border: 1px solid $wcfContentBorderInner;
23 border-width: 1px 0 0 1px;
26 padding: $wcfGapSmall;
29 transition: visibility 0s linear .3s, opacity .3s linear;
38 &.redactorAutosaveNoticeIcons > span.fa-check {
39 margin-right: $wcfGapSmall;
42 > span.redactorAutosaveMessage {
43 padding: 0 $wcfGapSmall;
49 border: 1px solid $wcfContentBorderInner;
69 // enforce styles used in messages
72 // remove margin top for the first paragraph in the editor to avoid a weird looking offset a the top
78 // TODO: the border was required for 'Old Redactor', check if it is still a thing
79 border: 1px solid transparent;
83 // TODO: this is somewhat out of sync
85 border-collapse: collapse;
86 //font-size: 14px; TODO
90 border: 1px solid #ddd;
100 content: attr(data-quote-header);
106 @extend .wcfFontHeadline;
110 content: $fa-var-pencil;
111 font-family: FontAwesome;
112 font-size: $wcfFontSizeHeadline; // TODO
123 .redactorEditCodeBox {
124 background-color: rgba(255, 255, 255, .8);
132 transition: opacity .2s linear;
141 transform: translate(-50%, -50%);
145 &:hover .redactorEditCodeBox {
155 &.TODO_msie .quoteBox {
156 /* resets 'hasLayout' causing IE to display resize handle and wonky editing behavior */
166 /* we cannot influence the actual dropdown position as set by Redactor,
167 forces a gap while keeping the inline top-attribute unaffected */
168 transform: translateY(3px);
171 background-color: transparent !important;
175 background-color: $wcfDropdownBackgroundActive;
179 .redactor-dropdown-link-inactive {
184 background-color: transparent !important;
185 color: $wcfDropdownText !important;
190 /* disable auto zoom in mobile safari */
191 @media only screen and (max-width: 800px) {
192 .redactor-editor + textarea {
199 background-color: $wcfHeaderBackground;
213 background-color: $wcfHeaderMenuBackground;
214 color: $wcfHeaderMenuLink;
219 text-decoration: none;
221 @extend .wcfFontSmall;
223 &.redactor-button-disabled,
224 &.redactor-button-disabled:before,
225 &.redactor-button-disabled > i:before {
226 color: $wcfButtonDisabledText;
232 background-color: $wcfHeaderMenuBackgroundActive;
233 color: $wcfHeaderMenuLinkActive;
239 .redactor-toolbar-tooltip {
240 @extend .balloonTooltip;
246 // TODO: border-color: $wcfTooltipBackgroundColor transparent;
248 border-width: 0 5px 5px;
254 transform: translateX(-50%);
267 text-decoration: underline !important;
271 text-decoration: line-through !important;
274 #redactor-image-box {
275 border: 1px dashed rgba(0, 0, 0, .5);
276 display: inline-block;
287 #redactor-image-editter {
288 @extend .balloonTooltip;
292 // TODO: line-height: $wcfSmallFontSize;
300 #redactor-image-resizer {
301 background-color: rgba(0, 0, 0, 1);
302 border: 1px solid rgba(255, 255, 255, 1);
313 .redactorAttachmentContainer {
314 background-color: rgba(255, 255, 255, 1);
315 border: 1px solid rgba(238, 238, 238, 1);
317 padding: 7px 14px 7px;
320 .redactor-dropdown-box-fontcolor {
323 > li.redactorColorPallet {
327 background-color: $wcfDropdownBackground !important;
331 border: 2px solid rgba(255, 255, 255, 1);
332 border-bottom-width: 0;
333 display: inline-block;
334 font-size: 0; // TODO
344 background-color: rgba(255, 255, 204, 1);
345 border: 5px dashed rgba(255, 204, 0);
346 box-sizing: border-box;
347 font-size: 1.4rem; // TODO
350 vertical-align: middle;
354 background-color: #CEF6CE;
355 border-color: #04B404;
359 .redactor-link-tooltip {
360 // TODO: background-color: $wcfTooltipBackgroundColor;
362 // TODO: color: $wcfTooltipColor;
363 // TODO: font-size: $wcfSmallFontSize;
364 padding: 5px 10px 7px;
368 @include boxShadow(0, 3px, rgba(0, 0, 0, .3), 7px);
371 // TODO: color: $wcfTooltipColor;
375 .redactor-voice-label {