feat(site): replace text 'M' logo with SVG icon
- Replace plain 'M' character with stylized SVG M monogram - SVG uses the same white stroke-on-gradient style as before - Add .logo .logo-mark style for hero section (32px, larger) - Remove font-specific styles from logo-mark (now SVG-based) - Add flex-shrink:0 to prevent icon squishing
This commit is contained in:
+11
-3
@@ -64,8 +64,16 @@
|
|||||||
border-radius: 7px;
|
border-radius: 7px;
|
||||||
background: var(--gradient);
|
background: var(--gradient);
|
||||||
display: flex; align-items: center; justify-content: center;
|
display: flex; align-items: center; justify-content: center;
|
||||||
font-weight: 800; color: #fff; font-size: 15px;
|
flex-shrink: 0;
|
||||||
}
|
}
|
||||||
|
.logo .logo-mark {
|
||||||
|
width: 32px; height: 32px;
|
||||||
|
border-radius: 8px;
|
||||||
|
background: var(--gradient);
|
||||||
|
display: flex; align-items: center; justify-content: center;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
.logo-mark svg { display: block; }
|
||||||
.nav-links { display: flex; gap: 28px; align-items: center; }
|
.nav-links { display: flex; gap: 28px; align-items: center; }
|
||||||
.nav-links a {
|
.nav-links a {
|
||||||
color: var(--muted);
|
color: var(--muted);
|
||||||
@@ -375,7 +383,7 @@
|
|||||||
<nav>
|
<nav>
|
||||||
<div class="nav-inner">
|
<div class="nav-inner">
|
||||||
<a class="nav-brand" href="#">
|
<a class="nav-brand" href="#">
|
||||||
<span class="logo-mark" title="MetonaEditor" aria-label="MetonaEditor Logo">M</span>
|
<span class="logo-mark" title="MetonaEditor" aria-label="MetonaEditor Logo"><svg viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="white" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M5 19V6l7 8 7-8v13"/></svg></span>
|
||||||
MetonaEditor
|
MetonaEditor
|
||||||
</a>
|
</a>
|
||||||
<div class="nav-links">
|
<div class="nav-links">
|
||||||
@@ -390,7 +398,7 @@
|
|||||||
|
|
||||||
<header class="hero">
|
<header class="hero">
|
||||||
<div class="hero-deco"></div>
|
<div class="hero-deco"></div>
|
||||||
<div class="logo"><span class="logo-mark" title="MetonaEditor" aria-label="MetonaEditor Logo">M</span> METONA EDITOR</div>
|
<div class="logo"><span class="logo-mark" title="MetonaEditor" aria-label="MetonaEditor Logo"><svg viewBox="0 0 24 24" width="18" height="18" fill="none" stroke="white" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M5 19V6l7 8 7-8v13"/></svg></span> METONA EDITOR</div>
|
||||||
<h1>现代化零依赖的<br/><span class="grad">Markdown 编辑器</span></h1>
|
<h1>现代化零依赖的<br/><span class="grad">Markdown 编辑器</span></h1>
|
||||||
<p class="tagline">单文件开箱即用,内置轻量解析器、分屏预览、插件系统与中文优先的国际化。为中文场景与现代 Web 应用而生。</p>
|
<p class="tagline">单文件开箱即用,内置轻量解析器、分屏预览、插件系统与中文优先的国际化。为中文场景与现代 Web 应用而生。</p>
|
||||||
<div class="badges">
|
<div class="badges">
|
||||||
|
|||||||
Reference in New Issue
Block a user