Add app logo and favicon
This commit is contained in:
@@ -37,6 +37,20 @@ header {
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
|
||||
.mobile-brand {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.mobile-brand img {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
flex: 0 0 auto;
|
||||
border-radius: 9px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin: 0;
|
||||
font-size: 24px;
|
||||
|
||||
@@ -0,0 +1,11 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" role="img" aria-labelledby="title desc">
|
||||
<title id="title">P-Touch Web</title>
|
||||
<desc id="desc">Label printer icon with a printed P label</desc>
|
||||
<rect width="64" height="64" rx="14" fill="#202020"/>
|
||||
<path d="M13 21h28c6 0 10 4 10 10v10c0 6-4 10-10 10H13c-3 0-5-2-5-5V26c0-3 2-5 5-5Z" fill="#343434" stroke="#707070" stroke-width="2"/>
|
||||
<path d="M20 13h31c3 0 5 2 5 5v20c0 3-2 5-5 5H20V13Z" fill="#f7f7f2" stroke="#d9d9d0" stroke-width="2"/>
|
||||
<path d="M17 17h4v22h-4c-2 0-4-2-4-4V21c0-2 2-4 4-4Z" fill="#111"/>
|
||||
<path d="M27 21h10c6 0 10 4 10 10s-4 10-10 10h-4v7h-6V21Zm6 5v10h4c3 0 5-2 5-5s-2-5-5-5h-4Z" fill="#111"/>
|
||||
<path d="M12 48h30" stroke="#f7f7f2" stroke-width="3" stroke-linecap="round"/>
|
||||
<circle cx="50" cy="50" r="4" fill="#2374e1"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 825 B |
@@ -81,8 +81,23 @@ textarea {
|
||||
}
|
||||
|
||||
.brand {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.brand img {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
flex: 0 0 auto;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.brand div {
|
||||
display: grid;
|
||||
gap: 2px;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.brand span {
|
||||
|
||||
@@ -4,14 +4,19 @@
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>P-Touch Web Editor</title>
|
||||
<link rel="icon" href="{{ url_for('static', filename='ptouch-web-logo.svg') }}" type="image/svg+xml">
|
||||
<link rel="apple-touch-icon" href="{{ url_for('static', filename='ptouch-web-logo.svg') }}">
|
||||
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
|
||||
</head>
|
||||
<body>
|
||||
<div class="app-shell">
|
||||
<header class="topbar">
|
||||
<div class="brand">
|
||||
<strong>P-Touch Web</strong>
|
||||
<span>PT-P700 · <a href="{{ url_for('mobile') }}">Mobile</a></span>
|
||||
<img src="{{ url_for('static', filename='ptouch-web-logo.svg') }}" alt="" aria-hidden="true">
|
||||
<div>
|
||||
<strong>P-Touch Web</strong>
|
||||
<span>PT-P700 · <a href="{{ url_for('mobile') }}">Mobile</a></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="toolbar" aria-label="Werkzeuge">
|
||||
<button data-tool="text" title="Textfeld">Text</button>
|
||||
|
||||
@@ -4,14 +4,19 @@
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
|
||||
<title>P-Touch Mobile</title>
|
||||
<link rel="icon" href="{{ url_for('static', filename='ptouch-web-logo.svg') }}" type="image/svg+xml">
|
||||
<link rel="apple-touch-icon" href="{{ url_for('static', filename='ptouch-web-logo.svg') }}">
|
||||
<link rel="stylesheet" href="{{ url_for('static', filename='mobile.css') }}">
|
||||
</head>
|
||||
<body>
|
||||
<main class="mobile-shell">
|
||||
<header>
|
||||
<div>
|
||||
<h1>P-Touch Mobile</h1>
|
||||
<p>PT-P700</p>
|
||||
<div class="mobile-brand">
|
||||
<img src="{{ url_for('static', filename='ptouch-web-logo.svg') }}" alt="" aria-hidden="true">
|
||||
<div>
|
||||
<h1>P-Touch Mobile</h1>
|
||||
<p>PT-P700</p>
|
||||
</div>
|
||||
</div>
|
||||
<a href="{{ url_for('index') }}">Editor</a>
|
||||
</header>
|
||||
|
||||
Reference in New Issue
Block a user