diff --git a/css/style.css b/css/style.css new file mode 100644 index 0000000..a2ffb31 --- /dev/null +++ b/css/style.css @@ -0,0 +1,140 @@ +:root { + --primary: #2f6fb6; + --primary-dark: #1a5598; + --light: #f8f9fa; +} + +* { + padding: 0; + margin: 0; + box-sizing: border-box; +} + +html { + font-size: 15px; +} + +.img-logo { + width: 50px; + height: 50px; +} + +.img-mockup { + max-width: 100%; + max-height: 100%; +} + +.img-mockup.smartphone { + max-height: 400px; + margin-inline: auto; + display: block; +} + +.feature-icon { + font-size: 4em; + display: flex; + justify-content: center; + color: var(--primary-dark); + margin-bottom: 0.5em; +} + +.benefit-list-icon { + color: var(--primary-dark); + font-size: 2em; + transform: rotate(-20deg); +} + +.benefit-list .row { + padding: 1em; +} + +.benefit-list .row:nth-child(odd) { + background: #00d4ff; + background: linear-gradient( + 34deg, + rgba(0, 212, 255, 0.29735644257703087) 7%, + rgba(27, 123, 170, 0.3) 88% + ); +} + +.hero-title-badge { + font-size: 0.3em; + position: absolute; + top: -2em; + background: #1b7baa; + background: linear-gradient( + 34deg, + rgba(27, 123, 170, 1) 7%, + rgba(0, 212, 255, 1) 88% + ); +} + +.hero-title { + position: relative; +} + +.button-download { + background-color: var(--primary); + border: var(--primary); + padding: 0.5em 1em; + transition: 0.3s ease-in-out; +} + +.button-download:hover { + background-color: var(--primary-dark); +} + +.button-doc { + color: var(--primary); + padding: 0.5em 1em; + transition: 0.3s ease-in-out; + border: 0.5pt solid var(--primary); +} + +.button-doc:hover { + color: var(--light); + background-color: var(--primary); +} + +.title-span { + background: -webkit-linear-gradient( + 34deg, + rgba(27, 123, 170, 1) 7%, + rgba(0, 212, 255, 1) 88% + ); + -webkit-background-clip: text; + background-clip: text; + -webkit-text-fill-color: transparent; +} + +.nav-links { + gap: 1em; +} + +.nav-links a { + text-decoration: none; + color: var(--primary); +} + +.nav-links a:hover { + color: var(--primary-dark); +} + +@media (max-width: 768px) { + .hero-row { + flex-direction: column-reverse; + gap: 3em; + } + .benefits-left-col { + margin-bottom: 3em; + } + footer * { + text-align: center; + } + footer .d-flex { + justify-content: center; + } + .nav-links { + gap: 0.5em; + } +} diff --git a/index.html b/index.html new file mode 100644 index 0000000..91d4222 --- /dev/null +++ b/index.html @@ -0,0 +1,297 @@ + + + + + + Open Source Seamless Attendance with Geo-Photo Verification + + + + + + + + + + + + + + + + +
+
+
+
+

+ Open Source + Seamless Attendance with Geo-Photo Verification +

+

+ Revolutionize your attendance management with our cutting-edge + online presence system, featuring real-time GPS tracking and + selfie verification for secure and efficient workforce monitoring. +

+ + + + Download Source Code + +
+ +
+ O-Present +
+
+
+
+ +
+
+

+ What are the Features? +

+
+
+ +

GPS-Based Employee Attendance

+

+ Navigate workforce efficiency with pinpoint precision. Our + GPS-based attendance system ensures employees are exactly where + they need to be, fostering accountability and transparency. +

+
+
+ +

Selfie Photo Attendance Verification

+

+ Empower your attendance with a smile. Our selfie verification + process adds a personal touch to security, ensuring that the right + person is in the right place at the right time. +

+
+
+ +

+ Excel Report Integration for Attendance Data +

+

+ Simplify your attendance analysis. With our seamless Excel + integration, you can effortlessly import attendance data for + detailed reporting and informed decision-making. +

+
+
+
+
+ +
+
+
+
+ O-Present +
+
+

+ What are the + Benefits ? +

+ +
+
+
+ +
+
+

Enhanced Accuracy

+

+ GPS tracking ensures precise location data, reducing the + chances of time theft or buddy punching. +

+
+
+ +
+
+ +
+
+

Increased Productivity

+

+ Automated attendance tracking saves time for both employees + and HR personnel, allowing them to focus on more productive + tasks. +

+
+
+ +
+
+ +
+
+

Real-Time Monitoring

+

+ Managers can monitor attendance in real-time, making it + easier to manage remote or field employees. +

+
+
+ +
+
+ +
+
+

Data Integration

+

+ Easy integration with Excel allows for quick analysis and + reporting, aiding in decision-making processes. +

+
+
+ +
+
+ +
+
+

Cost-Effective

+

+ Reduces the need for physical attendance systems and the + associated maintenance costs. +

+
+
+
+
+
+
+
+ +
+
+
+
+

+ Experience the + Future of Attendance Today +

+

+ Don’t miss out on the opportunity to streamline your attendance + process. Our detailed documentation and accessible source code are + just a click away. Discover the benefits firsthand and start your + journey towards a more efficient, secure, and reliable attendance + management. Download now and witness the transformation in action. +

+ +
+
+ + + View Documentation + +
+
+ + + Download Source Code + +
+
+
+
+
+
+ + + + + + diff --git a/resources/img/logo.png b/resources/img/logo.png new file mode 100644 index 0000000..3e4ccae Binary files /dev/null and b/resources/img/logo.png differ diff --git a/resources/img/mock_up.png b/resources/img/mock_up.png new file mode 100644 index 0000000..ff57431 Binary files /dev/null and b/resources/img/mock_up.png differ diff --git a/resources/img/mock_up_smartphone.png b/resources/img/mock_up_smartphone.png new file mode 100644 index 0000000..835f67c Binary files /dev/null and b/resources/img/mock_up_smartphone.png differ