toggle-components-library 1.36.1-beta.7 → 1.36.1-beta.8

package/src/sass/includes/_as_buttons.scss

@@ -395,7 +395,7 @@
         }
         
         &:hover .contacts-icon {
-            background-color: white;
+            background-image: url("../assets/icons/contacts-white.svg");
         }
     }
     //icons
@@ -418,11 +418,9 @@
     }
     
     .contacts-icon {
-        --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='.9em' viewBox='0 0 448 512'%3E%3C!--! Font Awesome Free 6.4.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --%3E%3Cstyle%3Esvg%7Bfill:%23fff%7D%3C/style%3E%3Cpath d='M304 128a80 80 0 1 0 -160 0 80 80 0 1 0 160 0zM96 128a128 128 0 1 1 256 0A128 128 0 1 1 96 128zM49.3 464H398.7c-8.9-63.3-63.3-112-129-112H178.3c-65.7 0-120.1 48.7-129 112zM0 482.3C0 383.8 79.8 304 178.3 304h91.4C368.2 304 448 383.8 448 482.3c0 16.4-13.3 29.7-29.7 29.7H29.7C13.3 512 0 498.7 0 482.3z'/%3E%3C/svg%3E");
-        background-color: #6d90b4;
-        -webkit-mask: var(--svg);
-        mask: var(--svg);
-        mask-repeat: no-repeat;
+        background-image: url("../assets/icons/contacts-greyblue.svg");
+        background-repeat:no-repeat;
+        background-size:contain;
         margin-right: 6px;
         width: 14px;
         height: 14px;
@@ -430,47 +428,6 @@
     }
 }
 
-.toggle-metrics-button-small {
-    padding: 0px 13px;
-    font-size: 12px;
-    &.mini-contacts {
-        font-size: 0.65rem;
-        padding: 5px 12px;
-    }
-    .heatmap-icon {
-        width: 21px;
-        height: 21px;
-    }
-    .email-icon {
-        width: 25px;
-        height: 25px;
-    }
-    .contacts-icon {
-        --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='.8em' viewBox='0 0 448 512'%3E%3C!--! Font Awesome Free 6.4.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --%3E%3Cstyle%3Esvg%7Bfill:%23fff%7D%3C/style%3E%3Cpath d='M304 128a80 80 0 1 0 -160 0 80 80 0 1 0 160 0zM96 128a128 128 0 1 1 256 0A128 128 0 1 1 96 128zM49.3 464H398.7c-8.9-63.3-63.3-112-129-112H178.3c-65.7 0-120.1 48.7-129 112zM0 482.3C0 383.8 79.8 304 178.3 304h91.4C368.2 304 448 383.8 448 482.3c0 16.4-13.3 29.7-29.7 29.7H29.7C13.3 512 0 498.7 0 482.3z'/%3E%3C/svg%3E");
-        -webkit-mask: var(--svg);
-        mask: var(--svg);
-        mask-repeat: no-repeat;
-    }
-}
-
-.toggle-metrics-button-large {
-    padding: 23px 27px;
-    font-size: 17px;
-    &.mini-contacts {
-        font-size: .92rem;
-        padding: 10px 25px;
-    }
-}
-
-.toggle-metrics-button-disabled {
-    opacity: 0.3;
-    cursor: default;
-
-    .heatmap-icon, .email-icon, .contacts-icon {
-        transform: none !important;
-    }
-}
-
 .toggle-button-booster-badge {
     display: flex;
     align-items: center;

package/src/sass/includes/_as_cards.scss

@@ -164,36 +164,3 @@
 
 }
 
-.toggle-comment-card {
-    display: flex;
-    flex-direction: row;
-    width: 100%;
-    height: 250px;
-    border-radius: 18px;
-    font-size: $toggle-font-size-regular;
-    font-family: $toggle-font-family;
-}
-
-.toggle-comment-card-info {
-    display: flex;
-    flex-direction: column;
-    justify-content: space-between;
-    padding: 30px 30px 20px 30px;
-    color: white;
-    border-radius: 30px;
-    width: 100%;
-
-    .toggle-comment-card-text {
-        text-align: justify;
-        line-height: 1.5rem;
-        text-overflow: ellipsis;
-        -webkit-line-clamp: 6;
-        -webkit-box-orient: vertical;
-        overflow: hidden;
-        display: -webkit-box;
-
-        p {
-            margin: 0
-        }
-    }
-}

package/src/sass/includes/_as_carousels.scss

@@ -28,10 +28,6 @@
             max-width: 100%;
         }
     }
-}
-.toggle-carousel-wrapper {
-    position: relative;
-
     .toggle-carousel-button{
         width: 50px;
         height: 50px;
@@ -106,14 +102,6 @@
                 }
             }
         }
-        &--comments-left-arrow{
-            left: -24px;
-            opacity: 0.8;
-        }
-        &--comments-right-arrow{
-            right: -24px !important;
-            opacity: 0.8;
-        }
         &--next{
             right: 20px;
             @media only screen and (max-width:768px){