Gecko [ thecigaretteboxes.com ]

Name	Size	Permission
common	[ DIR ]	drwxr-xr-x
app.blade.php	7.98 KB	-rw-r--r--
category_app.blade.php	50.08 KB	-rw-r--r--
client_app.blade.php	48.34 KB	-rw-r--r--
product_app.blade.php	45.94 KB	-rw-r--r--

Code Editor : app.blade.php

<!DOCTYPE html>
<html lang="en">
<head>
    <title>{{ $meta_title??'' }}</title>
    @include('layouts.common.head')
    @stack('styles')

.carousel-control-container {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            display: flex;
            justify-content: center;
            padding: 10px 0;
        }

/* Custom CSS for carousel control icons */
        /* Custom CSS for carousel control icons */
        .carousel-control-prev-icon,
        .carousel-control-next-icon {
            filter: invert(100%); /* This will make the icons appear in black */
        }
    </style>

<style>

.cards {
            display: flex;
            flex-direction: column;
            align-items: center;
            height: 395px;;
            border-radius: 21px 21px  21px  21px  ;
            box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
            padding-bottom: 15px;
            background-color: white;
        }

.cards .hover-img {
            padding: 5px;
            margin-top: -80px;
            margin-right: -150px;
            display: none;
            /*transition: opacity 0.5s ease;*/
        }

.cards h2 {
            margin: 10px 0;
            font-weight: 700;
        }
        .cont h2{
            font-size: 1rem;
        }
        .cont p{
            font-size: 12px;
            font-family: 'Montserrat';
            font-weight: 700;
        }
        .cont {
            width: 90%;
            height: 107px;
            overflow: hidden;
            text-align: center;
            transition: all 1s ease;
        }

.cards .cont .link i {
            font-size: 25px;
            color: rgb(82, 82, 82);
            transition: all 0.2s ease;
        }

.cards .cont .link i:hover {
            color: black;
            cursor: pointer;
        }

.cards:hover > .cont {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: space-between;
            text-align: center;
            height: 294px;

}
        .fimg{
            width: 100%;
            height: auto;
            border-top-left-radius: 20px;
            border-top-right-radius: 20px;
        }
        .cards:hover > .fimg{
            display: none;
        }
        .cards:hover > .hover-img{
            display: block;
            opacity: 1; transition: opacity 0.5s ease;
        }

.hover-img {
            opacity: 0;
            visibility: hidden;
            transition: opacity 0.5s ease;
        }

.cards:hover .hover-img {
            animation: fadeIn 1.2s forwards;
		width:116px;
        }

@keyframes fadeIn {
            from {
                opacity: 0;
                visibility: hidden;
            }
            to {
                opacity: 1;
                visibility: visible;
            }
        }

.cards:hover > .link {
            width: 40%;
            display: flex;
            justify-content: space-between;
        }

/* Add animation for the text going upward */
        @keyframes riseText {
            from {
                transform: translateY(100%);
            }
            to {
                transform: translateY(0);
            }
        }

.cards:hover > .cont p {
            animation: riseText 0.5s ease; /* Apply the animation on hover */
        }
        .explore-more-btn{
            border-radius: 20px;
        }
        .explore-more-btn:hover {
            background-color: #FF6B00; /* Set the warning color you desire here */
            color: white; /* Set the text color to ensure readability */
            border: 1px solid #FF6B00;
        }
        #hero .carousel-indicators li.active {
            background: white;
        }
        .learn-more-btn{
            border-radius: 20px;
        }
        .learn-more-btn:hover {
            background-color: #FF6B00; /* Set the warning color you desire here */
            color: #212529; /* Set the text color to ensure readability */
        }

.learn-more-btn{
            border-radius: 20px;
        }
        .learn-more-btn:hover {
            background-color: #FF6B00; /* Set the warning color you desire here */
            color: #212529; /* Set the text color to ensure readability */
        }

.row{
            margin-right: 12px;
            margin-left: -7px;

}
        .services-text-para{
            margin-left: 15%;
            margin-right: 15%;
        }

.testimonial-col{
            height: 27vh;
        }

@media (max-width: 1920px) {
            .cards {
                display: flex;
                flex-direction: column;
                align-items: center;
                height: 432px;
                border-radius: 21px 21px 21px 21px;
                box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
                padding-bottom: 15px;
                background-color: white;
            }
            .cont {
                width: 90%;
                height: 122px;
                overflow: hidden;
                text-align: center;
                transition: all 1s ease;
            }
        }

@media (max-width: 1536px){
            .cards {
                display: flex;
                flex-direction: column;
                align-items: center;
                height: 295px;
                border-radius: 21px 21px 21px 21px;
                box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
                padding-bottom: 15px;
                background-color: white;
            }
            }
        @media (max-width: 576px) {

.widgetImage {
                position: absolute;
                top: 0;
                left: 0%;
                width: 100% !important;
                height: 260px;
                margin-left: 0%;
            }
            .col-md-2{
                width: 50%;
                margin-bottom: 30px;
            }
            .inovation-sec .col-md-2{
                width: 100%;

}

#header.header-scrolled, #header.header-inner-pages {
                background: rgb(23 26 29);
            }
            .cards:hover{
                margin-top: 90px;
                height: 342px;
            }

.cards .hover-img {
                padding: 5px;
                margin-top: -120px;
                margin-right: -100px;
                display: none;
            }
            .cards {
                display: flex;
                flex-direction: column;
                align-items: center;
                height: 275px;
                box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
            }
            .featured-work-links{
                font-size: 13px;
            }
            .services-text-para{
                margin-left: 0;
                margin-right: 0;
                text-align: justify;
            }
            .testimonial-col{
                height: auto;
            }

}

</style>

</head>
<body class="defult-home">

<div id="loader" class="loader">
    <div class="loader-container"></div>
</div>

<div class="main-content">
@include('layouts.common.header')

@if(!empty(session('subscribe_error')))
        <div class="alert alert-danger">
            {{ session('error') }}
        </div>
    @endif
    @yield('contents')
</div>
@include('layouts.common.footer_contents')
@yield('secondary_bar')
<script  rel="preload"  src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"
        type="text/javascript"></script>
@include('layouts.common.footer')
@stack('scripts')
</body>
</html>

${this.title}

Code Editor : app.blade.php