trepur_components 1.0.4 → 1.0.6

package/dist/src/lib/components/Tubestops/style.module.css

@@ -0,0 +1,952 @@
+.classList {
+  
+    width: 100%;
+  
+    list-style-type: none;
+}
+
+.circle {
+  
+    z-index: 10;
+  
+    height: 1rem;
+  
+    width: 1rem;
+  
+    border-radius: 9999px;
+  
+    --tw-bg-opacity: 1;
+  
+    background-color: rgb(0 0 0 / var(--tw-bg-opacity));
+}
+
+.liClassList {
+  
+    position: relative;
+  
+    margin-bottom: 0px;
+  
+    display: flex;
+  
+    flex: 1 1 auto;
+  
+    flex-direction: row;
+  
+    line-height: 1.25;
+}
+
+.tubestop.liClassList.none-reverse .status-flow-item:not(:first-child):after {
+  
+    position: absolute;
+  
+    display: block;
+  
+    content: "";
+    width: 100%;
+    height: 1px;
+    left: -50%;
+    bottom: 7px;
+}
+
+.tubestop.liClassList.reverse .status-flow-item:not(:first-child):after {
+    left: -50%;
+    bottom: 7px;
+    position: absolute;
+    display: block;
+  
+    content: "";
+    width: 100%;
+    height: 1px;
+    right: -50%;
+    top: 7px;
+}
+
+.ulClassList {
+  
+    position: relative;
+  
+    display: flex;
+  
+    list-style-type: none;
+  
+    padding-left: 0px;
+}
+
+.ulClassList.flex-col.none-reverse .status-flow-item:not(:first-child):before {
+  
+    position: absolute;
+  
+    display: block;
+    
+    content: "";
+    width: 1px;
+    height: 100%;
+    left: 7px;
+    top: -100%;
+}
+
+.ulClassList.flex-col.none-reverse .status-flow-item:not(:last-child):after {
+  
+    position: absolute;
+  
+    display: block;
+   
+    content: "";
+    width: 1px;
+    height: 100%;
+    left: 7px;
+    top: 40%;
+}
+
+.ulClassList.flex-col.reverse .status-flow-item:not(:first-child):before {
+  
+    position: absolute;
+  
+    display: block;
+  
+    content: "";
+    width: 1px;
+    height: 100%;
+    right: 7px;
+    top: -100%;
+}
+
+.ulClassList.flex-col.reverse .status-flow-item:not(:last-child):after {
+  
+    position: absolute;
+  
+    display: block;
+  
+    content: "";
+    width: 1px;
+    height: 100%;
+    right: 7px;
+    top: 40%;
+}
+
+.ulClassList.flex-row.none-reverse .status-flow-item:not(:first-child):after {
+  
+    position: absolute;
+  
+    display: block;
+  
+    content: "";
+    width: 100%;
+    height: 1px;
+    left: -50%;
+    bottom: 7px;
+}
+
+.ulClassList.flex-row-reverse.none-reverse
+    .status-flow-item:not(:first-child):after {
+  
+    position: absolute;
+  
+    display: block;
+  
+    content: "";
+    width: 100%;
+    height: 1px;
+    right: -50%;
+    top: 7px;
+}
+
+.ulClassList.flex-row.reverse .status-flow-item:not(:first-child):after {
+    left: -50%;
+    bottom: 7px;
+    position: absolute;
+    display: block;
+  
+    content: "";
+    width: 100%;
+    height: 1px;
+    right: -50%;
+    top: 7px;
+}
+
+.textCenter {
+  
+    text-align: center;
+}
+
+.ulHorizonatalReverse {
+  
+    flex-direction: row;
+  
+    justify-content: space-between;
+}
+
+.tubestop.flex-col.ulHorizonatalReverse .status-flow-item:not(:first-child):before {
+  
+    position: absolute;
+  
+    display: block;
+  
+    content: "";
+    width: 1px;
+    height: 100%;
+    right: 7px;
+    top: -100%;
+}
+
+.tubestop.flex-col.ulHorizonatalReverse .status-flow-item:not(:last-child):after {
+  
+    position: absolute;
+  
+    display: block;
+  
+    content: "";
+    width: 1px;
+    height: 100%;
+    right: 7px;
+    top: 40%;
+}
+
+.tubestop.ulHorizonatalReverse.none-reverse .status-flow-item:not(:first-child):after {
+  
+    position: absolute;
+  
+    display: block;
+  
+    content: "";
+    width: 100%;
+    height: 1px;
+    left: -50%;
+    bottom: 7px;
+}
+
+.tubestop.ulHorizonatalReverse.reverse .status-flow-item:not(:first-child):after {
+  
+    position: absolute;
+}
+
+.tubestop.flex-row.ulHorizonatalReverse .status-flow-item:not(:first-child):after {
+  
+    position: absolute;
+}
+
+.tubestop.ulHorizonatalReverse.reverse .status-flow-item:not(:first-child):after {
+  
+    display: block;
+}
+
+.tubestop.flex-row.ulHorizonatalReverse .status-flow-item:not(:first-child):after {
+  
+    display: block;
+}
+
+.tubestop.ulHorizonatalReverse.reverse .status-flow-item:not(:first-child):after {
+  
+    content: "";
+    width: 100%;
+    height: 1px;
+    left: -50%;
+    bottom: 7px;
+  }
+
+.tubestop.flex-row.ulHorizonatalReverse .status-flow-item:not(:first-child):after {
+  
+    content: "";
+    width: 100%;
+    height: 1px;
+    left: -50%;
+    bottom: 7px;
+  }
+
+.tubestop.ulHorizonatalReverse.reverse .status-flow-item:not(:first-child):after {
+  
+    position: absolute;
+}
+
+.tubestop.flex-row.ulHorizonatalReverse .status-flow-item:not(:first-child):after {
+  
+    position: absolute;
+}
+
+.tubestop.ulHorizonatalReverse.reverse .status-flow-item:not(:first-child):after {
+  
+    display: block;
+}
+
+.tubestop.flex-row.ulHorizonatalReverse .status-flow-item:not(:first-child):after {
+  
+    display: block;
+}
+
+.tubestop.ulHorizonatalReverse.reverse .status-flow-item:not(:first-child):after {
+  
+    content: "";
+    width: 100%;
+    height: 1px;
+    right: -50%;
+    top: 7px;
+  }
+
+.tubestop.flex-row.ulHorizonatalReverse .status-flow-item:not(:first-child):after {
+  
+    content: "";
+    width: 100%;
+    height: 1px;
+    right: -50%;
+    top: 7px;
+  }
+
+.ulHorizonatalNotReverse {
+  
+    flex-direction: row;
+  
+    justify-content: space-between;
+}
+
+.tubestop.flex-col.ulHorizonatalNotReverse .status-flow-item:not(:first-child):before {
+  
+    position: absolute;
+  
+    display: block;
+    
+    content: "";
+    width: 1px;
+    height: 100%;
+    left: 7px;
+    top: -100%;
+}
+
+.tubestop.flex-col.ulHorizonatalNotReverse .status-flow-item:not(:last-child):after {
+  
+    position: absolute;
+  
+    display: block;
+   
+    content: "";
+    width: 1px;
+    height: 100%;
+    left: 7px;
+    top: 40%;
+}
+
+.tubestop.ulHorizonatalNotReverse.none-reverse .status-flow-item:not(:first-child):after {
+  
+    position: absolute;
+}
+
+.tubestop.flex-row.ulHorizonatalNotReverse .status-flow-item:not(:first-child):after {
+  
+    position: absolute;
+}
+
+.tubestop.ulHorizonatalNotReverse.none-reverse .status-flow-item:not(:first-child):after {
+  
+    display: block;
+}
+
+.tubestop.flex-row.ulHorizonatalNotReverse .status-flow-item:not(:first-child):after {
+  
+    display: block;
+}
+
+.tubestop.ulHorizonatalNotReverse.none-reverse .status-flow-item:not(:first-child):after {
+  
+    content: "";
+    width: 100%;
+    height: 1px;
+    left: -50%;
+    bottom: 7px;
+  }
+
+.tubestop.flex-row.ulHorizonatalNotReverse .status-flow-item:not(:first-child):after {
+  
+    content: "";
+    width: 100%;
+    height: 1px;
+    left: -50%;
+    bottom: 7px;
+  }
+
+.tubestop.flex-row-reverse.ulHorizonatalNotReverse
+    .status-flow-item:not(:first-child):after {
+  
+    position: absolute;
+  
+    display: block;
+  
+    content: "";
+    width: 100%;
+    height: 1px;
+    right: -50%;
+    top: 7px;
+}
+
+.tubestop.ulHorizonatalNotReverse.reverse .status-flow-item:not(:first-child):after {
+    left: -50%;
+    bottom: 7px;
+    position: absolute;
+    display: block;
+  
+    content: "";
+    width: 100%;
+    height: 1px;
+    right: -50%;
+    top: 7px;
+}
+
+.ulNotHorizonatalNotReverse {
+  
+    flex-direction: column;
+}
+
+.tubestop.ulNotHorizonatalNotReverse.none-reverse .status-flow-item:not(:first-child):before {
+  
+    position: absolute;
+}
+
+.tubestop.flex-col.ulNotHorizonatalNotReverse .status-flow-item:not(:first-child):before {
+  
+    position: absolute;
+}
+
+.tubestop.ulNotHorizonatalNotReverse.none-reverse .status-flow-item:not(:first-child):before {
+  
+    display: block;
+}
+
+.tubestop.flex-col.ulNotHorizonatalNotReverse .status-flow-item:not(:first-child):before {
+  
+    display: block;
+}
+
+.tubestop.ulNotHorizonatalNotReverse.none-reverse .status-flow-item:not(:first-child):before {
+    
+    content: "";
+    width: 1px;
+    height: 100%;
+    left: 7px;
+    top: -100%;
+  }
+
+.tubestop.flex-col.ulNotHorizonatalNotReverse .status-flow-item:not(:first-child):before {
+    
+    content: "";
+    width: 1px;
+    height: 100%;
+    left: 7px;
+    top: -100%;
+  }
+
+.tubestop.ulNotHorizonatalNotReverse.none-reverse .status-flow-item:not(:last-child):after {
+  
+    position: absolute;
+}
+
+.tubestop.flex-col.ulNotHorizonatalNotReverse .status-flow-item:not(:last-child):after {
+  
+    position: absolute;
+}
+
+.tubestop.ulNotHorizonatalNotReverse.none-reverse .status-flow-item:not(:last-child):after {
+  
+    display: block;
+}
+
+.tubestop.flex-col.ulNotHorizonatalNotReverse .status-flow-item:not(:last-child):after {
+  
+    display: block;
+}
+
+.tubestop.ulNotHorizonatalNotReverse.none-reverse .status-flow-item:not(:last-child):after {
+   
+    content: "";
+    width: 1px;
+    height: 100%;
+    left: 7px;
+    top: 40%;
+  }
+
+.tubestop.flex-col.ulNotHorizonatalNotReverse .status-flow-item:not(:last-child):after {
+   
+    content: "";
+    width: 1px;
+    height: 100%;
+    left: 7px;
+    top: 40%;
+  }
+
+.tubestop.ulNotHorizonatalNotReverse.reverse .status-flow-item:not(:first-child):before {
+  
+    position: absolute;
+  
+    display: block;
+  
+    content: "";
+    width: 1px;
+    height: 100%;
+    right: 7px;
+    top: -100%;
+}
+
+.tubestop.ulNotHorizonatalNotReverse.reverse .status-flow-item:not(:last-child):after {
+  
+    position: absolute;
+  
+    display: block;
+  
+    content: "";
+    width: 1px;
+    height: 100%;
+    right: 7px;
+    top: 40%;
+}
+
+.tubestop.flex-row.ulNotHorizonatalNotReverse .status-flow-item:not(:first-child):after {
+  
+    position: absolute;
+  
+    display: block;
+  
+    content: "";
+    width: 100%;
+    height: 1px;
+    left: -50%;
+    bottom: 7px;
+}
+
+.tubestop.flex-row-reverse.ulNotHorizonatalNotReverse
+    .status-flow-item:not(:first-child):after {
+  
+    position: absolute;
+  
+    display: block;
+  
+    content: "";
+    width: 100%;
+    height: 1px;
+    right: -50%;
+    top: 7px;
+}
+
+.ulNotHorizonatalReverse {
+  
+    flex-direction: column;
+}
+
+.tubestop.ulNotHorizonatalReverse.none-reverse .status-flow-item:not(:first-child):before {
+  
+    position: absolute;
+  
+    display: block;
+    
+    content: "";
+    width: 1px;
+    height: 100%;
+    left: 7px;
+    top: -100%;
+}
+
+.tubestop.ulNotHorizonatalReverse.none-reverse .status-flow-item:not(:last-child):after {
+  
+    position: absolute;
+  
+    display: block;
+   
+    content: "";
+    width: 1px;
+    height: 100%;
+    left: 7px;
+    top: 40%;
+}
+
+.tubestop.ulNotHorizonatalReverse.reverse .status-flow-item:not(:first-child):before {
+  
+    position: absolute;
+}
+
+.tubestop.flex-col.ulNotHorizonatalReverse .status-flow-item:not(:first-child):before {
+  
+    position: absolute;
+}
+
+.tubestop.ulNotHorizonatalReverse.reverse .status-flow-item:not(:first-child):before {
+  
+    display: block;
+}
+
+.tubestop.flex-col.ulNotHorizonatalReverse .status-flow-item:not(:first-child):before {
+  
+    display: block;
+}
+
+.tubestop.ulNotHorizonatalReverse.reverse .status-flow-item:not(:first-child):before {
+  
+    content: "";
+    width: 1px;
+    height: 100%;
+    right: 7px;
+    top: -100%;
+  }
+
+.tubestop.flex-col.ulNotHorizonatalReverse .status-flow-item:not(:first-child):before {
+  
+    content: "";
+    width: 1px;
+    height: 100%;
+    right: 7px;
+    top: -100%;
+  }
+
+.tubestop.ulNotHorizonatalReverse.reverse .status-flow-item:not(:last-child):after {
+  
+    position: absolute;
+}
+
+.tubestop.flex-col.ulNotHorizonatalReverse .status-flow-item:not(:last-child):after {
+  
+    position: absolute;
+}
+
+.tubestop.ulNotHorizonatalReverse.reverse .status-flow-item:not(:last-child):after {
+  
+    display: block;
+}
+
+.tubestop.flex-col.ulNotHorizonatalReverse .status-flow-item:not(:last-child):after {
+  
+    display: block;
+}
+
+.tubestop.ulNotHorizonatalReverse.reverse .status-flow-item:not(:last-child):after {
+  
+    content: "";
+    width: 1px;
+    height: 100%;
+    right: 7px;
+    top: 40%;
+  }
+
+.tubestop.flex-col.ulNotHorizonatalReverse .status-flow-item:not(:last-child):after {
+  
+    content: "";
+    width: 1px;
+    height: 100%;
+    right: 7px;
+    top: 40%;
+  }
+
+.tubestop.flex-row.ulNotHorizonatalReverse .status-flow-item:not(:first-child):after {
+    left: -50%;
+    bottom: 7px;
+    position: absolute;
+    display: block;
+  
+    content: "";
+    width: 100%;
+    height: 1px;
+    right: -50%;
+    top: 7px;
+}
+
+.liHorizonatalReverse {
+  
+    flex-direction: column;
+  
+    align-items: center;
+}
+
+.tubestop.liHorizonatalReverse.none-reverse .status-flow-item:not(:first-child):before {
+  
+    position: absolute;
+  
+    display: block;
+    
+    content: "";
+    width: 1px;
+    height: 100%;
+    left: 7px;
+    top: -100%;
+}
+
+.tubestop.liHorizonatalReverse.none-reverse .status-flow-item:not(:last-child):after {
+  
+    position: absolute;
+  
+    display: block;
+   
+    content: "";
+    width: 1px;
+    height: 100%;
+    left: 7px;
+    top: 40%;
+}
+
+.tubestop.liHorizonatalReverse.reverse .status-flow-item:not(:first-child):before {
+  
+    position: absolute;
+  
+    display: block;
+  
+    content: "";
+    width: 1px;
+    height: 100%;
+    right: 7px;
+    top: -100%;
+}
+
+.tubestop.liHorizonatalReverse.reverse .status-flow-item:not(:last-child):after {
+  
+    position: absolute;
+  
+    display: block;
+  
+    content: "";
+    width: 1px;
+    height: 100%;
+    right: 7px;
+    top: 40%;
+}
+
+.liHorizonatalNotReverse {
+  
+    flex-direction: column-reverse;
+  
+    align-items: center;
+  
+    justify-content: space-between;
+}
+
+.liNotHorizonatalNotReverse {
+  
+    flex-direction: row;
+}
+
+.tubestop.flex-col.liNotHorizonatalNotReverse .status-flow-item:not(:first-child):before {
+  
+    position: absolute;
+  
+    display: block;
+    
+    content: "";
+    width: 1px;
+    height: 100%;
+    left: 7px;
+    top: -100%;
+}
+
+.tubestop.flex-col.liNotHorizonatalNotReverse .status-flow-item:not(:last-child):after {
+  
+    position: absolute;
+  
+    display: block;
+   
+    content: "";
+    width: 1px;
+    height: 100%;
+    left: 7px;
+    top: 40%;
+}
+
+.tubestop.liNotHorizonatalNotReverse.none-reverse .status-flow-item:not(:first-child):after {
+  
+    position: absolute;
+}
+
+.tubestop.flex-row.liNotHorizonatalNotReverse .status-flow-item:not(:first-child):after {
+  
+    position: absolute;
+}
+
+.tubestop.liNotHorizonatalNotReverse.none-reverse .status-flow-item:not(:first-child):after {
+  
+    display: block;
+}
+
+.tubestop.flex-row.liNotHorizonatalNotReverse .status-flow-item:not(:first-child):after {
+  
+    display: block;
+}
+
+.tubestop.liNotHorizonatalNotReverse.none-reverse .status-flow-item:not(:first-child):after {
+  
+    content: "";
+    width: 100%;
+    height: 1px;
+    left: -50%;
+    bottom: 7px;
+  }
+
+.tubestop.flex-row.liNotHorizonatalNotReverse .status-flow-item:not(:first-child):after {
+  
+    content: "";
+    width: 100%;
+    height: 1px;
+    left: -50%;
+    bottom: 7px;
+  }
+
+.tubestop.flex-row-reverse.liNotHorizonatalNotReverse
+    .status-flow-item:not(:first-child):after {
+  
+    position: absolute;
+  
+    display: block;
+  
+    content: "";
+    width: 100%;
+    height: 1px;
+    right: -50%;
+    top: 7px;
+}
+
+.tubestop.liNotHorizonatalNotReverse.reverse .status-flow-item:not(:first-child):after {
+    left: -50%;
+    bottom: 7px;
+    position: absolute;
+    display: block;
+  
+    content: "";
+    width: 100%;
+    height: 1px;
+    right: -50%;
+    top: 7px;
+}
+
+.liNotHorizonatalReverse {
+  
+    flex-direction: row-reverse;
+}
+
+.tubestop.liNotHorizonatalReverse.none-reverse
+    .status-flow-item:not(:first-child):after {
+  
+    position: absolute;
+  
+    display: block;
+  
+    content: "";
+    width: 100%;
+    height: 1px;
+    right: -50%;
+    top: 7px;
+}
+
+.horizonatalReverse {
+  
+    padding-top: 0.5rem;
+}
+
+.horizonatalNotReverse {
+  
+    padding-bottom: 0.5rem;
+}
+
+.notHorizonatalNotReverse {
+  
+    padding-left: 1rem;
+}
+
+.notHorizonatalReverse {
+  
+    padding-right: 1rem;
+}
+
+.margin {
+  
+    margin-top: 3rem;
+  
+    margin-bottom: 3rem;
+}
+
+/* Vertical */
+.tubestop.flex-col.none-reverse .status-flow-item:not(:first-child):before {
+  
+    position: absolute;
+  
+    display: block;
+    
+    content: "";
+    width: 1px;
+    height: 100%;
+    left: 7px;
+    top: -100%;
+}
+  
+  .tubestop.flex-col.none-reverse .status-flow-item:not(:last-child):after {
+  
+    position: absolute;
+  
+    display: block;
+   
+    content: "";
+    width: 1px;
+    height: 100%;
+    left: 7px;
+    top: 40%;
+}
+  
+  /* reverse */
+  .tubestop.flex-col.reverse .status-flow-item:not(:first-child):before {
+  
+    position: absolute;
+  
+    display: block;
+  
+    content: "";
+    width: 1px;
+    height: 100%;
+    right: 7px;
+    top: -100%;
+}
+  
+  .tubestop.flex-col.reverse .status-flow-item:not(:last-child):after {
+  
+    position: absolute;
+  
+    display: block;
+  
+    content: "";
+    width: 1px;
+    height: 100%;
+    right: 7px;
+    top: 40%;
+}
+  
+  /* Horizontal */
+  .tubestop.flex-row.none-reverse .status-flow-item:not(:first-child):after {
+  
+    position: absolute;
+  
+    display: block;
+  
+    content: "";
+    width: 100%;
+    height: 1px;
+    left: -50%;
+    bottom: 7px;
+}
+  
+  .tubestop.flex-row-reverse.none-reverse
+    .status-flow-item:not(:first-child):after {
+  
+    position: absolute;
+  
+    display: block;
+  
+    content: "";
+    width: 100%;
+    height: 1px;
+    right: -50%;
+    top: 7px;
+}
+  
+  /*reverse*/
+  .tubestop.flex-row.reverse .status-flow-item:not(:first-child):after {
+    left: -50%;
+    bottom: 7px;
+    position: absolute;
+    display: block;
+  
+    content: "";
+    width: 100%;
+    height: 1px;
+    right: -50%;
+    top: 7px;
+}
+  
+/*# sourceMappingURL=style.module.css.map */