Skip to content

Instantly share code, notes, and snippets.

@acxgray

acxgray/dashboard.blade.php

Created May 18, 2022 02:01
Show Gist options
  • Save acxgray/524bb6cb2910fc3ad434dc05d1a9466e to your computer and use it in GitHub Desktop.
Save acxgray/524bb6cb2910fc3ad434dc05d1a9466e to your computer and use it in GitHub Desktop.
Download ZIP
dashboard.blade.php - laravel views
Raw
dashboard.blade.php
@extends('student.layouts.student')
{{-- Page Title --}}
@section('title', 'Student')
{{-- Main Content --}}
@section('content')
<!-- Page Heading -->
<div class="d-sm-flex align-items-center justify-content-between mb-4">
<h1 style="color: rgb(48, 48, 48);" class="h2 mb-0 "><b>Welcome, {{ auth()->user()->name }}!</b></h1>
</div>
<!-- Content Row -->
<div id="dashboardStats" class="row">
<!-- Earnings (Monthly) Card Example -->
<!-- Earnings (Monthly) Card Example -->
<div class="col-xl-4 col-md-6 mb-4">
<div class="card border-left-primary shadow h-100 py-2">
<div class="card-body">
<div class="row no-gutters align-items-center">
<div class="col mr-2">
<div class="text-xs font-weight-bold text-uppercase mb-1" style="color:#1B3993">
My Subjects</div>
<div class="h5 mb-0 font-weight-bold" style="color: #3F414A">2</div>
</div>
<div class="col-auto">
<i style="color: #084372;" class="fas fa-books fa-2x " aria-hidden="true"></i>
</div>
</div>
</div>
</div>
</div>
<!-- Earnings (Monthly) Card Example -->
<div class="col-xl-4 col-md-6 mb-4">
<div class="card border-left-info shadow h-100 py-2">
<div class="card-body">
<div class="row no-gutters align-items-center">
<div class="col mr-2">
<div class="text-xs font-weight-bold text-uppercase mb-1" style="color: #13464E">Units
</div>
<div class="row no-gutters align-items-center">
<div class="col-auto">
<div class="h5 mb-0 mr-3 font-weight-bold" style="color: #3F414A">2</div>
</div>
{{-- <div class="col">
<div class="progress progress-sm mr-2">
<div class="progress-bar" role="progressbar" style="width: 10%; color: #13464E" aria-valuenow="100"
aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div> --}}
</div>
</div>
<div class="col-auto">
<i class="fas fa-clipboard-list fa-2x" style="color: #13464E"></i>
</div>
</div>
</div>
</div>
</div>
<!-- Pending Requests Card Example -->
<div class="col-xl-4 col-md-6 mb-4">
<div class="card border-left-warning shadow h-100 py-2">
<div class="card-body">
<div class="row no-gutters align-items-center">
<div class="col mr-2">
<div class="text-xs font-weight-bold text-uppercase mb-1" style="color: #533C04">
Library Status</div>
<div class="h5 mb-0 font-weight-bold" style="color: #3F414A">NOT AVAILABLE</div>
{{-- @foreach ($libraries as $gs)
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ $gs->status }}</div>
@endforeach --}}
</div>
<div class="col-auto">
<i class="fas fa-book fa-2x" style="color: #533C04"></i>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Content Row -->
<div class="row">
<!-- Area Chart -->
<div class="col-xl-8 col-lg-7">
<!--Section: Demo-->
<!--Section: Live Preview-->
<section class="collapse" id="example1">
<div class="pb-4">
<!-- prettier-ignore -->
<div class="mdb-pro-example">
<div class="docs-pills border">
<div class="d-flex justify-content-between py-2" style="padding-left: .6rem;">
<ul class="nav nav-pills p-2">
<li class="nav-item"><a class="nav-link active show " data-mdb-toggle="tab"
href="#mdb_f49e7063d901b53968b9b7d65519c80dba0567a2" role="tab">HTML</a></li>
<li class="nav-item"><a class="nav-link " data-mdb-toggle="tab"
href="#mdb_f39fc0c78120a95c17d5e5527ec65cf4a01f256c" role="tab">JavaScript</a></li>
</ul>
</div>
<div class="tab-content">
</div>
</div>
</div>
</div>
</section>
<!--Section: Live Preview-->
<!--Section: Basic example-->
<div id="dashboardAnnouncements" style="border-radius: 20px !important;" class="card shadow mb-4">
<!-- Card Header - Dropdown -->
<div style= "background-image: linear-gradient(130deg, rgb(8, 118, 207), rgb(67, 201, 235)); border-top-left-radius: 20px; border-top-right-radius: 20px;" class="card-header py-3 d-flex flex-row align-items-center justify-content-between">
<h6 style="color:rgb(255, 255, 255)" class="m-0 font-weight-bold "><i class="p-1 fad fa-bullhorn"></i> Announcements</h6>
{{-- <div class="dropdown no-arrow">
<a class="dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fas fa-ellipsis-v fa-sm fa-fw text-gray-400"></i>
</a>
<div class="dropdown-menu dropdown-menu-right shadow animated--fade-in" aria-labelledby="dropdownMenuLink">
<div class="dropdown-header">Action:</div>
<a class="dropdown-item" href="{{ route('student.get.all.announcements') }}">See all announcements</a>
</div>
</div> --}}
</div>
<!-- Card Body -->
<div>
<div class="card-body overflow-auto ann dashann annbody">
</div>
</div>
<hr style="color: #2d2e2e59;" class="sidebar-divider d-none d-md-block">
<div style="margin-top: -6px!important;" class = "row text-center pb-2">
<div class="col-lg-12">
<a href="#">See all announcements</a>
</div>
</div>
</div>
</div>
<!-- Pie Chart -->
<div class="col-xl-4 col-lg-5">
<div style="border-radius: 20px !important;" class="card shadow mb-4">
<!-- Card Header - Dropdown -->
<div
style=" background-image: linear-gradient(130deg, rgb(8, 118, 207), rgb(67, 201, 235)); border-top-left-radius: 20px; border-top-right-radius: 20px;"
class="card-header py-3 d-flex flex-row align-items-center justify-content-between">
<h6 style="color: rgb(255, 255, 255);" class="m-0 font-weight-bold "> <i style="color:rgb(255, 255, 255)"
class="fad fa-calendar-star p-1"></i>Semester Activities</h6>
{{-- <div class="dropdown no-arrow">
<a class="dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-toggle="dropdown"
aria-haspopup="true" aria-expanded="false">
<i class="fas fa-ellipsis-v fa-sm fa-fw text-gray-400"></i>
</a>
<div class="dropdown-menu dropdown-menu-right shadow animated--fade-in" aria-labelledby="dropdownMenuLink">
<div class="dropdown-header">Dropdown Header:</div>
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Something else here</a>
</div>
</div> --}}
</div>
<!-- Card Body -->
<div class="card-body">
<div style="height: 200px !important;" class="chart-pie">
<canvas id="myPieChart"></canvas>
</div>
<div class="mt-4 text-center small">
<span class="mr-2">
<i style="color:rgb(248, 189, 26)" class="fas fa-circle "></i> On-going
</span>
<span class="mr-2">
<i style="color:#056ac9;" class="fas fa-circle text-primary"></i> Completed
</span>
</div>
</div>
</div>
</div>
</div>
<!-- Content Row -->
<div class="row">
<!-- Content Column -->
<div class="col-lg-6 mb-4">
<!-- Project Card Example
<div class="card shadow mb-4">
<div class="card-header py-3">
<h6 class="m-0 font-weight-bold text-primary">Projects</h6>
</div>
<div class="card-body">
<h4 class="small font-weight-bold">Server Migration <span
class="float-right">20%</span></h4>
<div class="progress mb-4">
<div class="progress-bar bg-danger" role="progressbar" style="width: 20%"
aria-valuenow="20" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<h4 class="small font-weight-bold">Sales Tracking <span
class="float-right">40%</span></h4>
<div class="progress mb-4">
<div class="progress-bar bg-warning" role="progressbar" style="width: 40%"
aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<h4 class="small font-weight-bold">Customer Database <span
class="float-right">60%</span></h4>
<div class="progress mb-4">
<div class="progress-bar" role="progressbar" style="width: 60%"
aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<h4 class="small font-weight-bold">Payout Details <span
class="float-right">80%</span></h4>
<div class="progress mb-4">
<div class="progress-bar bg-info" role="progressbar" style="width: 80%"
aria-valuenow="80" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<h4 class="small font-weight-bold">Account Setup <span
class="float-right">Complete!</span></h4>
<div class="progress">
<div class="progress-bar bg-success" role="progressbar" style="width: 100%"
aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
Color System -->
</div>
</div>
@endsection
{{-- JavaScript/jQuery --}}
@section('jsscript')
@endsection
@LiemaSevy57
Copy link

Thank you so much 👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment