File "goals.scss"

Full path: /home/satkhirabarta/public_html/wp-content/plugins/burst-statistics/assets/css/admin/modules/wizard/goals.scss
File size: 7.68 B (7.68 KB bytes)
MIME-type: text/plain
Charset: utf-8

Download   Open   Edit   Advanced Editor &nnbsp; Back

.burst div[class^=burst-wizard-] {
  .burst-settings-goals {
    &__list {
      display: flex;
      flex-wrap: wrap;
      flex-direction: column;
      gap: var(--rsp-spacing-s);
      margin-top: var(--rsp-spacing-s);

      &__item {
        width: 100%;
        background-color: var(--rsp-grey-200);
        border-radius: var(--rsp-border-radius);

        &__fields {
          display: flex;
          flex-wrap: wrap;
          gap: var(--rsp-spacing-xl);
          padding: var(--rsp-spacing-xs) var(--rsp-spacing-l) var(--rsp-spacing-m) var(--rsp-spacing-l);
          margin-top: var(--rsp-spacing-s);

          & > * {
            width: 100%;
          }
          &__warning {
            padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
            margin: var(--rsp-spacing-xxs) 0;
            border-radius: var(--rsp-border-radius-xs);
            opacity: 1;
            transition: opacity 1.3s ease-in-out;

            color: var(--rsp-red);
            background-color: var(--rsp-red-faded);
            border: 1px solid var(--rsp-red);

            display: flex;
            gap: var(--rsp-spacing-xs);
            align-items: center;

            &.hidden {
              opacity: 0;
            }

            &.success {
              color: var(--rsp-green);
              background-color: var(--rsp-green-faded);
              border: 1px solid var(--rsp-green);
            }

            &.warning {
              color: var(--rsp-text-color);
              background-color: var(--rsp-yellow-faded);
              border: 1px solid var(--rsp-yellow);
            }
          }
        }

        details {
          //padding: var(--rsp-spacing-s) var(--rsp-spacing-s);
          border-radius: var(--rsp-border-radius);
          border: 1px solid var(--rsp-grey-300);

          summary {
            padding: var(--rsp-spacing-xxs) var(--rsp-spacing-s);
            display: grid;
            grid-template-columns: 26px 1fr auto auto auto;
            align-items: center;
            gap: var(--rsp-spacing-s);
            list-style: none;

            &::-webkit-details-marker {
              display: none;
            }

            &::marker {
              display: none;
            }

            h5 {
              font-weight: 600;
              display: inline-block;
            }

            .components-toggle-control {
              display: flex;
              align-items: center;
              margin: 0;
              .components-flex{ gap: 0 }
            }

            .burst-icon-chevron-down {
              transition: all .25s ease-in-out;
              transform: rotate(0deg);
            }
          }

          &[open] {
            summary {
              padding-bottom: var(--rsp-spacing-s);
              border-bottom: 1px solid var(--rsp-grey-300);

              .burst-icon-chevron-down {
                transform: rotate(180deg);
              }
            }
          }

          .burst-field-wrap {
            padding-inline: 0;
            padding: 0;
            padding-top: var(--rsp-spacing-m);
          }

          .burst-label {
            color: var(--rsp-text-color);
            font-size: var(--rsp-fs-400);
            font-weight: 600;
            margin-bottom: var(--rsp-spacing-xs);
          }
        }
      }
    }

    &__upgrade {
      display: flex;
      gap: var(--rsp-spacing-s);
      padding: var(--rsp-spacing-s);
      background-color: var(--rsp-grey-200);
      border-radius: var(--rsp-border-radius);
      margin-top: var(--rsp-spacing-s);
      justify-content: flex-start;
      align-items: center;
      border: 2px solid var(--rsp-grey-300);

      h5 {
        font-weight: 600;
      }

      p {
        font-size: var(--rsp-fs-200);
        color: var(--rsp-text-color-light);
      }

      .burst-button {
        margin-left: auto;
      }
    }
  }

  .burst-radio-buttons__list {

    display: grid;
    grid-template-columns: repeat(2, minmax(49%, 1fr));
    gap: var(--rsp-spacing-s);

    &__item {
      input {
        &[type='radio']{
          opacity:0;
          filter:alpha(opacity=0);
          position:absolute
        }

        &[type="radio"]:checked + label {
          background: var(--rsp-green-faded);
          border: 2px solid var(--rsp-green);
          margin: 0;
        }
      }

      label {
        background: var(--rsp-white);
        margin: 1px;
        border: 1px solid var(--rsp-input-border-color);
        outline: 1px solid transparent;
        padding: var(--rsp-spacing-xs);
        border-radius: var(--rsp-border-radius-xs);
        display: grid;
        grid-template-columns: auto auto auto 1fr;
        gap: var(--rsp-spacing-xs);
        align-items: center;
        &.burst-disabled-radio{
          background:inherit;
        }
        .burst-icon {
          width: 24px;
          height: 24px;
        }

        h5 {
          font-weight: 600;
          letter-spacing: 0.3px;
          line-height: 1;
        }

        p {
          line-height: 1;
          white-space: nowrap;
          overflow: hidden;
          text-overflow: ellipsis;
          font-size: var(--rsp-fs-200);
          color: var(--rsp-text-color-light);
        }
      }
    }
  }
  .burst-class-id, .burst-hook {
    display: flex;
    flex-wrap: wrap;
    align-content: stretch;
    gap: var(--rsp-spacing-xl);
    > * {
      width: 100%;
    }
    input[type="text"] {
      width: 100%;
      box-sizing: border-box;
    }
  }
  .burst-select{
    &__control{
      input{
        outline-style: none;
        box-shadow: none;
        border-color: transparent;
      }
    }
    &__menu{

    }
    &__custom-option{
      padding: var(--rsp-spacing-xxs) var(--rsp-spacing-xs);
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: var(--rsp-spacing-xxs);
      transition: background ease 0.2s;
      & > div{
        display: flex;
        gap: var(--rsp-spacing-xxs);
      }
      &:hover{
        background: var(--rsp-green-faded);
      }
    }

    &__title{
      font-size: var(--rsp-fs-200);
      color: var(--rsp-text-color);
    }
    &__subtitle{
      font-size: var(--rsp-fs-100);
      color: var(--rsp-text-color-light);
    }
    &__pageview-count{
      min-width: 45px;
      font-size: var(--rsp-fs-100);
      color: var(--rsp-text-color-light);
    }

  }
  .burst-click-to-edit{
    h5{
      min-width: 150px;
    }
  }
}
.MuiDialog-container .MuiPaper-rounded{
  border-radius: var(--rsp-border-radius-s);
}

.burst-settings-goals__add-goal {
  display:flex;
  .burst-button {
    margin-right:10px;
    align-self: flex-start;
    &.burst-inactive {
      color: var(--rsp-grey-400 );
    }
  }
}
.burst-button-dropdown-container {
  position:relative;
  .burst-button {
    display:flex;
    .burst-icon {
      margin-top: 6px;
      margin-left: 5px;
    }
  }
  .burst-button-dropdown {
    //todo fix this
    //@extend .burst-button;
    //@extend .burst-button--secondary;
    background: var(--rsp-grey-100);
    color: var(--rsp-text-color-light);
    border: 1px solid var(--rsp-grey-400);
    width: fit-content;
    font-size: var(--button-font-size);
    font-weight: var(--button-font-weight);
    line-height: var(--button-line-height);
    letter-spacing: var(--button-letter-spacing);
    transition: var(--button-transition);
    min-height: var(--button-min-height);
    margin: 0;
    padding: var(--button-padding);
    border-radius: var(--button-border-radius);
    text-align: center;
    cursor: pointer;
    text-decoration: none;
    &__row{
      display:flex;
      cursor:pointer;
      &.burst-inactive{
        color: var(--rsp-grey-400 );
      }
      .burst-icon {
        margin-left: 5px;
        margin-top:2px;
      }
    }

  }
}