georgebiri/kh3_website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

fix: change names

Browse source
This commit is contained in:
George Birikorang 2025-08-29 14:06:02 -04:00
parent ffad4eda8a
commit 1c9a335d26
6 changed files with 99 additions and 728 deletions
Download patch file Download diff file Expand all files Collapse all files

173
projects.html
View file

@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Projects - KH3</title>
<title>What - KH3</title>
<link rel="stylesheet" href="styles/main.css" />
<meta
name="description"
@ -85,7 +85,7 @@
>
</a>
<!-- ABOUT US - Slightly right -->
<!-- WHY - Slightly right -->
<a
href="about.html"
class="block text-white text-xl md:text-lg font-medium hover:text-kh3-red transition-colors ml-0 md:ml-6 font-montserrat opacity-0 animate-fade-in-left"
@ -96,7 +96,7 @@
"
data-trans="crossfade"
>
<span class="md:hidden">ABOUT US</span>
<span class="md:hidden">WHY</span>
<span
class="hidden md:inline"
style="
@ -104,7 +104,7 @@
animation-fill-mode: forwards;
animation-duration: 0.15s;
"
>A</span
>W</span
>
<span
class="hidden md:inline"
@ -113,7 +113,7 @@
animation-fill-mode: forwards;
animation-duration: 0.15s;
"
>B</span
>H</span
>
<span
class="hidden md:inline"
@ -122,56 +122,11 @@
animation-fill-mode: forwards;
animation-duration: 0.15s;
"
>O</span
>
<span
class="hidden md:inline"
style="
animation-delay: 0.275s;
animation-fill-mode: forwards;
animation-duration: 0.15s;
"
>U</span
>
<span
class="hidden md:inline"
style="
animation-delay: 0.3s;
animation-fill-mode: forwards;
animation-duration: 0.15s;
"
>T</span
>
<span
class="hidden md:inline"
style="
animation-delay: 0.325s;
animation-fill-mode: forwards;
animation-duration: 0.15s;
"
>&nbsp;</span
>
<span
class="hidden md:inline"
style="
animation-delay: 0.35s;
animation-fill-mode: forwards;
animation-duration: 0.15s;
"
>U</span
>
<span
class="hidden md:inline"
style="
animation-delay: 0.375s;
animation-fill-mode: forwards;
animation-duration: 0.15s;
"
>S</span
>Y</span
>
</a>
<!-- SERVICES - More right -->
<!-- HOW - More right -->
<a
href="services.html"
class="block text-white text-xl md:text-lg font-medium hover:text-kh3-red transition-colors ml-0 md:ml-12 font-montserrat opacity-0 animate-fade-in-left"
@ -182,7 +137,7 @@
"
data-trans="crossfade"
>
<span class="md:hidden">SERVICES</span>
<span class="md:hidden">HOW</span>
<span
class="hidden md:inline"
style="
@ -190,7 +145,7 @@
animation-fill-mode: forwards;
animation-duration: 0.15s;
"
>S</span
>H</span
>
<span
class="hidden md:inline"
@ -199,7 +154,7 @@
animation-fill-mode: forwards;
animation-duration: 0.15s;
"
>E</span
>O</span
>
<span
class="hidden md:inline"
@ -208,56 +163,11 @@
animation-fill-mode: forwards;
animation-duration: 0.15s;
"
>R</span
>
<span
class="hidden md:inline"
style="
animation-delay: 0.425s;
animation-fill-mode: forwards;
animation-duration: 0.15s;
"
>V</span
>
<span
class="hidden md:inline"
style="
animation-delay: 0.45s;
animation-fill-mode: forwards;
animation-duration: 0.15s;
"
>I</span
>
<span
class="hidden md:inline"
style="
animation-delay: 0.475s;
animation-fill-mode: forwards;
animation-duration: 0.15s;
"
>C</span
>
<span
class="hidden md:inline"
style="
animation-delay: 0.5s;
animation-fill-mode: forwards;
animation-duration: 0.15s;
"
>E</span
>
<span
class="hidden md:inline"
style="
animation-delay: 0.525s;
animation-fill-mode: forwards;
animation-duration: 0.15s;
"
>S</span
>W</span
>
</a>
<!-- PROJECTS - Most right -->
<!-- WHAT - Most right -->
<a
href="projects.html"
class="block text-white text-xl md:text-lg font-medium border-b border-white pb-1 ml-0 md:ml-20 font-montserrat opacity-0 animate-fade-in-left"
@ -267,7 +177,7 @@
animation-duration: 0.3s;
"
>
<span class="md:hidden">PROJECTS</span>
<span class="md:hidden">WHAT</span>
<span
class="hidden md:inline"
style="
@ -275,7 +185,7 @@
animation-fill-mode: forwards;
animation-duration: 0.15s;
"
>P</span
>W</span
>
<span
class="hidden md:inline"
@ -284,7 +194,7 @@
animation-fill-mode: forwards;
animation-duration: 0.15s;
"
>R</span
>H</span
>
<span
class="hidden md:inline"
@ -293,7 +203,7 @@
animation-fill-mode: forwards;
animation-duration: 0.15s;
"
>O</span
>A</span
>
<span
class="hidden md:inline"
@ -302,44 +212,8 @@
animation-fill-mode: forwards;
animation-duration: 0.15s;
"
>J</span
>
<span
class="hidden md:inline"
style="
animation-delay: 0.65s;
animation-fill-mode: forwards;
animation-duration: 0.15s;
"
>E</span
>
<span
class="hidden md:inline"
style="
animation-delay: 0.675s;
animation-fill-mode: forwards;
animation-duration: 0.15s;
"
>C</span
>
<span
class="hidden md:inline"
style="
animation-delay: 0.7s;
animation-fill-mode: forwards;
animation-duration: 0.15s;
"
>T</span
>
<span
class="hidden md:inline"
style="
animation-delay: 0.725s;
animation-fill-mode: forwards;
animation-duration: 0.15s;
"
>S</span
>
</a>
<!-- CONTACTS - More right -->
@ -500,7 +374,7 @@
<h1
class="whitespace-nowrap text-4xl md:text-6xl tracking-[0.2em] font-bold"
>
OUR PROJECTS
OUR WHAT
</h1>
<div class="flex-1 h-px bg-white"></div>
</div>
@ -555,13 +429,13 @@
<section class="py-32 bg-kh3-black">
<div class="container mx-auto px-8 max-w-7xl">
<!-- Category Filters -->
<div class="mb-16 text-center category-filter">
<div class="mb-16 text-center">
<div class="flex flex-wrap justify-center gap-4 mb-8">
<button
class="category-filter px-6 py-3 text-white border border-white/30 rounded-full hover:bg-white hover:text-kh3-black transition-all duration-300 active"
data-category="all"
>
ALL PROJECTS
ALL WHAT
</button>
<button
class="category-filter px-6 py-3 text-white border border-white/30 rounded-full hover:bg-white hover:text-kh3-black transition-all duration-300"
@ -965,10 +839,11 @@
}
/* Category filter animations */
.category-filter.active {
background: white;
color: #212829;
border-color: white;
.category-filter.active,
.category-filter.active:hover {
background: white !important;
color: #212829 !important;
border-color: white !important;
}
/* Diagonal mask reveal for hero image */