CORE_V5 // pages

PATH: home / rwabteecom / project_11 / resources / views / dashboard / pages /

Editing: pill.blade.php

<!DOCTYPE html>
<html lang="ar" dir="rtl">

<title>bill</title>
    <style>
        * {
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
            margin: 0;
            padding: 0;
            font-family: 'Cairo'
        }

.body {
            background-color: #fff;
            width: 21cm;
            height: 29.7cm;
            margin: auto;
            direction: rtl !important;
            padding: 24px
        }

.header {
            width: 85%;
            padding: 30px 16px 16px;
            background-color: #f7f8fc;
            margin: 0px;
            text-align: center;
            border-radius: 20px 20px 0 0
        }

.header div {
            font-size: 16px;
            text-align: center;
            padding: 0;
            color: #a6a8b7
        }

.pill_total {
            width: 100%;
            background-color: #2387ff;
            padding: 20px 30px;
            border-radius: 20px;
            color: #fff;
            font-weight: bold;
        }

.pill_to {
            width: 70%;
            float: right
        }

.pill_to div {
            font-size: 18px;
        }

.fs-4,
        .pill_to div.fs-4 {
            font-size: 25px !important;
        }

.total_text {
            font-size: 14px;
        }

.pill_data {
            background-color: #fff;
            color: #000;
            border-radius: 10px;
            padding: 16px;
            width: 25%;
            float: left;
        }

.pill_details {
            width: 100%;
            border-radius: 10px;
            padding: 16px;
            background-color: #f7f8fa;
            margin: 20px auto;
        }

.pill_details .pill_details_box {
            width: 33%;
            float: right;
            text-align: center;
        }

.pill_details .pill_details_box div {
            font-size: 18px;
            color: #6c6e7a;
        }

.pill_details .pill_details_box div.pill_details_box_bold {
            font-size: 20px;
            font-weight: bold
        }

.service_title {
            margin: 8px 0;
            color: #878996;
            font-size: 20px;
        }

.service_name {
            margin-bottom: 16px;
            color: #000;
            font-size: 22px;
            font-weight: bold;
        }

.qr_con {
            margin: 50px auto;
            width: 100%
        }

.qr_con .qr_right {
            width: 60%;
            float: right;
        }

.qr_price {
            margin-bottom: 20px;
        }

.qr_price .qr_price_name {
            width: 30%;
            font-size: 20px;
            color: #000;
            font-weight: bold;
            float: right;

}

.qr_price .qr_price_data {
            width: 50%;
            font-size: 20px;
            color: #000;
            font-weight: bold;
            float: right;
        }

.qr_total_text {
            color: #6c6e7a;
            font-size: 24px
        }

.qr_total_data {
            font-size: 35px;
            font-weight: bold;
        }

.qr_con .qr_left {
            text-align: end;
            width: 220px
        }

.qr_img {
            width: 200px;
            height: 200px;
            margin-left: 0px
        }

.pill_bottom {
            margin-top: 70px
        }

.pill_bottom_right {
            width: 70%;
            float: right;
        }

.pill_bottom_right a,
        .pill_bottom_right div {
            font-size: 16px;
            margin: 8px 0;
            font-weight: bold;
            color: #6c6e7a
        }

.pill_bottom_left {
            width: 27%;
            float: right;
        }
    </style>

</head>

<body>
    <div class="body">
        <div class="header">
            <img src="{{ $gs->logo }}" class="mb-2" alt="">
            <h5 class="fw-bold">{{ $gs->title }}</h5>
            <p>{{ $gs->address }}</p>
        </div>
        <div class="pill_total d-flex">
            <div class="pill_to">
                <div>
                    فاتورة صادرة ل :
                </div>
                <div class="fs-4">
                    {{ $plan->user->name }}
                </div>
            </div>
            <div class="pill_data">
                <div class="total_text">
                    إجمالي الفاتورة
                </div>
                <div class="fs-4-">
                    {{ $plan->price }} ر.س
                </div>
            </div>
        </div>

<div class="my-3">
            <h5 class="fw-bold">
                تفاصيل الفاتورة
            </h5>
            <div class="pill_details d-flex">
                <div class="pill_details_box">
                    <div>
                        رقم الفاتورة
                    </div>
                    <div class="pill_details_box_bold">
                        {{ $plan->invoice?->invoice_number }}
                    </div>
                </div>
                <div class="pill_details_box">
                    <div>
                        تاريخ الفاتورة
                    </div>
                    <div class="pill_details_box_bold">
                        {{ $plan->invoice?->created_at->format('Y-m-d') }}

</div>
                </div>
                <div class="pill_details_box">
                    <div>
                        تاريخ الإنتهاء
                    </div>
                    <div class="pill_details_box_bold">
                        {{ $plan->plan_end_at }}

</div>
                </div>
                <div class="pill_details_box">
                    <div>
                        المبلغ
                    </div>
                    <div class="pill_details_box_bold">
                        {{ number_format($plan->price, 2) }}
                    </div>
                </div>
                <div class="pill_details_box">
                    <div>
                        الحالة
                    </div>
                    <div class="pill_details_box_bold">
                        {{ $plan->invoice?->is_paid ? __('تم الدفع') : __('لم تدفع') }}
                    </div>
                </div>
            </div>
        </div>

<div class="my-3">
            <h5 class="fw-bold">
                تفاصيل الباقة
            </h5>
            <div class="pill_details w-100">
                <div class="my-2">
                    <p class="mb-2">اسم الباقة</p>
                    <h5>{{ $plan->title }}</h5>
                </div>
                <div>
                    <p class="mb-2">وصف الباقة</p>
                    <h5>{{ $plan->description }}</h5>
                </div>
                <p></p>
            </div>
        </div>
        <div class="pill_bottom">
            <div class="pill_bottom_right">
                <a href="{{ $gs->site_link_address }}">
                    {{ $gs->site_link_address }}
                </a>
                <div>
                    {{ $gs->first_phone . '/' . $gs->first_email }}
                </div>
            </div>
            <div class="pill_bottom_left">
                <img src="{{ asset('front/assets/Logo.png') }}" alt="">
            </div>
        </div>

</html>

CANCEL