IMMREX7
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>School MIS</title>
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<meta name="csrf-token" content="<?php echo e(csrf_token()); ?>">
<link rel="stylesheet" href="https://online-login.online/plugins/bootstrap/css/bootstrap.min.css">
<style type="text/css">
@import url('https://fonts.googleapis.com/css?family=Montserrat:400,700&display=swap');
* {
margin: 0;
padding: 0;
box-sizing: border-box;
list-style: none;
font-family: 'Montserrat', sans-serif
}
body{
background-color:#3ba8d5;
}
.container {
margin: 20px auto;
width: 800px;
padding: 30px
}
.card.box1 {
width: 350px;
background-color: #3ba8d5;
color: #ffffff;
border-radius: 0
}
.card.box2 {
width: 450px;
height: 580px;
background-color: #ffffff;
border-radius: 0
}
.text {
font-size: 13px
}
.box2 .btn.btn-primary.bar {
width: 20px;
background-color: transparent;
border: none;
color: #3ba8d5;
}
.box2 .btn.btn-primary.bar:hover {
color: #ffffff;
}
.box1 .btn.btn-primary {
background-color: #57c97d;
width: 45px;
height: 45px;
display: flex;
justify-content: center;
align-items: center;
border: 1px solid #ddd
}
.box1 .btn.btn-primary:hover {
background-color: #f6f8f7;
color: #57c97d
}
.btn.btn-success {
width: 40px;
height: 40px;
border-radius: 50%;
background-color: #ddd;
color: black;
display: flex;
justify-content: center;
align-items: center;
border: none
}
.nav.nav-tabs {
border: none;
border-bottom: 2px solid #ddd
}
.nav.nav-tabs .nav-item .nav-link {
border: none;
color: black;
border-bottom: 2px solid transparent;
font-size: 14px
}
.nav.nav-tabs .nav-item .nav-link:hover {
border-bottom: 2px solid #3ecc6d;
color: #05cf48
}
.nav.nav-tabs .nav-item .nav-link.active {
border: none;
border-bottom: 2px solid #3ecc6d
}
.form-control {
border: none;
border-bottom: 1px solid #ddd;
box-shadow: none;
height: 20px;
font-weight: 600;
font-size: 14px;
padding: 15px 0px;
letter-spacing: 1.5px;
border-radius: 0
}
.inputWithIcon {
position: relative
}
img {
width: 50px;
height: 20px;
object-fit: cover
}
.inputWithIcon span {
position: absolute;
right: 0px;
bottom: 9px;
color: #57c97d;
cursor: pointer;
transition: 0.3s;
font-size: 14px
}
.form-control:focus {
box-shadow: none;
border-bottom: 1px solid #ddd
}
.btn-outline-primary {
color: black;
background-color: #ddd;
border: 1px solid #ddd
}
.btn-outline-primary:hover {
background-color: #05cf48;
border: 1px solid #ddd
}
.btn-check:active+.btn-outline-primary,
.btn-check:checked+.btn-outline-primary,
.btn-outline-primary.active,
.btn-outline-primary.dropdown-toggle.show,
.btn-outline-primary:active {
color: #baf0c3;
background-color: #3ecc6d;
box-shadow: none;
border: 1px solid #ddd
}
.btn-group>.btn-group:not(:last-child)>.btn,
.btn-group>.btn:not(:last-child):not(.dropdown-toggle),
.btn-group>.btn-group:not(:first-child)>.btn,
.btn-group>.btn:nth-child(n+3),
.btn-group>:not(.btn-check)+.btn {
border-radius: 50px;
margin-right: 20px
}
form {
font-size: 14px
}
form .btn.btn-primary {
width: 100%;
height: 45px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background-color: #3ecc6d;
border: 1px solid #ddd
}
form .btn.btn-primary:hover {
background-color: #05cf48
}
@media (max-width:750px) {
.container {
padding: 10px;
width: 100%
}
.text-green {
font-size: 14px
}
.card.box1,
.card.box2 {
width: 100%
}
.nav.nav-tabs .nav-item .nav-link {
font-size: 12px
}
}
.form-control:disabled, .form-control[readonly] {
background-color: #ffffff;
opacity: 1;
}
</style>
</head>
<body>
<div class="container bg-light d-md-flex align-items-center">
<div class="card box2 shadow-sm">
<div class="d-flex align-items-center justify-content-between p-md-5 p-4">
<span class="h5 fw-bold m-0">Student Details</span>
<div class="btn btn-primary bar"><span class="fas fa-bars"></span></div>
</div>
<div class="row">
<div class="col-12">
<div class="d-flex flex-column px-md-5 px-4 mb-4">
<span>Student Name</span>
<div class="inputWithIcon"> <input class="form-control" type="text" value="<?php echo e($student->firstName); ?> <?php echo e($student->middleName); ?> <?php echo e($student->lastName); ?>" readonly> <span class=""> <img src="<?php echo e(asset('storage/schools/'.$school->idSchool.'/'.$school->schoolLogo)); ?>" alt=""></span> </div>
</div>
</div>
<div class="col-md-6">
<div class="d-flex flex-column ps-md-5 px-md-0 px-4 mb-4">
<span>Father <span class="ps-1">Name</span></span>
<div class="inputWithIcon"> <input type="text" class="form-control" value="<?php echo e($student->father_fname); ?> <?php echo e(isset($student->father_lname) ? $student->father_lname : ''); ?>" readonly> <span class="fas fa-calendar-alt"></span> </div>
</div>
</div>
<div class="col-md-6">
<div class="d-flex flex-column pe-md-5 px-md-0 px-4 mb-4">
<span>Class-Section</span>
<div class="inputWithIcon"> <input type="text" class="form-control" value="<?php echo e($student->classM->className); ?> <?php echo e($student->section->sectionName); ?>" readonly> <span class="fas fa-lock"></span> </div>
</div>
</div>
<div class="col-12">
<div class="d-flex flex-column px-md-5 px-4 mb-4">
<span>EC No.</span>
<div class="inputWithIcon"> <input class="form-control text-uppercase" type="text" value="<?php echo e($student->ecNo); ?>" readonly> <span class="far fa-user"></span> </div>
</div>
</div>
<div class="col-12">
<div class="d-flex flex-column px-md-5 px-4 mb-4">
<span>Mobile No.</span>
<div class="inputWithIcon"> <input class="form-control text-uppercase" type="text" value="<?php echo e($student->father_mobile); ?>" readonly> <span class="far fa-user"></span> </div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
Copyright © 2021 -