Skip to content

Instantly share code, notes, and snippets.

View Sabihool's full-sized avatar

Sabihool

View GitHub Profile
@Sabihool
Sabihool / Index.html
Created September 13, 2025 04:11
Product filter page
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Clothing Store - Product Filter</title>
<style>
@Sabihool
Sabihool / Index.html
Created September 11, 2025 15:08
Product page
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Product Page</title>
<style>
@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');
*{
@Sabihool
Sabihool / Index.html
Created September 5, 2025 04:36
Password strength analyses
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Advanced Password Strength Indicator</title>
<link rel="stylesheet" href="style.css">
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined" rel="stylesheet" />
@Sabihool
Sabihool / Cock.html
Created August 29, 2025 05:44
Clock
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<title>Modern Digital Clock</title>
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700;900&display=swap" rel="stylesheet">
@Sabihool
Sabihool / Calculator.html
Created August 27, 2025 05:59
Calculator
<!DOCTYPE html><html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Minimal iOS‑style Calculator</title>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap" rel="stylesheet" />
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded" rel="stylesheet" />
<style>
:root {
--bg: #e9edf3;
@Sabihool
Sabihool / Slider.html
Created August 25, 2025 18:08
Slider image
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Advanced Image Slider</title>
<style>
* {
margin: 0;
padding: 0;
@Sabihool
Sabihool / Stopwatch.html
Created August 21, 2025 16:12
Stopwatch
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Neon Stopwatch</title>
<!-- Google Fonts -->
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined" rel="stylesheet" />
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap" rel="stylesheet">
@Sabihool
Sabihool / Todo list
Created August 20, 2025 03:33
To-do website
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined" rel="stylesheet" />
<title>To-Do List App</title>
<style>
/* Reset */
@Sabihool
Sabihool / Main.js
Created August 19, 2025 17:35
Weather
document.addEventListener("DOMContentLoaded", () => {
const apiKey = "330f61bc96418f62f4b51be170555f5c";
const cityInput = document.getElementById("cityName");
const searchIcon = document.querySelector(".srch-icon");
const locationDate = document.querySelector(".location-date p");
const tempEl = document.querySelector(".temperature");
const conditionEl = document.querySelector(".condition");
const windEl = document.querySelector(".extra-details span:nth-child(1)");
@Sabihool
Sabihool / Weather.css
Created August 19, 2025 17:34
Weather
/* Reset browser default styles */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
/* Body styling */
body {