Ontica/Empiria.Land.Intranet

View on GitHub
src/styles/explorer.scss

Summary

Maintainability
Test Coverage
/**
 * @license
 * Copyright (c) La Vía Óntica SC, Ontica LLC and contributors. All rights reserved.
 *
 * See LICENSE.txt in the project root for complete license information.
 */

.explorer {
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  padding: 8px;
  height: 100%;

  > :not(:last-child) {
    margin-right: 32px;
  }

  .primary {
    flex: 1 1 600px;
    min-width: 400px;
    max-width: 960px;
  }

  .primary-resizable {
    position: relative;
    min-width: 600px;
    max-width: calc(100% - 600px);
    width: 960px;
  }

  .primary-resizable::after {
    position: absolute;
    background: $border-color-dark;
    border: 1px solid $border-color-dark;
    border-radius: 5px;
    content: ". . .";
    writing-mode: vertical-lr;
    color: $border-color-light;
    width: 10px;
    padding: 10px 0;
    top: 50%;
    right: 0;
    left: 100%;
    margin: auto;
  }

  .primary-resizable.primary-floating::after {
    margin-right: -15px;
  }


  .primary-resizable-disable-md {

    @include medium() {

      flex: 1 1 600px;
      min-width: 400px;
      max-width: 960px;

      &::after {
        display: none;
      }

    }

  }

  .secondary {
    flex: 1 1 600px;
    min-width: 400px;
    max-width: 960px;
  }

  .priority {
    flex: 3 1 600px;
    max-width: 1085px;
  }
}

.explorer.fluid {
  height: 100%;
  margin: 0;
  padding: 0;
  background-color: #f4f6f6;

  .primary,
  .secondary {
    width: 960px;
  }
}