META-INF.resources.io.richwidgets.select.pick-list.css Maven / Gradle / Ivy

Go to download
/* Red Hat Common User Experience (RCUE) */
/* Bootstrap overrides and RCUE-specific mixins */
/* Bootstrap overrides */
/* RCUE-specific */
/* Red Hat Common User Experience (RCUE) */
/* Bootstrap overrides and RCUE-specific variables */
/* Bootstrap overrides */
/* RCUE-specific */
.pick-list {
  margin-bottom: 1.81818181;
  display: table;
  padding-left: 0;
  padding-right: 0;
  outline: none;
}
.pick-list .header {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  font-weight: 500;
  line-height: 1.1;
  font-size: 16px;
  margin-top: 25px;
  margin-bottom: 12.5px;
}
.pick-list .pick-button-column {
  text-align: center;
  z-index: 1;
}
.pick-list .btn-group-picklist > .btn {
  display: block;
  border-radius: 0;
  padding: 0;
  text-align: center;
}
.pick-list .btn-group-picklist .labeled {
  text-align: left;
  padding-left: 0.5em;
}
.pick-list .btn-group-picklist .labeled span {
  padding-left: 0.5em;
  padding-right: 0.5em;
}
@media (min-width: 768px) {
  .pick-list .inner {
    display: table-row;
  }
  .pick-list .ordering-list .header {
    display: none;
  }
  .pick-list .source-wrapper {
    display: table-cell;
    width: 50%;
    vertical-align: top;
  }
  .pick-list .target-wrapper {
    display: table-cell;
    width: 50%;
    vertical-align: top;
  }
  .pick-list .pick-button-column {
    padding: 5px;
    display: table-cell;
    vertical-align: top;
  }
  .pick-list .header-row {
    display: table-row;
  }
  .pick-list .sub-header-row {
    display: table-row;
  }
  .pick-list .sub-header-row .source {
    display: table-cell;
  }
  .pick-list .sub-header-row .middle {
    display: table-cell;
  }
  .pick-list .sub-header-row .target {
    display: table-cell;
  }
  .pick-list .btn-group-picklist {
    flex-direction: column;
    display: flex;
  }
  .pick-list .btn-group-picklist > .btn {
    min-width: 2.3em;
    height: 2.3em;
  }
  .pick-list .btn-group-picklist > .btn:first-child {
    border-top-right-radius: 1px;
    border-top-left-radius: 1px;
  }
  .pick-list .btn-group-picklist > .btn:last-child {
    border-bottom-right-radius: 1px;
    border-bottom-left-radius: 1px;
  }
  .pick-list .btn-group-picklist .richicon-left-all:before {
    content: "\f100";
  }
  .pick-list .btn-group-picklist .richicon-left:before {
    content: "\f104";
  }
  .pick-list .btn-group-picklist .richicon-right:before {
    content: "\f105";
  }
  .pick-list .btn-group-picklist .richicon-right-all:before {
    content: "\f101";
  }
}
@media (max-width: 767px) {
  .pick-list {
    width: 100%;
  }
  .pick-list .inner {
    width: 100%;
  }
  .pick-list .source-wrapper {
    width: 100%;
  }
  .pick-list .target-wrapper {
    width: 100%;
  }
  .pick-list .pick-button-column {
    width: 100%;
  }
  .pick-list .header-row {
    width: 100%;
  }
  .pick-list .sub-header-row {
    display: none;
  }
  .pick-list .btn-group-picklist {
    max-width: none;
  }
  .pick-list .btn-group-picklist > .btn {
    display: inline-block;
    width: 25%;
    height: 3em;
    max-width: none;
  }
  .pick-list .btn-group-picklist > .btn:first-child {
    border-bottom-left-radius: 1px;
    border-top-left-radius: 1px;
  }
  .pick-list .btn-group-picklist > .btn:last-child {
    border-bottom-right-radius: 1px;
    border-top-right-radius: 1px;
  }
  .pick-list .btn-group-picklist .richicon-left-all:before {
    content: "\f102";
  }
  .pick-list .btn-group-picklist .richicon-left:before {
    content: "\f106";
  }
  .pick-list .btn-group-picklist .richicon-right:before {
    content: "\f107";
  }
  .pick-list .btn-group-picklist .richicon-right-all:before {
    content: "\f103";
  }
}