apostrophe/lib/modules/apostrophe-pages/public/css/user.less

The Apostrophe Content Management System.

.apos-modal.apos-reorganize-modal
{
  overflow: hidden;
}

.apos-modal ul.jqtree-tree .jqtree-toggler {
  font-size: 9px;
  margin-right: 0;
  display: inline-block;
  margin-right: 2%;
  cursor: pointer;
}

.apos-reorganize-published {
  display: inline-block;
  border-radius: 50%;
  height: 10px;
  width: 10px;
}

.apos-reorganize-published--true { background-color: @apos-green; }
.apos-reorganize-published--false { background-color: @apos-red; }



.apos-modal .apos-reorganize-tree-header {
  padding: 20px 40px;
  border-bottom: @apos-mid;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 700;
}

.apos-modal .apos-reorganize-tree
{
  padding-top: @apos-padding-2;
  background-color: @apos-white;
  overflow: auto;
  .apos-scrollbar;
  input[type="checkbox"] {
    display: inline-block;
    margin-right: 16px;
  }
}

.apos-modal .apos-reorganize-tree--chooser {
  width: 80%;
  float: right;
  @media @apos-breakpoint-desktop-xl { width: 75%; }
}


.apos-reorganize-generate-depth-indicators(50);

.apos-reorganize-generate-depth-indicators(@n, @i: 1) when (@i =< @n) {
  [data-apos-reorganize-depth="@{i}"] .jqtree-ghost {
    margin-left: (@i * 15px);
  }
  .apos-reorganize-generate-depth-indicators(@n, (@i + 1));
}

ul.jqtree-tree ul.jqtree_common { margin-left: 0;}
ul.jqtree-tree .jqtree-title { margin-left: 0; }

.apos-modal {
  .apos-reorganize-select-all {
    display: inline-block;
    width: 5%;
  }
  .apos-reorganize-title {
    display:inline-block;
    width: 45%;
  }

  .apos-reorganize-controls {
    display: inline-block;
    width: 12%;
  }
  &.apos-separate-trash {
    .apos-trash {
      .apos-reorganize-controls--edit {
        display: none;
      }
    }
  }
}
.apos-reorganize-tree .jqtree-tree
{
  .jqtree-element
  {
    padding: 10px;
    border-bottom: 1px solid @apos-light;
    white-space: nowrap;
    cursor: grab;
    .apos-transition;

    &:hover {
      background-color: @apos-light;
    }

    &:active {
      cursor: grabbing;
    }
  }

  .apos-reorganize-title--no-toggle .jqtree-title{
    padding-left: 18px;
  }
  .jqtree-title
  {
    color: @apos-black;
    display:inline-block;
  }

  .jqtree-tree > .jqtree-folder
  .jqtree-folder.jqtree-closed>ul.jqtree_common { border-color: @apos-mid; }
  .apos-reorganize-controls a
  {
    display: inline-block;
    vertical-align: middle;
    color: @apos-black;
    padding-left: @apos-padding-1;
    text-decoration: none;
    .apos-transition;
    &:hover { color: @apos-primary; }
    &.apos-visit:hover { color: @apos-primary; }
    &.apos-delete { color: @apos-delete; }
    &.apos-delete:hover { color: @apos-delete; }
    &.apos-delete-from-trash:hover { color: @apos-delete; }
  }
  .jqtree-selected .apos-reorganize-controls a { color: @apos-dark }
  li.jqtree-selected > .jqtree_common.jqtree-element,
  li.jqtree-selected > .jqtree_common.jqtree-element:hover
  {
    background: none !important;
  }
  li { .apos-transition; }
  li.jqtree-selected { background: @apos-mid; }
  .jqtree-moving > .jqtree_common.jqtree-element .jqtree-title { outline: 0; }
  .jqtree-moving { background: @apos-primary !important; }

  // Delete (move to trash) is visible by default, "empty trash"
  // (destroy forever) is only visible when already in the trash

  .apos-reorganize-controls .apos-delete-from-trash {
    display: none;
  }
  // Trash and its contents don't show a trash button,
  // or a visit button
  .apos-trash .apos-reorganize-controls {
    .apos-delete, .apos-visit {
      display: none;
    }
  }
  // Descendants of the trash show a destroy button
  .apos-trash .jqtree_common .jqtree_common {
    .apos-reorganize-controls .apos-delete-from-trash {
      display: inline-block;
    }
  }
}

.apos-schema .apos-field-apply-login-required-to-subpages
{
  // Give a sense of hierarchy, since this relates to the previous item
  margin-left: 20px;
  margin-top: -10px;
  // Don't let the LESS compiler mis-compile it, let the browser see it
  width: calc(~'100% - 20px');
}

.jqtree-folder.apos-trash,
.jqtree-element.apos-trash {
  background-color: fade(@apos-delete, 20%);
  .jqtree-element:hover {
    background-color: fade(@apos-delete, 30%);
  }
}