codevise/pageflow

View on GitHub
app/assets/stylesheets/pageflow/admin/icon_button.scss

Summary

Maintainability
Test Coverage
$pageflow-icon-button-icon-directory: "pageflow/admin/icons/buttons" !default;

a.icon_button:link,
a.icon_button:visited,
a.icon_button:hover,
a.icon_button:active {
  position: relative;
  padding-left: 30px;

  &::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 9px;
    transform: translateY(-50%);
    width: $pageflow-icon-size;
    height: $pageflow-icon-size;
    background-size: $pageflow-icon-size;
    background-repeat: no-repeat;
    background-position: center;
  }

  $dir: $pageflow-icon-button-icon-directory;

  &.editor::before {
    background-image: image-url("#{$dir}/editor.svg");
  }

  &.preview::before {
    background-image: image-url("#{$dir}/preview.svg");
  }

  &.show_public::before {
    background-image: image-url("#{$dir}/show_public.svg");
  }
}