add skeleton profile

This commit is contained in:
Amir Hamzan
2021-11-17 17:01:34 +08:00
parent 2a4bf0cc81
commit 50bf544e2d
8 changed files with 109 additions and 38 deletions
+13 -31
View File
@@ -1,12 +1,12 @@
@extends ('includes.main.index')
@extends ('layouts..index')
@section('content')
<title>Home | Customer Portal</title>
<div class="col-lg-4 ms-auto mt-lg-0 mt-8">
<div class="card">
<div class="col-lg-4 col-md-6">
<div class="card mt-8">
<div class="card-header p-0 position-relative mt-n4 mx-3 z-index-2">
<a class="d-block blur-shadow-image">
<img src="{{ asset('assets/img/material-kit/internal/record.jpg') }}" alt="img-colored-shadow" class="img-fluid border-radius-lg">
@@ -24,8 +24,8 @@
</div>
</div>
</div>
<div class="col-lg-4 ms-auto mt-lg-0 mt-8">
<div class="card">
<div class="col-lg-4 col-md-6">
<div class="card mt-8">
<div class="card-header p-0 position-relative mt-n4 mx-3 z-index-2">
<a class="d-block blur-shadow-image">
<img src="{{ asset('assets/img/material-kit/internal/paymentbg1.jpg') }}" alt="img-colored-shadow" class="img-fluid border-radius-lg">
@@ -43,8 +43,8 @@
</div>
</div>
</div>
<div class="col-lg-4 ms-auto mt-lg-0 mt-8">
<div class="card">
<div class="col-lg-4 col-md-6">
<div class="card mt-8">
<div class="card-header p-0 position-relative mt-n4 mx-3 z-index-2">
<a class="d-block blur-shadow-image">
<img src="{{ asset('assets/img/material-kit/internal/stackgold.jpg') }}" alt="img-colored-shadow" class="img-fluid border-radius-lg">
@@ -62,8 +62,8 @@
</div>
</div>
</div>
<div class="col-lg-4 ms-auto mt-lg-8 mt-8">
<div class="card">
<div class="col-lg-4 col-md-6">
<div class="card mt-8">
<div class="card-header p-0 position-relative mt-n4 mx-3 z-index-2">
<a class="d-block blur-shadow-image">
<img src="{{ asset('assets/img/material-kit/internal/analisa.jpg') }}" alt="img-colored-shadow" class="img-fluid border-radius-lg">
@@ -81,30 +81,11 @@
</div>
</div>
</div>
<div class="col-lg-4 ms-auto mt-lg-8 mt-8">
<div class="card">
<div class="col-lg-4 col-md-6">
<div class="card mt-8">
<div class="card-header p-0 position-relative mt-n4 mx-3 z-index-2">
<a class="d-block blur-shadow-image">
<img src="{{ asset('assets/img/material-kit/internal/discussCopy.jpg') }}" alt="img-colored-shadow" class="img-fluid border-radius-lg">
</a>
</div>
<div class="card-body text-center">
<h5 class="font-weight-normal">
<a href="javascript:;">Next Function</a>
</h5>
<p class="mb-0">
Website visitors today demand a frictionless user expericence — especially when using search. Because
of the hight standards.
</p>
<button type="button" class="btn bg-gradient-info btn-sm mb-0 mt-3">Next Function</button>
</div>
</div>
</div>
<div class="col-lg-4 ms-auto mt-lg-8 mt-8">
<div class="card">
<div class="card-header p-0 position-relative mt-n4 mx-3 z-index-2">
<a class="d-block blur-shadow-image">
<img src="https://images.unsplash.com/photo-1544717302-de2939b7ef71?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1950&q=80" alt="img-colored-shadow" class="img-fluid border-radius-lg">
<img src="{{ asset('assets/img/material-kit/internal/discuss.jpg') }}" alt="img-colored-shadow" class="img-fluid border-radius-lg">
</a>
</div>
<div class="card-body text-center">
@@ -120,4 +101,5 @@
</div>
</div>
@endsection
@@ -1,4 +1,4 @@
@extends('includes.login.index')
@extends('layouts.index')
@section('content')
@@ -37,7 +37,13 @@
</a>
</li>
<li class="nav-item ms-lg-auto">
<a class="nav-link nav-link-icon me-2" href="#profil">
<a class="nav-link nav-link-icon me-2" href="#analisa">
<i class="fa fa-microchip me-1"></i>
<p class="d-inline text-sm z-index-1 font-weight-bold" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Function Seterusnya">Next</p>
</a>
</li>
<li class="nav-item ms-lg-auto">
<a class="nav-link nav-link-icon me-2" href="portalprofile">
<i class="fa fa-user me-1"></i>
<p class="d-inline text-sm z-index-1 font-weight-bold" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Tetapan Profile">Profil</p>
</a>
@@ -0,0 +1,83 @@
@extends('layouts.index')
@section('content')
<div class="col-xl-5 col-lg-6 col-md-7 d-flex flex-column ms-auto me-auto ms-lg-auto me-lg-5">
<div class="card d-flex blur justify-content-center shadow-lg my-sm-0 my-sm-6 mt-8 mb-5">
<div class="card-header p-0 position-relative mt-n4 mx-3 z-index-2 bg-transparent">
<div class="bg-gradient-primary shadow-primary border-radius-lg p-3">
<h3 class="text-white text-primary mb-0">Profil</h3>
</div>
</div>
<div class="card-body">
<p class="pb-3">
For further questions, including partnership opportunities, please email hello@creative-tim.com
or contact using our contact form.
</p>
<form id="contact-form" method="post" autocomplete="off">
<div class="card-body p-0 my-3">
<div class="row">
<div class="col-md-6">
<div class="input-group input-group-static mb-4">
<label>Nama</label>
<input type="email" class="form-control" placeholder="Full Name">
</div>
</div>
<div class="col-md-6 ps-md-2">
<div class="input-group input-group-static mb-4">
<label>Email</label>
<input type="email" class="form-control" placeholder="hello@creative-tim.com">
</div>
</div>
<div class="col-md-6">
<div class="input-group input-group-static mb-4">
<label>IC</label>
<input type="email" class="form-control" placeholder="Full Name">
</div>
</div>
<div class="col-md-6 ps-md-2">
<div class="input-group input-group-static mb-4">
<label>No Telefon</label>
<input type="email" class="form-control" placeholder="hello@creative-tim.com">
</div>
</div>
</div>
<div class="form-group mb-0 mt-md-0 mt-4">
<div class="input-group input-group-static mb-4">
<label>Alamat</label>
<textarea name="message" class="form-control" id="message" rows="6" placeholder="Describe your problem in at least 250 characters"></textarea>
</div>
</div>
<div class="row">
<div class="col-md-4">
<div class="input-group input-group-static mb-4">
<label>Poskod</label>
<input type="email" class="form-control" placeholder="Full Name">
</div>
</div>
<div class="col-md-4 ps-md-2">
<div class="input-group input-group-static mb-4">
<label>Daerah</label>
<input type="email" class="form-control" placeholder="hello@creative-tim.com">
</div>
</div>
<div class="col-md-4 ps-md-2">
<div class="input-group input-group-static mb-4">
<label>Negeri</label>
<input type="email" class="form-control" placeholder="hello@creative-tim.com">
</div>
</div>
</div>
<div class="row">
<div class="col-md-12 text-center">
<button type="submit" class="btn bg-gradient-primary mt-3 mb-0">Send Message</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
@endsection
@@ -6,14 +6,11 @@
</head>
<body class="about-us bg-gray-200">
@include('includes.main.header')
<div class="card card-body shadow-xl mx-3 mx-md-4 mt-n6">
<!-- Section with four info areas left & one card right with image and waves -->
<section class="py-7">
<div class="container">
<div class="row align-items-center">
<div class="row justify-content-center">
@yield('content')
</div>
</div>
+1 -1
View File
@@ -1,4 +1,4 @@
@extends('layouts.app')
@extends('includes.main.index')
@section('content')
@include('layouts.headers.cards')
+3
View File
@@ -28,6 +28,9 @@ Route::get('/firsttime', function () {
Route::get('/portalhome', function () {
return view('/includes/home');
});
Route::get('/portalprofile', function () {
return view('/includes/profile');
});
Route::get('/', function () {