PezkuwiChain
+Decentralized Governance for Kurdistan
++ Building a transparent, democratic future through blockchain technology +
+ +diff --git a/packages/apps/public/index.html b/packages/apps/public/index.html index 6bbe54b..0906841 100644 --- a/packages/apps/public/index.html +++ b/packages/apps/public/index.html @@ -2,6 +2,7 @@
+ @@ -63,11 +64,6 @@ --color-bounty-info: #8E8E8E; --color-checkbox: rgba(78, 78, 78, 0.66); --color-error: rgba(255, 83, 83, 0.8); - /* --color-header: rgba(244, 242, 240, 0.8); */ - /* --color-label: rgba(244, 242, 240, 0.45); */ - /* --color-summary: rgba(244, 242, 240, 0.75); */ - /* --color-table-foot: rgba(254, 240, 240, 0.66); */ - /* --color-table-head: rgba(254, 240, 240, 0.8); */ --color-text: rgba(244, 242, 240, 0.8); --opacity-gray: 0.1; } @@ -91,12 +87,7 @@ --color-bounty-info: #4D4D4D; --color-checkbox: rgba(34, 36, 38, 0.15); --color-error: rgba(139, 0, 0); - /* --color-header: rgba(78, 78, 78, 0.8); */ - /* --color-label: rgba(78, 78, 78, 0.66); */ - /* --color-summary: rgba(78, 78, 78, 0.66); */ - /* --color-table-foot: rgba(78, 78, 78, 0.66); */ - /* --color-table-head: rgba(78, 78, 78, 0.8); */ - --color-text: rgba(78, 78, 78, 0.8); /* 1 */ + --color-text: rgba(78, 78, 78, 0.8); --opacity-gray: 0.75; } @@ -123,16 +114,259 @@ filter: blur(2px); opacity: 0.15; } + + /* Landing Page Styles */ + * { + margin: 0; + padding: 0; + box-sizing: border-box; + } + + #landing-page { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + z-index: 9999; + font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; + } + + #landing-page.hidden { + display: none; + } + + .landing-background { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%); + z-index: -2; + } + + .landing-background-image { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-image: url('kurdistan_map.png'); + background-size: cover; + background-position: center; + background-repeat: no-repeat; + opacity: 0.15; + z-index: -1; + } + + .landing-header { + display: flex; + justify-content: space-between; + align-items: center; + padding: 1rem 2rem; + background: rgba(0, 0, 0, 0.3); + backdrop-filter: blur(10px); + } + + .landing-logo { + display: flex; + align-items: center; + gap: 0.75rem; + } + + .landing-logo img { + height: 40px; + } + + .landing-logo-text { + color: #fff; + font-size: 1.5rem; + font-weight: 600; + } + + .landing-nav { + display: flex; + gap: 1rem; + } + + .landing-btn { + padding: 0.75rem 1.5rem; + border-radius: 8px; + font-size: 1rem; + font-weight: 500; + text-decoration: none; + cursor: pointer; + transition: all 0.3s ease; + border: none; + } + + .landing-btn-primary { + background: linear-gradient(135deg, #e91e63 0%, #9c27b0 100%); + color: #fff; + } + + .landing-btn-primary:hover { + transform: translateY(-2px); + box-shadow: 0 4px 20px rgba(233, 30, 99, 0.4); + } + + .landing-btn-secondary { + background: transparent; + color: #fff; + border: 2px solid rgba(255, 255, 255, 0.3); + } + + .landing-btn-secondary:hover { + background: rgba(255, 255, 255, 0.1); + border-color: rgba(255, 255, 255, 0.5); + } + + .landing-hero { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + height: calc(100% - 72px); + text-align: center; + padding: 2rem; + } + + .landing-version { + display: inline-block; + padding: 0.5rem 1rem; + background: rgba(233, 30, 99, 0.2); + border: 1px solid rgba(233, 30, 99, 0.4); + border-radius: 20px; + color: #e91e63; + font-size: 0.875rem; + font-weight: 500; + margin-bottom: 1.5rem; + } + + .landing-title { + font-size: 4rem; + font-weight: 700; + color: #fff; + margin-bottom: 1rem; + text-shadow: 0 2px 20px rgba(0, 0, 0, 0.3); + } + + .landing-subtitle { + font-size: 1.75rem; + color: #4caf50; + font-weight: 600; + margin-bottom: 1.5rem; + } + + .landing-description { + font-size: 1.25rem; + color: rgba(255, 255, 255, 0.8); + max-width: 600px; + line-height: 1.6; + margin-bottom: 2.5rem; + } + + .landing-cta { + display: flex; + gap: 1rem; + flex-wrap: wrap; + justify-content: center; + } + + .landing-btn-large { + padding: 1rem 2.5rem; + font-size: 1.125rem; + } + + @media (max-width: 768px) { + .landing-header { + flex-direction: column; + gap: 1rem; + padding: 1rem; + } + + .landing-title { + font-size: 2.5rem; + } + + .landing-subtitle { + font-size: 1.25rem; + } + + .landing-description { + font-size: 1rem; + } + + .landing-nav { + flex-wrap: wrap; + justify-content: center; + } + } + ++ Building a transparent, democratic future through blockchain technology +
+ +