first commit

2025-07-30 13:44:47 +05:30
commit 6c0c0e3d1d
494 changed files with 57695 additions and 0 deletions
--- a/public/scss/component/_testimonial.scss
+++ b/public/scss/component/_testimonial.scss
@ -0,0 +1,128 @@
+@use "../abstracts/index" as *;
+
+.testimonial {
+    padding: 24px 15px;
+    .box-user {
+        gap: 12px;
+    }
+    &.style-default {
+        border: 1px solid var(--Primary-1);
+        border-radius: 20px;
+        background-color: var(--White);
+        .icon {
+            color: var(--Primary-3);
+            font-size: 30px;
+        }
+    }
+    &.style-1 {
+        position: absolute;
+        padding: 0 !important;
+        .avatar {
+            position: relative;
+            &::after,
+            &::before {
+                opacity: 0;
+                position: absolute;
+                content: "";
+                top: 0;
+                bottom: 0;
+                right: 0;
+                left: 0;
+                border-radius: 9999px;
+                animation: ripple 3s infinite;
+                @include transition3();
+            }
+            &::after {
+                animation-delay: 0.5s;
+            }
+            &::before {
+                animation-delay: 0.9s;
+            }
+            img {
+                height: 96px;
+                width: 96px;
+                padding: 12px;
+                border-radius: 999px;
+                background-color: var(--White);
+            }
+        }
+        .content {
+            visibility: hidden;
+            opacity: 0;
+            position: absolute;
+            padding: 40px 32px;
+            border-radius: 18px;
+            background-color: var(--White);
+            min-width: 499px;
+            @include transition3();
+            &.top {
+                bottom: calc(100% + 13px);
+                .arrow {
+                    bottom: -8px;
+                    transform: rotate(-136deg);
+                }
+            }
+            &.bottom {
+                top: calc(100% + 13px);
+            }
+            .arrow {
+                position: absolute;
+                bottom: calc(100% - 14px);
+                left: 45px;
+                border-top: 20px solid var(--White);
+                border-right: 20px solid transparent;
+                -webkit-transform: rotate(45deg);
+                transform: rotate(45deg);
+                z-index: 10;
+            }
+        }
+        &:hover {
+            z-index: 10;
+            .content {
+                visibility: visible;
+                opacity: 1;
+            }
+            .avatar {
+                &::after,
+                &::before {
+                    opacity: 1;
+                }
+            }
+        }
+    }
+    &.style-2 {
+        text-align: center;
+        .logo {
+            margin-bottom: 66px;
+        }
+        .text {
+            margin-bottom: 113px;
+        }
+    }
+    &.style-3 {
+        border-radius: 12px;
+        background-color: var(--White);
+        min-height: 415px;
+        flex-direction: column;
+        gap: 12px;
+        display: flex;
+        justify-content: space-between;
+        .box-user {
+            .avatar {
+                border-radius: 10px;
+            }
+        }
+    }
+    &.style-4 {
+        padding: 0;
+        .content {
+            display: flex;
+            justify-content: space-between;
+            gap: 12px;
+        }
+        .left {
+            max-width: 612px;
+            flex: 1;
+        }
+    }
+}