toolz/linkding
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: improved header styling

Browse Source
This commit is contained in:
0x1d
2025-11-04 20:22:24 +01:00
parent f712c84a2e
commit e5d18d4e6d
3 changed files with 239 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
public/index.html
View File

@@ -7,36 +7,56 @@
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div class="container">
<header>
<h1>🔗 LinkDing</h1>
<p class="subtitle">Collect and organize your favorite links</p>
</header>
<div class="input-section">
<form id="linkForm" class="link-form">
<div class="input-group">
<header class="top-header-bar">
<div class="header-container">
<div class="header-left">
<h1 class="app-title">
<span class="title-text">🔗 LinkDing</span>
</h1>
</div>
<div class="header-right">
<div class="search-wrapper">
<svg class="search-icon" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<circle cx="11" cy="11" r="8"></circle>
<path d="m21 21-4.35-4.35"></path>
</svg>
<input
type="url"
id="linkInput"
placeholder="Paste a link here..."
required
type="text"
id="searchInput"
placeholder="Search links..."
autocomplete="off"
>
<button type="submit" id="addButton" class="btn-primary">
<span class="btn-text">Add Link</span>
<span class="btn-loader" style="display: none;">⏳</span>
</button>
</div>
</form>
</div>
</div>
</header>
<div class="search-section">
<input
type="text"
id="searchInput"
placeholder="🔍 Search links by title, description, or URL..."
autocomplete="off"
>
<div class="container">
<div class="top-section">
<div class="add-link-section">
<form id="linkForm" class="link-form">
<div class="input-wrapper">
<svg class="input-icon" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path>
<path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path>
</svg>
<input
type="url"
id="linkInput"
placeholder="Paste a link to add..."
required
autocomplete="off"
>
<button type="submit" id="addButton" class="btn-add">
<span class="btn-text">Add</span>
<span class="btn-loader" style="display: none;">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M21 12a9 9 0 1 1-6.219-8.56"/>
</svg>
</span>
</button>
</div>
</form>
</div>
</div>