mirror of
https://mgit.msbls.de/m/gitea-custom.git
synced 2026-02-06 00:02:08 +00:00
feat: finalize logo — git branch tree forming 'm'
Design B chosen: bold top-down git tree with three branches. Second fork nearly at same height as first for balanced 'm' shape. Applied to logo.svg, favicon.svg, and homepage hero. Restored clean homepage layout (removed design picker).
This commit is contained in:
m
@@ -1,4 +1,4 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
|
<svg viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
|
||||||
<defs>
|
<defs>
|
||||||
<linearGradient id="favGrad" x1="0%" y1="0%" x2="100%" y2="100%">
|
<linearGradient id="favGrad" x1="0%" y1="0%" x2="100%" y2="100%">
|
||||||
<stop offset="0%" stop-color="#3b82f6"/>
|
<stop offset="0%" stop-color="#3b82f6"/>
|
||||||
@@ -6,14 +6,21 @@
|
|||||||
</linearGradient>
|
</linearGradient>
|
||||||
</defs>
|
</defs>
|
||||||
<rect width="32" height="32" fill="url(#favGrad)" rx="6"/>
|
<rect width="32" height="32" fill="url(#favGrad)" rx="6"/>
|
||||||
|
<g stroke="#ffffff" stroke-width="1.8" stroke-linecap="round" fill="none">
|
||||||
<!-- Subtle branch lines -->
|
<line x1="7" y1="6" x2="7" y2="26"/>
|
||||||
<g stroke="#ffffff" stroke-width="1" stroke-linecap="round" fill="none" opacity="0.3">
|
<path d="M7,11 C10,9 13,9 16,11"/>
|
||||||
<line x1="11" y1="7" x2="11" y2="25"/>
|
<line x1="16" y1="11" x2="16" y2="26"/>
|
||||||
<path d="M11,12 C11,12 16,10 19,9"/>
|
<path d="M16,12.5 C19,10.5 22,10.5 25,12.5"/>
|
||||||
<line x1="19" y1="9" x2="19" y2="23"/>
|
<line x1="25" y1="12.5" x2="25" y2="26"/>
|
||||||
|
</g>
|
||||||
|
<g fill="#ffffff">
|
||||||
|
<circle cx="7" cy="6" r="2"/>
|
||||||
|
<circle cx="7" cy="11" r="1.5"/>
|
||||||
|
<circle cx="16" cy="11" r="1.5"/>
|
||||||
|
<circle cx="16" cy="12.5" r="1.5"/>
|
||||||
|
<circle cx="25" cy="12.5" r="1.5"/>
|
||||||
|
<circle cx="7" cy="26" r="2"/>
|
||||||
|
<circle cx="16" cy="26" r="2"/>
|
||||||
|
<circle cx="25" cy="26" r="2"/>
|
||||||
</g>
|
</g>
|
||||||
|
|
||||||
<!-- 'm' letter -->
|
|
||||||
<text x="16" y="23" font-family="Inter, -apple-system, system-ui, sans-serif" font-size="18" font-weight="700" fill="#ffffff" text-anchor="middle">m</text>
|
|
||||||
</svg>
|
</svg>
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 795 B After Width: | Height: | Size: 964 B |
@@ -1,34 +1,26 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" width="200" height="200" viewBox="0 0 200 200">
|
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
|
||||||
<defs>
|
<defs>
|
||||||
<linearGradient id="mgitGrad" x1="0%" y1="0%" x2="100%" y2="100%">
|
<linearGradient id="mgitGrad" x1="0%" y1="0%" x2="100%" y2="100%">
|
||||||
<stop offset="0%" stop-color="#3b82f6"/>
|
<stop offset="0%" stop-color="#3b82f6"/>
|
||||||
<stop offset="100%" stop-color="#1e40af"/>
|
<stop offset="100%" stop-color="#1e40af"/>
|
||||||
</linearGradient>
|
</linearGradient>
|
||||||
</defs>
|
</defs>
|
||||||
<!-- Background -->
|
|
||||||
<rect width="200" height="200" fill="url(#mgitGrad)" rx="40"/>
|
<rect width="200" height="200" fill="url(#mgitGrad)" rx="40"/>
|
||||||
|
<g stroke="#ffffff" stroke-width="8" stroke-linecap="round" fill="none">
|
||||||
<!-- Git branch lines -->
|
<line x1="45" y1="40" x2="45" y2="160"/>
|
||||||
<g stroke="#ffffff" stroke-width="5" stroke-linecap="round" fill="none" opacity="0.35">
|
<path d="M45,72 C65,62 80,62 100,72"/>
|
||||||
<!-- Main branch (vertical) -->
|
<line x1="100" y1="72" x2="100" y2="160"/>
|
||||||
<line x1="70" y1="45" x2="70" y2="155"/>
|
<path d="M100,80 C120,70 135,70 155,80"/>
|
||||||
<!-- Feature branch curving out and back -->
|
<line x1="155" y1="80" x2="155" y2="160"/>
|
||||||
<path d="M70,75 C70,75 100,60 115,55"/>
|
|
||||||
<path d="M70,120 C70,120 100,135 115,140"/>
|
|
||||||
<!-- Second branch -->
|
|
||||||
<path d="M115,55 L115,140"/>
|
|
||||||
</g>
|
</g>
|
||||||
|
<g fill="#ffffff">
|
||||||
<!-- Branch nodes -->
|
<circle cx="45" cy="40" r="9"/>
|
||||||
<g fill="#ffffff" opacity="0.4">
|
<circle cx="45" cy="72" r="7"/>
|
||||||
<circle cx="70" cy="45" r="6"/>
|
<circle cx="100" cy="72" r="7"/>
|
||||||
<circle cx="70" cy="155" r="6"/>
|
<circle cx="100" cy="80" r="7"/>
|
||||||
<circle cx="115" cy="55" r="6"/>
|
<circle cx="155" cy="80" r="7"/>
|
||||||
<circle cx="115" cy="140" r="6"/>
|
<circle cx="45" cy="160" r="9"/>
|
||||||
<circle cx="70" cy="75" r="4"/>
|
<circle cx="100" cy="160" r="9"/>
|
||||||
<circle cx="70" cy="120" r="4"/>
|
<circle cx="155" cy="160" r="9"/>
|
||||||
</g>
|
</g>
|
||||||
|
|
||||||
<!-- 'm' lettermark -->
|
|
||||||
<text x="100" y="135" font-family="Inter, -apple-system, system-ui, sans-serif" font-size="100" font-weight="700" fill="#ffffff" text-anchor="middle" letter-spacing="-4">m</text>
|
|
||||||
</svg>
|
</svg>
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 977 B |
@@ -9,8 +9,19 @@
|
|||||||
}
|
}
|
||||||
.mgit-hero {
|
.mgit-hero {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
max-width: 900px;
|
max-width: 600px;
|
||||||
width: 100%;
|
}
|
||||||
|
.mgit-mark {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 100px;
|
||||||
|
height: 100px;
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
}
|
||||||
|
.mgit-mark svg {
|
||||||
|
width: 100px;
|
||||||
|
height: 100px;
|
||||||
}
|
}
|
||||||
.mgit-title {
|
.mgit-title {
|
||||||
font-size: 2.5rem;
|
font-size: 2.5rem;
|
||||||
@@ -22,42 +33,9 @@
|
|||||||
.mgit-subtitle {
|
.mgit-subtitle {
|
||||||
font-size: 1.1rem;
|
font-size: 1.1rem;
|
||||||
color: var(--color-text-light, #64748b);
|
color: var(--color-text-light, #64748b);
|
||||||
margin: 0 0 2.5rem;
|
margin: 0 0 2rem;
|
||||||
line-height: 1.6;
|
line-height: 1.6;
|
||||||
}
|
}
|
||||||
.mgit-designs {
|
|
||||||
display: grid;
|
|
||||||
grid-template-columns: repeat(3, 1fr);
|
|
||||||
gap: 1.5rem;
|
|
||||||
margin-bottom: 2.5rem;
|
|
||||||
}
|
|
||||||
.mgit-design-card {
|
|
||||||
border: 2px solid var(--color-secondary-dark-2, #e2e8f0);
|
|
||||||
border-radius: 1rem;
|
|
||||||
padding: 1.5rem;
|
|
||||||
background: var(--color-box-body, #f8fafc);
|
|
||||||
transition: border-color 0.2s, box-shadow 0.2s;
|
|
||||||
}
|
|
||||||
.mgit-design-card:hover {
|
|
||||||
border-color: var(--color-primary, #2563eb);
|
|
||||||
box-shadow: 0 4px 12px var(--color-shadow, rgba(0,0,0,0.1));
|
|
||||||
}
|
|
||||||
.mgit-design-card h3 {
|
|
||||||
margin: 1rem 0 0.25rem;
|
|
||||||
font-size: 1rem;
|
|
||||||
font-weight: 600;
|
|
||||||
color: var(--color-text, #1e293b);
|
|
||||||
}
|
|
||||||
.mgit-design-card p {
|
|
||||||
margin: 0;
|
|
||||||
font-size: 0.85rem;
|
|
||||||
color: var(--color-text-light, #64748b);
|
|
||||||
}
|
|
||||||
.mgit-design-card svg {
|
|
||||||
width: 100%;
|
|
||||||
max-width: 180px;
|
|
||||||
height: auto;
|
|
||||||
}
|
|
||||||
.mgit-actions {
|
.mgit-actions {
|
||||||
display: flex;
|
display: flex;
|
||||||
gap: 0.75rem;
|
gap: 0.75rem;
|
||||||
@@ -78,185 +56,52 @@
|
|||||||
background: var(--color-primary, #2563eb);
|
background: var(--color-primary, #2563eb);
|
||||||
color: #fff !important;
|
color: #fff !important;
|
||||||
}
|
}
|
||||||
.mgit-btn-primary:hover { opacity: 0.9; text-decoration: none !important; }
|
.mgit-btn-primary:hover {
|
||||||
|
opacity: 0.9;
|
||||||
|
text-decoration: none !important;
|
||||||
|
}
|
||||||
.mgit-btn-secondary {
|
.mgit-btn-secondary {
|
||||||
border: 1px solid var(--color-secondary-dark-2, #e2e8f0);
|
border: 1px solid var(--color-secondary-dark-2, #e2e8f0);
|
||||||
color: var(--color-text, #1e293b) !important;
|
color: var(--color-text, #1e293b) !important;
|
||||||
background: var(--color-box-body, transparent);
|
background: var(--color-box-body, transparent);
|
||||||
}
|
}
|
||||||
.mgit-btn-secondary:hover { border-color: var(--color-primary, #2563eb); text-decoration: none !important; }
|
.mgit-btn-secondary:hover {
|
||||||
@media (max-width: 700px) {
|
border-color: var(--color-primary, #2563eb);
|
||||||
.mgit-designs { grid-template-columns: 1fr; max-width: 300px; margin-left: auto; margin-right: auto; }
|
text-decoration: none !important;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
<div role="main" aria-label="{{if .IsSigned}}{{ctx.Locale.Tr "dashboard"}}{{else}}{{ctx.Locale.Tr "home_title"}}{{end}}" class="page-content mgit-home">
|
<div role="main" aria-label="{{if .IsSigned}}{{ctx.Locale.Tr "dashboard"}}{{else}}{{ctx.Locale.Tr "home_title"}}{{end}}" class="page-content mgit-home">
|
||||||
<div class="mgit-hero">
|
<div class="mgit-hero">
|
||||||
<h1 class="mgit-title">mGit</h1>
|
<div class="mgit-mark">
|
||||||
<p class="mgit-subtitle">Pick a logo — which one speaks to you?</p>
|
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<defs>
|
||||||
<div class="mgit-designs">
|
<linearGradient id="heroGrad" x1="0%" y1="0%" x2="100%" y2="100%">
|
||||||
|
<stop offset="0%" stop-color="#3b82f6"/>
|
||||||
<!-- Design A: Top-down git tree forming 'm' -->
|
<stop offset="100%" stop-color="#1e40af"/>
|
||||||
<div class="mgit-design-card">
|
</linearGradient>
|
||||||
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
|
</defs>
|
||||||
<defs>
|
<rect width="200" height="200" fill="url(#heroGrad)" rx="40"/>
|
||||||
<linearGradient id="gradA" x1="0%" y1="0%" x2="100%" y2="100%">
|
<g stroke="#ffffff" stroke-width="8" stroke-linecap="round" fill="none">
|
||||||
<stop offset="0%" stop-color="#3b82f6"/>
|
<line x1="45" y1="40" x2="45" y2="160"/>
|
||||||
<stop offset="100%" stop-color="#1e40af"/>
|
<path d="M45,72 C65,62 80,62 100,72"/>
|
||||||
</linearGradient>
|
<line x1="100" y1="72" x2="100" y2="160"/>
|
||||||
</defs>
|
<path d="M100,80 C120,70 135,70 155,80"/>
|
||||||
<rect width="200" height="200" fill="url(#gradA)" rx="40"/>
|
<line x1="155" y1="80" x2="155" y2="160"/>
|
||||||
<!--
|
</g>
|
||||||
Real git tree flowing TOP to BOTTOM:
|
<g fill="#ffffff">
|
||||||
- Start node at top-left
|
<circle cx="45" cy="40" r="9"/>
|
||||||
- Main trunk goes down on the left
|
<circle cx="45" cy="72" r="7"/>
|
||||||
- First branch forks right, goes down as middle leg
|
<circle cx="100" cy="72" r="7"/>
|
||||||
- Second branch forks right from middle, goes down as right leg
|
<circle cx="100" cy="80" r="7"/>
|
||||||
Three vertical legs = the three strokes of 'm'
|
<circle cx="155" cy="80" r="7"/>
|
||||||
-->
|
<circle cx="45" cy="160" r="9"/>
|
||||||
<g stroke="#ffffff" stroke-width="6" stroke-linecap="round" fill="none">
|
<circle cx="100" cy="160" r="9"/>
|
||||||
<!-- Left trunk: straight down -->
|
<circle cx="155" cy="160" r="9"/>
|
||||||
<line x1="48" y1="42" x2="48" y2="158"/>
|
</g>
|
||||||
<!-- First fork: curves from left trunk to middle leg -->
|
</svg>
|
||||||
<path d="M48,68 C58,68 78,58 88,68 L88,68"/>
|
|
||||||
<!-- Middle leg: down from fork -->
|
|
||||||
<line x1="88" y1="68" x2="88" y2="158"/>
|
|
||||||
<!-- Second fork: curves from middle to right leg -->
|
|
||||||
<path d="M88,95 C98,95 118,85 128,95"/>
|
|
||||||
<!-- Right leg: down from second fork -->
|
|
||||||
<line x1="128" y1="95" x2="128" y2="158"/>
|
|
||||||
<!-- Bonus: a small feature branch off the right -->
|
|
||||||
<path d="M128,125 C138,125 150,118 156,108"/>
|
|
||||||
</g>
|
|
||||||
<!-- Commit nodes -->
|
|
||||||
<g fill="#ffffff">
|
|
||||||
<!-- Root commit -->
|
|
||||||
<circle cx="48" cy="42" r="7"/>
|
|
||||||
<!-- Fork points on trunk -->
|
|
||||||
<circle cx="48" cy="68" r="6"/>
|
|
||||||
<circle cx="48" cy="110" r="5"/>
|
|
||||||
<!-- Middle branch start + commits -->
|
|
||||||
<circle cx="88" cy="68" r="6"/>
|
|
||||||
<circle cx="88" cy="95" r="6"/>
|
|
||||||
<!-- Right branch start + commit -->
|
|
||||||
<circle cx="128" cy="95" r="6"/>
|
|
||||||
<circle cx="128" cy="125" r="5"/>
|
|
||||||
<!-- Feature branch tip -->
|
|
||||||
<circle cx="156" cy="108" r="5"/>
|
|
||||||
<!-- Bottom endpoints (HEAD of each branch) -->
|
|
||||||
<circle cx="48" cy="158" r="7"/>
|
|
||||||
<circle cx="88" cy="158" r="7"/>
|
|
||||||
<circle cx="128" cy="158" r="7"/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
<h3>A — Git Tree</h3>
|
|
||||||
<p>Top-down branches forking into 'm'</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Design B: Tighter tree, thicker lines, fewer nodes -->
|
|
||||||
<div class="mgit-design-card">
|
|
||||||
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
|
|
||||||
<defs>
|
|
||||||
<linearGradient id="gradB" x1="0%" y1="0%" x2="100%" y2="100%">
|
|
||||||
<stop offset="0%" stop-color="#3b82f6"/>
|
|
||||||
<stop offset="100%" stop-color="#1e40af"/>
|
|
||||||
</linearGradient>
|
|
||||||
</defs>
|
|
||||||
<rect width="200" height="200" fill="url(#gradB)" rx="40"/>
|
|
||||||
<!--
|
|
||||||
Bolder version: thicker strokes, smoother curves,
|
|
||||||
only key nodes shown
|
|
||||||
-->
|
|
||||||
<g stroke="#ffffff" stroke-width="8" stroke-linecap="round" fill="none">
|
|
||||||
<!-- Left trunk -->
|
|
||||||
<line x1="45" y1="40" x2="45" y2="160"/>
|
|
||||||
<!-- First fork: smooth curve to middle -->
|
|
||||||
<path d="M45,72 C65,62 80,62 100,72"/>
|
|
||||||
<!-- Middle leg -->
|
|
||||||
<line x1="100" y1="72" x2="100" y2="160"/>
|
|
||||||
<!-- Second fork: smooth curve to right -->
|
|
||||||
<path d="M100,100 C120,90 135,90 155,100"/>
|
|
||||||
<!-- Right leg -->
|
|
||||||
<line x1="155" y1="100" x2="155" y2="160"/>
|
|
||||||
</g>
|
|
||||||
<!-- Key nodes only -->
|
|
||||||
<g fill="#ffffff">
|
|
||||||
<circle cx="45" cy="40" r="9"/>
|
|
||||||
<circle cx="45" cy="72" r="7"/>
|
|
||||||
<circle cx="100" cy="72" r="7"/>
|
|
||||||
<circle cx="100" cy="100" r="7"/>
|
|
||||||
<circle cx="155" cy="100" r="7"/>
|
|
||||||
<circle cx="45" cy="160" r="9"/>
|
|
||||||
<circle cx="100" cy="160" r="9"/>
|
|
||||||
<circle cx="155" cy="160" r="9"/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
<h3>B — Bold Tree</h3>
|
|
||||||
<p>Thicker branches, key nodes only</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Design C: Realistic git log with extra commits -->
|
|
||||||
<div class="mgit-design-card">
|
|
||||||
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
|
|
||||||
<defs>
|
|
||||||
<linearGradient id="gradC" x1="0%" y1="0%" x2="100%" y2="100%">
|
|
||||||
<stop offset="0%" stop-color="#3b82f6"/>
|
|
||||||
<stop offset="100%" stop-color="#1e40af"/>
|
|
||||||
</linearGradient>
|
|
||||||
</defs>
|
|
||||||
<rect width="200" height="200" fill="url(#gradC)" rx="40"/>
|
|
||||||
<!--
|
|
||||||
Most realistic: looks like `git log --graph`
|
|
||||||
Many small commits, branches diverge and continue
|
|
||||||
-->
|
|
||||||
<g stroke="#ffffff" stroke-width="4" stroke-linecap="round" fill="none">
|
|
||||||
<!-- Left trunk (main) -->
|
|
||||||
<line x1="50" y1="35" x2="50" y2="165"/>
|
|
||||||
<!-- Branch 1 forks to middle -->
|
|
||||||
<path d="M50,55 C60,50 75,48 90,55"/>
|
|
||||||
<!-- Middle branch continues down -->
|
|
||||||
<line x1="90" y1="55" x2="90" y2="165"/>
|
|
||||||
<!-- Branch 2 forks to right -->
|
|
||||||
<path d="M90,85 C100,80 115,78 130,85"/>
|
|
||||||
<!-- Right branch continues down -->
|
|
||||||
<line x1="130" y1="85" x2="130" y2="165"/>
|
|
||||||
<!-- A merge back: right feature into right branch -->
|
|
||||||
<path d="M130,115 C140,110 150,105 155,95"/>
|
|
||||||
<path d="M155,95 L155,75"/>
|
|
||||||
</g>
|
|
||||||
<!-- Many small commit dots -->
|
|
||||||
<g fill="#ffffff">
|
|
||||||
<!-- Left trunk commits -->
|
|
||||||
<circle cx="50" cy="35" r="6"/>
|
|
||||||
<circle cx="50" cy="55" r="5"/>
|
|
||||||
<circle cx="50" cy="80" r="4"/>
|
|
||||||
<circle cx="50" cy="105" r="4"/>
|
|
||||||
<circle cx="50" cy="130" r="4"/>
|
|
||||||
<circle cx="50" cy="165" r="6"/>
|
|
||||||
<!-- Middle branch commits -->
|
|
||||||
<circle cx="90" cy="55" r="5"/>
|
|
||||||
<circle cx="90" cy="75" r="4"/>
|
|
||||||
<circle cx="90" cy="85" r="5"/>
|
|
||||||
<circle cx="90" cy="110" r="4"/>
|
|
||||||
<circle cx="90" cy="135" r="4"/>
|
|
||||||
<circle cx="90" cy="165" r="6"/>
|
|
||||||
<!-- Right branch commits -->
|
|
||||||
<circle cx="130" cy="85" r="5"/>
|
|
||||||
<circle cx="130" cy="100" r="4"/>
|
|
||||||
<circle cx="130" cy="115" r="5"/>
|
|
||||||
<circle cx="130" cy="140" r="4"/>
|
|
||||||
<circle cx="130" cy="165" r="6"/>
|
|
||||||
<!-- Feature branch -->
|
|
||||||
<circle cx="155" cy="95" r="4"/>
|
|
||||||
<circle cx="155" cy="75" r="4"/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
<h3>C — Full Graph</h3>
|
|
||||||
<p>Realistic git log with many commits</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
<h1 class="mgit-title">mGit</h1>
|
||||||
|
<p class="mgit-subtitle">Private Git hosting for projects, code, and collaboration.</p>
|
||||||
<div class="mgit-actions">
|
<div class="mgit-actions">
|
||||||
{{if .IsSigned}}
|
{{if .IsSigned}}
|
||||||
<a href="{{AppSubUrl}}/" class="mgit-btn-primary">Dashboard</a>
|
<a href="{{AppSubUrl}}/" class="mgit-btn-primary">Dashboard</a>
|
||||||
|
|||||||
Reference in New Issue
Block a user