Chris@0: /**
Chris@0:  * @file
Chris@0:  * Styling for the shortcut module.
Chris@0:  */
Chris@0: 
Chris@0: /**
Chris@0:  * Toolbar.
Chris@0:  */
Chris@0: .toolbar .toolbar-tray-vertical .edit-shortcuts {
Chris@18:   padding: 1em;
Chris@0:   text-align: right; /* LTR */
Chris@0: }
Chris@0: [dir="rtl"] .toolbar .toolbar-tray-vertical .edit-shortcuts {
Chris@0:   text-align: left;
Chris@0: }
Chris@0: .toolbar .toolbar-tray-horizontal .edit-shortcuts {
Chris@0:   float: right; /* LTR */
Chris@0: }
Chris@0: [dir="rtl"] .toolbar .toolbar-tray-horizontal .edit-shortcuts {
Chris@0:   float: left;
Chris@0: }
Chris@0: 
Chris@0: /**
Chris@0:  * Add/remove links.
Chris@0:  */
Chris@0: .shortcut-action {
Chris@0:   display: inline-block;
Chris@0:   margin-left: 0.3em; /* LTR */
Chris@0: }
Chris@0: [dir="rtl"] .shortcut-action {
Chris@18:   margin-right: 0.3em;
Chris@0:   margin-left: 0;
Chris@0: }
Chris@0: .shortcut-action__message {
Chris@0:   display: inline-block;
Chris@0:   margin-left: 0.3em; /* LTR */
Chris@18:   padding: 0 5px;
Chris@18:   -webkit-transition: all 200ms ease-out;
Chris@18:   transition: all 200ms ease-out;
Chris@0:   -ms-transform: translateY(-12px);
Chris@0:   -webkit-transform: translateY(-12px);
Chris@0:   transform: translateY(-12px);
Chris@18:   opacity: 0;
Chris@18:   color: #fff;
Chris@18:   border-radius: 5px;
Chris@18:   background: #000;
Chris@18:   background: rgba(0, 0, 0, 0.5);
Chris@0:   -ms-backface-visibility: hidden;
Chris@0:   -webkit-backface-visibility: hidden;
Chris@0:   backface-visibility: hidden;
Chris@0: }
Chris@0: [dir="rtl"] .shortcut-action__message {
Chris@18:   margin-right: 0.3em;
Chris@0:   margin-left: 0;
Chris@0: }
Chris@0: .shortcut-action:hover .shortcut-action__message,
Chris@0: .shortcut-action:focus .shortcut-action__message {
Chris@0:   -ms-transform: translateY(-2px);
Chris@0:   -webkit-transform: translateY(-2px);
Chris@0:   transform: translateY(-2px);
Chris@18:   opacity: 1;
Chris@0: }