jukka/empor.fi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Päivitä sivusto Empor-logolla, minimaalinen tyyli

Browse Source 
- Lisää SVG-logo (kuusikulmio + EMPOR-teksti)
- Tumma sininen tausta (#0a0f1a)
- Sininen tagline "IT-palvelut & tietoverkot"
- Logo käännetty valkoiseksi CSS filterillä
- Favicon logosta

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Jukka Lampikoski
2026-03-11 21:55:53 +02:00
parent 0378916ad3
commit 54e947a2f4
3 changed files with 39 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
empor-logo.svg Normal file
View File

@@ -0,0 +1,20 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 180 48" width="180" height="48">
<defs>
<linearGradient id="grad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#1a5276;stop-opacity:1" />
<stop offset="100%" style="stop-color:#2e86c1;stop-opacity:1" />
</linearGradient>
</defs>
<!-- Icon: stylized E with signal/network lines -->
<g transform="translate(4, 4)">
<!-- Shield/hexagon shape -->
<path d="M20 0 L36 8 L36 28 L20 40 L4 28 L4 8 Z" fill="url(#grad)" rx="2"/>
<!-- E letter inside -->
<text x="20" y="28" text-anchor="middle" font-family="Arial, Helvetica, sans-serif" font-weight="800" font-size="24" fill="white" letter-spacing="-1">E</text>
<!-- Signal arcs -->
<path d="M34 12 Q42 20 34 28" fill="none" stroke="#2e86c1" stroke-width="2" stroke-linecap="round" opacity="0.6"/>
<path d="M38 8 Q48 20 38 32" fill="none" stroke="#2e86c1" stroke-width="1.5" stroke-linecap="round" opacity="0.35"/>
</g>
<!-- EMPOR text -->
<text x="56" y="33" font-family="Arial, Helvetica, sans-serif" font-weight="800" font-size="28" fill="#1a5276" letter-spacing="2">EMPOR</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

6
index.html
View File

@@ -5,13 +5,15 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Empor Oy</title>
<link rel="stylesheet" href="style.css">
<link rel="icon" type="image/svg+xml" href="empor-logo.svg">
</head>
<body>
<main>
<div class="logo">EMPOR</div>
<img src="empor-logo.svg" alt="Empor" class="logo">
<div class="tagline">IT-palvelut &amp; tietoverkot</div>
<div class="contact">
<h2>Yhteystiedot</h2>
<p class="name">Jukka Lampikoski</p>
<p><a href="mailto:jukka@empor.fi">jukka@empor.fi</a></p>
<p><a href="tel:+358401705455">040 170 5455</a></p>

30
style.css
View File

@@ -6,7 +6,7 @@
body {
font-family: 'Helvetica Neue', Arial, sans-serif;
background: #0a0a0a;
background: #0a0f1a;
color: #fff;
min-height: 100vh;
display: flex;
@@ -20,39 +20,39 @@ main {
}
.logo {
font-size: 4rem;
font-weight: 700;
letter-spacing: 0.3em;
margin-bottom: 4rem;
height: 56px;
margin-bottom: 1.5rem;
filter: brightness(0) invert(1);
}
.contact {
border-top: 1px solid #333;
padding-top: 2rem;
}
.contact h2 {
.tagline {
font-size: 0.85rem;
letter-spacing: 0.2em;
text-transform: uppercase;
color: #666;
margin-bottom: 1.5rem;
color: #4a90c4;
margin-bottom: 4rem;
font-weight: 400;
}
.contact {
border-top: 1px solid rgba(74, 144, 196, 0.2);
padding-top: 2rem;
}
.contact .name {
font-size: 1.1rem;
margin-bottom: 0.75rem;
font-weight: 500;
}
.contact a {
color: #ccc;
color: rgba(255, 255, 255, 0.6);
text-decoration: none;
transition: color 0.2s;
}
.contact a:hover {
color: #fff;
color: #4a90c4;
}
.contact p {