@vixcom/ui 1.7.2 → 1.7.4

package/src/styles/helper/primefaces.scss

@@ -1,511 +0,0 @@
-@import '../mixins';
-
-.p-component {
-  &,
-  [class^='p-']:not(.pi) {
-    font: {
-      /* size: var(--o-font-size); */
-      size: inherit;
-      weight: inherit;
-    }
-  }
-
-  // * {
-  //   font-family: inherit;
-  // }
-}
-
-.p-steps {
-  .p-steps-item {
-    &.p-highlight .p-steps-number {
-      background-color: var(--secondary);
-    }
-
-    .p-steps-number {
-      background-color: var(--primary);
-      color: var(--white);
-    }
-  }
-}
-
-.p-tabview {
-  &.no-header .p-tabview-nav {
-    display: none;
-  }
-
-  & &-nav {
-    align-items: stretch;
-    flex-wrap: nowrap;
-    overflow-x: scroll;
-    border: none;
-
-    li {
-      min-width: 20%;
-
-      &.p-highlight {
-        min-width: 30%;
-      }
-
-      .p-tabview-nav-link {
-        height: 100%;
-      }
-    }
-  }
-}
-
-.p-tabmenu {
-  &-nav {
-    align-items: flex-end;
-  }
-}
-
-.p-dialog-mask,
-.p-component-overlay,
-.p-dialog-mask.p-component-overlay {
-  z-index: 4;
-}
-
-.p-dialog {
-  min-width: 50%;
-  max-width: 95%;
-  max-height: 95%;
-  z-index: 1;
-
-  .p-confirm-dialog .p-confirm-dialog-icon {
-    font-size: 300%;
-  }
-
-  &-header {
-    display: flex;
-    align-items: center;
-    border-top-left-radius: inherit;
-    border-top-right-radius: inherit;
-
-    &-close:hover {
-      color: var(--danger);
-    }
-    &-icons button {
-      min-width: unset;
-    }
-  }
-
-  &-content {
-    padding: 0.25rem 1.5rem;
-    align-items: unset;
-
-    .p-confirm-dialog-message {
-      white-space: pre-wrap;
-    }
-  }
-
-  &-footer {
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: flex-end;
-    border-bottom-left-radius: inherit;
-    border-bottom-right-radius: inherit;
-    padding: 1.5rem;
-    gap: 0.5rem;
-
-    button {
-      margin: 0;
-    }
-  }
-}
-
-.p-overlaypanel {
-  display: flex;
-  flex-direction: column;
-  max-width: 100%;
-  max-height: 100%;
-  z-index: 1;
-
-  .p-overlaypanel-content {
-    display: flex;
-    flex-direction: column;
-    min-height: 100%;
-
-    & > {
-      header,
-      footer {
-        display: flex;
-        align-items: center;
-        gap: 1rem;
-      }
-    }
-  }
-}
-
-.p-dialog,
-.p-overlaypanel {
-  ul {
-    list-style: inside;
-  }
-}
-
-.p-toast {
-  z-index: 5;
-}
-
-.p-badge {
-  font-size: 0.75rem;
-}
-
-.p-float-label {
-  &,
-  &.p-inputgroup {
-    display: flex;
-  }
-
-  :focus,
-  .p-filled {
-    ~ label {
-      top: 0;
-      transform: translateY(-100%);
-    }
-  }
-
-  label {
-    margin-top: 0;
-    /* top: 50%; */
-    left: 0;
-    padding: 0.25rem;
-    transform: translateY(-50%);
-
-    &.bottom {
-      transform: translateY(100%);
-      top: unset;
-      bottom: 0;
-    }
-  }
-
-  .p-dropdown .p-placeholder {
-    opacity: 1;
-  }
-}
-
-.input > .p-inputtext {
-  padding: 0;
-  color: unset;
-  font-size: unset;
-}
-
-.p-input-icon-left,
-.p-input-icon-right {
-  display: flex;
-  align-items: center;
-
-  i {
-    display: flex;
-    align-items: center;
-    position: absolute;
-    top: unset;
-    margin-top: 0;
-  }
-}
-
-.p-inputgroup {
-  .p-button {
-    width: unset;
-  }
-}
-
-.p-dropdown-panel {
-  width: 1px;
-}
-
-.p-dropdown {
-  border-radius: var(--border-radius);
-
-  & &-label {
-    /* display: flex; */
-  }
-}
-
-.p-inputswitch {
-  position: relative;
-  height: 1.5rem;
-
-  .p-inputswitch-slider {
-    display: block;
-    height: 100%;
-
-    :before {
-      width: 1rem;
-      height: 1rem;
-      top: 50%;
-      transform: translate(0, -50%);
-    }
-  }
-}
-
-.p-dropdown,
-.p-calendar,
-.p-password,
-.p-inputtext,
-.p-inputnumber {
-  width: 100%;
-  flex: 1 1 auto;
-}
-
-p-chart {
-  width: 100%;
-
-  canvas {
-    width: 100%;
-    min-width: 100%;
-  }
-}
-
-.p-datepicker {
-  min-width: unset;
-
-  .p-datepicker-header {
-    .p-datepicker-month {
-      border: none;
-    }
-  }
-
-  &:not(.p-datepicker-inline) {
-    box-shadow: unset;
-
-    & > * {
-      position: relative;
-    }
-
-    &::before {
-      content: '';
-      display: block;
-      height: 100%;
-      width: 100%;
-      position: absolute;
-      box-shadow: var(--card-shadow);
-      border-radius: inherit;
-      top: 0;
-      left: 0;
-      z-index: 0;
-    }
-  }
-
-  .p-datepicker-buttonbar {
-    padding: 0;
-  }
-
-  .p-timepicker span {
-    font-size: inherit;
-  }
-
-  table td > span {
-    width: 2.25rem;
-    height: 2.25rem;
-  }
-}
-
-.p-panel {
-  > {
-    :first-child {
-      border-top-left-radius: inherit;
-      border-top-right-radius: inherit;
-    }
-
-    :last-child {
-      border-bottom-left-radius: inherit;
-      border-bottom-right-radius: inherit;
-    }
-  }
-
-  & + .p-panel {
-    margin-top: 1rem;
-  }
-}
-
-.p-timeline-horizontal {
-  &.p-timeline-left .p-timeline-event-opposite {
-    text-align: left;
-  }
-  &.p-timeline-right .p-timeline-event-opposite {
-    text-align: right;
-  }
-}
-
-.p-accordion {
-  .p-accordion-header-link {
-    border-radius: inherit;
-  }
-
-  // &:not(.default) {
-  //   .p-accordion-header-link {
-  //     padding: 0.75rem;
-  //   }
-
-  //   .p-accordion-content {
-  //     padding: 0;
-  //   }
-  // }
-}
-
-.p-carousel {
-  width: 100%;
-
-  &-container {
-    position: relative;
-
-    .p-carousel-prev,
-    .p-carousel-next {
-      position: absolute;
-      box-shadow: var(--card-shadow);
-      z-index: 1;
-    }
-
-    .p-carousel-next {
-      right: 0;
-    }
-  }
-
-  &-items-content {
-    /* padding: 1rem; */
-    position: relative;
-    z-index: 0;
-
-    .p-carousel-items-container {
-      gap: 0.5rem;
-
-      .p-carousel-item {
-        display: flex;
-        justify-content: center;
-        /* padding: 0 0.5rem; */
-        /* border: thin solid transparent; */
-
-        &:hover {
-          border-color: var(--primary);
-        }
-      }
-    }
-
-    .p-carousel-item-active:nth-of-type(2) {
-      /* padding: 0 0.125rem; */
-      // transform: scale(1.25);
-    }
-  }
-
-  .p-carousel-indicators {
-    .p-carousel-indicator button {
-      border: none;
-      height: 0.25rem;
-      border-radius: 0.125rem;
-    }
-  }
-}
-
-.p-paginator {
-  background-color: unset;
-  padding: 0;
-
-  .p-inputwrapper {
-    width: unset;
-  }
-
-  &-left-content {
-    margin-right: none;
-  }
-
-  &-right-content {
-    margin-left: none;
-  }
-}
-
-.p-datatable {
-  &-header {
-    display: flex;
-    flex-wrap: wrap;
-    gap: 1rem;
-  }
-
-  &-thead {
-    text-transform: capitalize;
-  }
-
-  &-thead > tr > th,
-  &-tbody > tr > td {
-    /* max-width: 1px; */
-    padding: 0.5rem;
-
-    .p-row-toggler {
-      min-width: unset;
-    }
-  }
-  tr.p-datatable-row-expansion > td {
-    padding: {
-      left: 5%;
-      right: 5%;
-    }
-  }
-}
-
-.p-message {
-  .p-message-wrapper {
-    flex-wrap: wrap;
-    gap: 1rem;
-  }
-}
-
-.p-toast .p-toast-message {
-  .p-toast-icon-close {
-    min-width: 2rem;
-    border: none;
-  }
-}
-
-.p-selectbutton {
-  display: flex;
-
-  > .p-button {
-    /* flex: 1 1 100%; */
-    // padding: 1rem;
-  }
-}
-
-.p-button {
-  width: unset;
-  /* min-width: 2.5rem; */
-  /* text-transform: capitalize; */
-
-  &:hover {
-    /* background-color: hsl(var(--primary-hs), calc(var(--primary-l) - 20%)); */
-    /* color: var(--primary-c); */
-  }
-}
-
-.p-hidden-accessible {
-  display: none;
-}
-
-@media (max-width: 576px) {
-  .p-dialog {
-    min-width: 95%;
-
-    .p-dialog-footer p-footer {
-      /* justify-content: center; */
-      /* flex-direction: column; */
-    }
-  }
-
-  .p-toast {
-    width: auto;
-    left: 0.5rem;
-    right: 0.5rem;
-  }
-}
-
-// @each $color,
-// $colorValue in $colors-mapped {
-//   .p-toast-message-#{$color} {
-//     background-color: var(--#{$color});
-//     color: var(--#{$color}-c);
-//   }
-
-//   .p-badge-#{$color} {
-//     background-color: var(--#{$color});
-//     color: var(--#{$color}-c);
-//   }
-// }

package/src/styles/helper/tailwindcss.scss

@@ -1,4 +0,0 @@
-.grid>div {
-  padding-left: 1rem;
-  padding-right: 1rem;
-}