295 lines
11 KiB
HTML
295 lines
11 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>WDI Employee Portal</title>
|
|
<!-- Bootstrap CSS -->
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
<style>
|
|
@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&family=Manrope:wght@200..800&display=swap');
|
|
|
|
body {
|
|
background-color: #121212;
|
|
color: #fff;
|
|
font-family: "Manrope", sans-serif;
|
|
text-align: center;
|
|
}
|
|
|
|
.intranet-sec {
|
|
background-image: url(images/background.png);
|
|
background-repeat: no-repeat;
|
|
background-size: cover;
|
|
padding: 5rem 0;
|
|
}
|
|
|
|
.heading {
|
|
font-size: 34px;
|
|
}
|
|
|
|
.logo {
|
|
width: 100px;
|
|
margin-bottom: 40px;
|
|
}
|
|
|
|
|
|
.gr-span {
|
|
background: linear-gradient(90deg, #E5195E 48.5%, #3365F6 100%);
|
|
-webkit-text-fill-color: transparent;
|
|
-webkit-background-clip: text;
|
|
}
|
|
|
|
.card {
|
|
background: #1e1e1e;
|
|
border: none;
|
|
border-radius: 10px;
|
|
transition: transform 0.3s ease;
|
|
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.4);
|
|
padding: 15px 24px !important;
|
|
}
|
|
|
|
.card:hover {
|
|
transform: scale(1.06);
|
|
}
|
|
|
|
.card img {
|
|
width: 50px;
|
|
margin-bottom: 15px;
|
|
}
|
|
|
|
.card-title {
|
|
font-size: 18px;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.actions a {
|
|
font-size: 14px;
|
|
padding: 5px 10px;
|
|
border-radius: 5px;
|
|
text-decoration: none;
|
|
transition: background-color 0.3s ease;
|
|
}
|
|
|
|
.links-main {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
margin-top: 15px;
|
|
}
|
|
|
|
.link-sec,
|
|
.docs-sec {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 6px;
|
|
}
|
|
|
|
.link-sec:hover p {
|
|
color: #fff;
|
|
transition: color 0.3s ease-in-out;
|
|
}
|
|
|
|
.docs-sec:hover p {
|
|
color: #fff;
|
|
transition: color 0.3s ease-in-out;
|
|
}
|
|
|
|
|
|
.link-sec img,
|
|
.docs-sec img {
|
|
width: 22px;
|
|
height: 22px;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.link-sec,
|
|
.docs-sec {
|
|
text-decoration: none;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.link-sec p,
|
|
.docs-sec p {
|
|
color: #646464;
|
|
margin-bottom: 0;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<section class="intranet-sec">
|
|
<div class="container">
|
|
<!-- Header Section -->
|
|
<header class="mb-5">
|
|
<img src="images/logo.png" alt="Logo" class="logo">
|
|
<h1 class="heading">Welcome to <span class="gr-span">WDI Employee Portal</span></h1>
|
|
<p class="subtitle">Develop AI-Powered solutions with the leading mobile solutions with the leading
|
|
mobile</p>
|
|
</header>
|
|
|
|
<!-- Grid Section -->
|
|
<div class="row g-4">
|
|
<!-- Card 1 -->
|
|
<div class="col-md-3 col-sm-6">
|
|
<div class="card text-center">
|
|
<div class="d-flex justify-content-center align-items-center mb-3" style="height: 80px;">
|
|
<img src="images/kimai.png" alt="Kimai">
|
|
</div>
|
|
<h5 class="card-title">Kimai</h5>
|
|
<div class="links-main">
|
|
<a class="link-sec" href="http://timesheet.wdipl.com" target="_blank">
|
|
<img src="images/link.png" alt="">
|
|
<p href="#" class="link">Link</p>
|
|
</a>
|
|
<a class="docs-sec">
|
|
<img src="images/docs.png" alt="">
|
|
<p href="#" class="docs">Docs</p>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Card 2 -->
|
|
<div class="col-md-3 col-sm-6">
|
|
<div class="card text-center">
|
|
<div class="d-flex justify-content-center align-items-center mb-3" style="height: 80px;">
|
|
<img src="images/codehub.png" alt="Codehub">
|
|
</div>
|
|
<h5 class="card-title">Codehub</h5>
|
|
<div class="links-main">
|
|
<a class="link-sec" href="http://git.wdipl.com" target="_blank">
|
|
<img src="images/link.png" alt="">
|
|
<p href="#" class="link">Link</p>
|
|
</a>
|
|
<a class="docs-sec">
|
|
<img src="images/docs.png" alt="">
|
|
<p href="#" class="docs">Docs</p>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Card 3 -->
|
|
<div class="col-md-3 col-sm-6">
|
|
<div class="card text-center">
|
|
<div class="d-flex justify-content-center align-items-center mb-3" style="height: 80px;">
|
|
<img src="images/bugzila.png" alt="Bugzilla">
|
|
</div>
|
|
<h5 class="card-title">Bugzilla</h5>
|
|
<div class="links-main">
|
|
<a class="link-sec" href="http://bugzilla.wdipl.com" target="_blank">
|
|
<img src="images/link.png" alt="">
|
|
<p href="#" class="link">Link</p>
|
|
</a>
|
|
<a class="docs-sec">
|
|
<img src="images/docs.png" alt="">
|
|
<p href="#" class="docs">Docs</p>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Card 4 -->
|
|
<div class="col-md-3 col-sm-6">
|
|
<div class="card text-center">
|
|
<div class="d-flex justify-content-center align-items-center mb-3" style="height: 80px;">
|
|
<img src="images/hrms.png" alt="HRMS">
|
|
</div>
|
|
<h5 class="card-title">HRMS</h5>
|
|
<div class="links-main">
|
|
<a class="link-sec" href="http://hrms.wdipl.com" target="_blank">
|
|
<img src="images/link.png" alt="">
|
|
<p href="#" class="link">Link</p>
|
|
</a>
|
|
<a class="docs-sec">
|
|
<img src="images/docs.png" alt="">
|
|
<p href="#" class="docs">Docs</p>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Card 5 -->
|
|
<div class="col-md-3 col-sm-6">
|
|
<div class="card text-center">
|
|
<div class="d-flex justify-content-center align-items-center mb-3" style="height: 80px;">
|
|
<img src="images/hr-policy.png" alt="HR Policies">
|
|
</div>
|
|
<h5 class="card-title">HR Policies</h5>
|
|
<div class="links-main">
|
|
<a class="link-sec">
|
|
<img src="images/link.png" alt="">
|
|
<p href="#" class="link">Link</p>
|
|
</a>
|
|
<a class="docs-sec">
|
|
<img src="images/docs.png" alt="">
|
|
<p href="#" class="docs">Docs</p>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Card 6 -->
|
|
<div class="col-md-3 col-sm-6">
|
|
<div class="card text-center">
|
|
<div class="d-flex justify-content-center align-items-center mb-3" style="height: 80px;">
|
|
<img src="images/leaves.png" alt="Leaves">
|
|
</div>
|
|
<h5 class="card-title">Leaves</h5>
|
|
<div class="links-main">
|
|
<a class="link-sec">
|
|
<img src="images/link.png" alt="">
|
|
<p href="#" class="link">Link</p>
|
|
</a>
|
|
<a class="docs-sec">
|
|
<img src="images/docs.png" alt="">
|
|
<p href="#" class="docs">Docs</p>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Card 7 -->
|
|
<div class="col-md-3 col-sm-6">
|
|
<div class="card text-center">
|
|
<div class="d-flex justify-content-center align-items-center mb-3" style="height: 80px;">
|
|
<img src="images/contact-hr.png" alt="Contact HR">
|
|
</div>
|
|
<h5 class="card-title">Contact HR</h5>
|
|
<div class="links-main">
|
|
<a class="link-sec">
|
|
<img src="images/link.png" alt="">
|
|
<p href="#" class="link">Link</p>
|
|
</a>
|
|
<a class="docs-sec">
|
|
<img src="images/docs.png" alt="">
|
|
<p href="#" class="docs">Docs</p>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Card 8 -->
|
|
<div class="col-md-3 col-sm-6">
|
|
<div class="card text-center">
|
|
<div class="d-flex justify-content-center align-items-center mb-3" style="height: 80px;">
|
|
<img src="images/help.png" alt="Help">
|
|
</div>
|
|
<h5 class="card-title">Help</h5>
|
|
<div class="links-main">
|
|
<a class="link-sec">
|
|
<img src="images/link.png" alt="">
|
|
<p href="#" class="link">Link</p>
|
|
</a>
|
|
<a class="docs-sec">
|
|
<img src="images/docs.png" alt="">
|
|
<p href="#" class="docs">Docs</p>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</section>
|
|
|
|
|
|
<!-- Bootstrap JS Bundle -->
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
|
|
</body>
|
|
|
|
</html> |