responsive-preview.icons.css in Responsive Theme Preview 7
Same filename and directory in other branches
Responsive preview icon styling.
File
css/responsive-preview.icons.cssView source
- /**
- * @file
- * Responsive preview icon styling.
- */
- .navbar-tab-responsive-preview .responsive-preview-icon:before,
- .responsive-preview .responsive-preview-icon:before {
- background-attachment: scroll;
- background-color: transparent;
- background-image: url("../images/responsive-preview-icons.png");
- background-repeat: no-repeat;
- content: '';
- display: block;
- position: absolute;
- z-index: 1;
- }
- .navbar-bar .navbar-tab-responsive-preview .responsive-preview-icon:before {
- width: 13px;
- }
- #navbar-administration .navbar-tab-responsive-preview button.responsive-preview-icon,
- .responsive-preview button.responsive-preview-icon {
- background-color: transparent;
- border: 0;
- font-size: 1em;
- }
-
- /* navbar icon. */
- #navbar-administration .navbar-bar .responsive-preview-icon.responsive-preview-icon-responsive-preview {
- margin-left: 0;
- margin-right: 0;
- padding-left: 0;
- padding-right: 0;
- width: 5em;
- }
- .navbar-tab-responsive-preview .responsive-preview-icon.responsive-preview-icon-responsive-preview:before {
- background-position: center top;
- }
- .navbar-tab-responsive-preview.open .responsive-preview-icon-responsive-preview:before,
- .navbar-tab-responsive-preview .responsive-preview-icon-responsive-preview.active:before,
- .navbar-tab-responsive-preview .responsive-preview-icon-responsive-preview:hover:before {
- background-position: center -22px;
- }
- .drupal-navbar .navbar-bar .navbar-tab-responsive-preview .responsive-preview-icon-responsive-preview:before {
- left: 1em; /* LTR */
- height: 22px;
- top: 0.6667em;
- }
- [dir="rtl"] .drupal-navbar .navbar-bar .navbar-tab-responsive-preview .responsive-preview-icon-responsive-preview:before {
- left: auto;
- right: 6px;
- }
- #navbar-administration .navbar-tab-responsive-preview.navbar-tab .responsive-preview-options .responsive-preview-device.responsive-preview-icon-active {
- padding: 0.5em 1.3333em;
- text-indent: 0;
- -moz-transition: padding 0.25s;
- -webkit-transition: padding 0.25s;
- transition: padding 0.25s;
- }
- #navbar-administration .navbar-tab-responsive-preview.navbar-tab .responsive-preview-options .responsive-preview-device.responsive-preview-icon-active.active {
- padding-left: 2.25em; /* LTR */
- }
- [dir="rtl"] #navbar-administration .navbar-tab-responsive-preview.navbar-tab .responsive-preview-options .responsive-preview-device.responsive-preview-icon-active.active {
- padding-left: 1.333em;
- padding-right: 2.25em;
- }
- .drupal-navbar .navbar-tab-responsive-preview.navbar-tab .responsive-preview-options .responsive-preview-device.responsive-preview-icon-active:before {
- background-position: -999px -999px;
- height: 14px;
- left: 0.667em; /* LTR */
- top: 0.5em;
- width: 13px;
- }
- [dir="rtl"] .drupal-navbar .navbar-tab-responsive-preview.navbar-tab .responsive-preview-options .responsive-preview-device.responsive-preview-icon-active:before {
- left: auto;
- right: 0.667em;
- }
- .drupal-navbar .navbar-tab-responsive-preview.navbar-tab .responsive-preview-options .responsive-preview-device.responsive-preview-icon-active.active:before {
- background-position: center -116px;
- }
-
-
- /**
- * Responsive preview controls icons.
- */
- .responsive-preview-control.responsive-preview-icon:before {
- height: 12px;
- width: 12px;
- top: 12px;
- }
- .responsive-preview-icon-close:before {
- background-position: left -44px;
- right: 9px; /* LTR */
- }
- [dir="rtl"] .responsive-preview-icon-close:before {
- left: 9px;
- right: auto;
- }
- .responsive-preview-icon-close:active:before,
- .responsive-preview-icon-close.active:before,
- .responsive-preview-icon-close:hover:before {
- background-position: left -56px;
- }
- .responsive-preview-icon-orientation:before {
- background-position: left -92px; /* LTR */
- left: 9px; /* LTR */
- }
- [dir="rtl"] .responsive-preview-icon-orientation:before {
- background-position: left -155px;
- left: auto;
- right: 9px;
- }
- .responsive-preview-icon-orientation:hover:before {
- background-position: left -104px; /* LTR */
- }
- [dir="rtl"] .responsive-preview-icon-orientation:hover:before {
- background-position: left -167px;
- }
- .responsive-preview-icon-orientation.rotated:before {
- background-position: left -68px; /* LTR */
- }
- [dir="rtl"] .responsive-preview-icon-orientation.rotated:before {
- background-position: left -131px;
- }
- .responsive-preview-icon-orientation.rotated:hover:before {
- background-position: left -80px; /* LTR */
- }
- [dir="rtl"] .responsive-preview-icon-orientation.rotated:hover:before {
- background-position: left -143px;
- }