kupshop/admin/static/scss/components/_wpj_overrides.scss

/**
 * WPJ CHANGES
 * --------------------------------------------------
 */

a {
   color: $primary;
   text-decoration: none;

   &:hover,
   &:focus {
      color: $primary-dark;
      text-decoration: none;
   }

   &:focus {
      outline: none;
   }

   &:hover,
   &:active {
      color: $primary-dark;
   }
}

.input-sm {
   font-size: 15px;
   line-height: 20px;
}

span.btn.btn-white a {
   color: $white;
}

body {
   color: $black;
}

body.window {
   background-color: $gray-background;
   padding: 10px 5px 0;

   > form:not(.form-fluid) {
      min-width: 970px;
   }

   > form > .container-fluid {
      padding-bottom: 43px;
      padding-right: 10px;
      padding-left: 10px;
   }
}

label {
   color: #424a55;
}

p.input-height {
   padding: 5px 0;
}

.control-label.right {
   padding-top: 4px;

   @media screen and (min-width: 1200px) {
      text-align: right;
   }
}

.control-label.text-left {
   text-align: left;
}

.form-group.horizontal {
   margin-left: -15px;
   margin-right: -15px;

   &::before,
   &::after {
      content: " ";
      display: table;
   }

   &::after {
      clear: both;
   }
}

.form-horizontal .control-label {
   padding-top: 5px;
}

ul.nav li.dropdown:hover > ul.dropdown-menu {
   display: block;
}

// vyrovnani marginu, napr. u stavu objednavky
.btn-block ~ .dropdown-menu {
   margin-top: -5px;
}

.photos .thumbnail {
   height: 140px;
}

.btn-group .btn .glyphicon {
   font-size: 12px;
}

input.form-control[type=file] {
   padding: 0;
}

.form-control:focus[readonly] {
   border-color: #aab2bd;
   box-shadow: none;
}

.bootstrap-filestyle {
   input {
      font-size: 12px;
      height: 30px;
      line-height: 1.5;
      padding: 5px 10px;
   }

   label {
      font-size: 12px;
      line-height: 1.5;
      padding: 5px 12px;
   }
}

label.btn {
   margin: 0;
}

label span.glyphicon {
   margin-right: 5px;
}

.control-label.two-lines {
   padding-top: 0;
   line-height: 1.2;

   label {
      margin-bottom: 0;
   }
}

span.product-title {
   margin-top: 5px;
   display: inline-block;
}

.img-limited {
   width: auto !important;
   max-height: 200px;
}

/*
.btn.btn-block {
   margin-bottom: 5px;
}
*/

table.table-striped .badge {
   margin-right: 5px;
}

/****** DRAG SDROP STUFF ******/
span.drag-drop-mover {
   margin-right: 10px;
   cursor: move;
   color: $primary;
   display: inline-block;

   &.disabled {
      opacity: .5;
      pointer-events: none;
   }
}

div.placeholder {
   list-style: none;
   height: 50px;
   background-color: $gray-background;
}


/* for table */
/*.table span.drag-drop-mover {
   margin: 0 10px;
   line-height: 16px;
   display: block;
   float: left;
}*/

/****** DRAG SDROP STUFF ******/

.form-control.small {
   width: auto;
   display: inline-block;
   margin: 0 3px;
   height: auto;
   line-height: normal;
   padding: 0 3px;
}

.table.table-striped.unsortable th {
   .glyphicon {
      display: none;
   }

   a,
   a:hover {
      cursor: auto;
      color: $darkgray-dark;
   }
}

.line-through {
   text-decoration: line-through;
}

.selecter {
   font-size: 15px;
   width: 100%;
   border-radius: 3px;
   color: #555;
   border: 1px solid #aab2bd;
   box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
   padding: 0 10px;
   line-height: 28px;
   height: 30px;
}

.selecter-up + .chosen-container {
   .chosen-drop {
      border-bottom: 0;
      border-top: 1px solid #66afe9;
      border-radius: 3px 3px 0 0;
      top: auto;
      bottom: 100%;
   }

   &.chosen-container-active.chosen-with-drop {
      .chosen-single {
         border-radius: 0 0 3px 3px;
      }

      .chosen-choices {
         border-radius: 0 0 3px 3px;
      }
   }
}

.input-group-btn .selecter,
.input-group-btn .chosen-container .chosen-single {
   border-bottom-right-radius: 0;
   border-top-right-radius: 0;
   border-right: 0;
}

.form-control + .input-group-btn .chosen-container .chosen-single {
   border-radius: 0 3px 3px 0;
   border-left: 0;
   border-right: 1px solid $border-color;
}

.help-block {
   font-size: 12px;
   margin-bottom: 5px;

   &.no-margin {
      margin: 0;
   }
}

.row.bottom-space {
   padding-bottom: 10px;
   padding-top: 10px;
}

[class*=col-].bottom-space {
   margin-bottom: 10px;
   margin-top: 10px;
}

.main-panel-title {
   margin: 5px 0 10px;
   font-size: 16px;
   border-bottom: 1px solid $lightgray-dark;
   padding-bottom: 8px;
   position: relative;
}

.wpj-main-panel-title {
   display: flex;
   align-items: center;
   justify-content: space-between;
   margin: 5px 0 20px;
   border-bottom: 1px solid $lightgray-dark;
   padding-bottom: 8px;

   h4 {
      margin: 0;
   }
}

.btn.btn-status {
   color: $darkgray-dark;
   border-color: #ddd;

   &.btn-active {
      box-shadow: inset 0 1px 3px rgba(0, 0, 0, .13);
      font-weight: bold;
   }
}

.btn-group .btn.btn-status:first-child {
   border-color: #ddd;
}

/* storno */
/*.table > tbody > tr.storno {
   > th,
   > td {
     // background-color: #f8e1e6 !important;
      background-color: $danger-light !important;
   }

   &:hover > th,
   &:hover > td {
    //  background-color: #f0d7dc !important;
      background-color: darken($danger-light, 5%) !important;
   }
}*/


/* doprava */
/*
.delivery {
   height: 26px !important;
   margin: -3px 0;
   line-height: 26px;
   padding: 0 10px;
   border: 1px solid #ddd;
   font-size: 12px;
   background-color: $white;
}
*/

.table.table-collapsed {
   td,
   th {
      padding-left: 7px;
      padding-right: 3px;
   }
}

.table td.no-padding {
   padding-top: 2px;
   padding-bottom: 2px;
}

/* TABULKA LIST END */

.table.sm {
   margin: 0;
   font-size: 12px;

   td, th {
      padding: 3px 10px;
      border: none;
   }

   th {
      font-weight: 700;
      text-align: right;
   }
}

/*.menu-list {
   .row {
      padding: 0;

      h5 {
         margin: 6px 5px;
         font-size: 16px;
      }
   }

   .drag-drop-mover {
      margin-top: 0;
      font-size: 16px;
      margin-right: 20px;
      position: relative;
      top: 2px;
   }

   ul.collapsed {
      display: none;
   }
}*/

.glyphicon.glyphicon-minus-sign.opener.plus::before {
   content: "\e081";
}

.bi.bi-dash-circle.opener.plus::before {
   content: "\F4FA";
}

.list-yes,
.list-no,
.list-warn {
   font-size: 15px;
   margin-left: 1px;

   i {
      display: none;
   }
}

.list-yes {
   color: $success;
}

.list-warn {
   color: $warning;
}

.list-no {
   color: $danger;
}


.window-btns {
   position: fixed;
   bottom: 0;
   left: 0;
   right: 0;
   background-color: $gray-background;
   box-sizing: border-box;
   padding: 15px 20px 10px;
   box-shadow: 0 0 3px rgba(0, 0, 0, .35);
   z-index: 99;
}

.text-disabled {
   color: #b0b0b0;

   label {
      cursor: auto;
   }
}

.badge.badge-light {
   font-weight: normal;

   &.badge-danger a, &.badge-success a {
      color: $white;
      text-decoration: underline;

      &:hover {
         text-decoration: none;
      }
   }
}

iframe.ui-dialog-content {
   width: 100% !important;
}

.form-group.form-group-flex {
   display: flex;
   align-items: center;

   .control-label {
      padding-top: 0;
      line-height: 1.1;
   }

   label {
      margin-bottom: 0;
   }
}

.row-flex {
   display: flex;
   align-items: center;

   .btn {
      margin-bottom: 0;
   }
}

// emails settigns - reserve space for ckeditor
.panel-body > .form-group {

   .inputFullWidth {
      min-height: 211px;
   }

   .placeholder-braces {
      font-size: 16px;
      line-height: 1;
   }
}

// oznacuje povinny inpu, davat uvnitr relativne pozicovaneho divu
// za input s atributem required
.required-text::after {
   content: "povinné";
   position: absolute;
   right: 20px;
   bottom: 3px;
   font-size: 10px;
   color: #bbb;
}

.help-block.required-text::after {
   bottom: 30px;
}

input:valid + .required-text::after {
   display: none;
}

.flag-container {
   padding: 18px 5px 17px;
}

.flag {
   border-radius: 3px;
   display: inline-block;
   text-transform: uppercase;
   font-size: 11px;
   font-weight: bold;
   padding: 3px 8px;

   &-beta {
      color: $white;
      background: $primary-dark;
   }
}

.nav .chosen-container-multi .chosen-choices {

   li.search-field {
      float: none;

      input[type="text"] {
         height: 28px;
         padding: 5px 10px;
         font-size: 15px;
         line-height: 18px;

         &.default {
            color: #a9a9a9 !important;
         }
      }
   }

   .search-choice {
      float: none;
      margin: 5px;
   }

   .search-choice .search-choice-close {
      padding: 0 !important;
      background-color: transparent !important;
   }
}

.nav {
   .form-control::-moz-placeholder {
      color: #a9a9a9;
      opacity: 1;
   }

   .form-control:-ms-input-placeholder {
      color: #a9a9a9;
   }

   .form-control::-webkit-input-placeholder {
      color: #a9a9a9;
   }
}

.delivery-select {
   justify-content: space-between;
   margin: 0 !important;
   padding: 0;

   label {
      flex-grow: 1;
      margin-right: 10px;
   }

   .widget-wrapper {
      display: flex;
      align-items: center;
   }

   p {
      margin-bottom: 0;
      margin-right: 10px;
   }
}

.btn.btn-text {
   background: transparent;
   color: $darkgray;
   border: 0;

   &:hover,
   &:active,
   &:focus {
      color: $primary;
      box-shadow: none;
   }
}

.input-group .form-control:first-child:last-child {
   border-radius: 3px;
}

.input-group-flex {
   display: flex;

   .form-control + .form-control {
      border-left: 0;
   }

   > .input-group-addon {
      width: auto;
   }

   .form-control {
      min-width: 0; // ff fix
   }
}

.flapRewrite .list-group-item .row {
   display: flex;
   flex-wrap: wrap;

   > div:nth-child(2) {
      flex-grow: 1;
   }

   > div:last-child {
      width: auto;
   }
}

.body-menu {

   .ui-datepicker {
      width: auto;
      min-width: 12em;

      table {
         font-size: .8em;
      }

      td span,
      td a {
         padding: .1em;
      }
   }

   .ui-datepicker-title {
      font-size: .8em;
   }

   .nav .chosen-container-multi .chosen-choices li.search-field input.default[type="text"] {
      width: 100% !important;
   }

   .tooltip-inner-help {
      min-width: 0;
   }
}

/* todo: z bootflatu - je tohle potřeba? */
.nav-tabs {
   .dropdown-toggle,
   .dropdown-toggle:hover,
   .dropdown-toggle:focus {
      color: $darkgray-dark;
   }

   li.dropdown.open .dropdown-toggle {
      color: $darkgray-dark;
      background-color: $lightgray;
   }

   li.dropdown.active.open .dropdown-toggle {
      color: $darkgray-dark;
   }

   li.dropdown.active.open .dropdown-toggle .caret,
   li.dropdown.active .dropdown-toggle .caret {
      border-top-color: $darkgray-dark;
      border-bottom-color: $darkgray-dark;
   }

   li.dropdown.open .caret,
   li.dropdown.open.active .caret,
   li.dropdown.open a:hover .caret,
   li.dropdown.open a:focus .caret,
   .dropdown-toggle .caret,
   .dropdown-toggle:hover .caret,
   .dropdown-toggle:focus .caret {
      border-top-color: $darkgray-dark;
      border-bottom-color: $darkgray-dark;
   }
}

.side-hide {
   color: $white;
   border-color: #1a1c20;
   background-color: #1c1e27;
   position: fixed;
   bottom: 10px;

   &:hover,
   &:focus,
   &:active,
   &.active {
      background-color: #252832;
      border-color: #32353e !important;
   }

   &.collapsed .glyphicon-chevron-left::before {
      content: "\e080";
   }
}

// TODO: refactor

.wpj-input-group {
   display: flex;

   .btn {
      &:first-child {
         margin-right: 30px;
      }

      &:last-child {
         margin-left: 30px;
      }
   }
}