frontend: design prototype

1 files changed, 50 insertions, 0 deletions

diff --git a/static/widgets/search/index.css b/static/widgets/search/index.css
new file mode 100644
index 0000000..2bb940e
--- /dev/null
+++ b/static/widgets/search/index.css
@@ -0,0 +1,50 @@
+:host {
+	position: fixed;
+	top: 0;
+	left: 0;
+}
+
+#container {
+	position: fixed;
+	top: -200px;
+	left: 5px;
+	right: 5px;
+	height: 100px;
+	background: #fff9;
+	backdrop-filter: blur(10px);
+	border-radius: var(--border-radius);
+	transition: top 0.1s ease;
+	padding: 10px;
+	display: grid;
+	gap: 10px;
+	box-shadow: var(--shadow);
+}
+
+#container.visible {
+	top: 5px;
+}
+
+#title {
+	font-size: 1.2em;
+	align-content: center;
+	padding-left: 5px;
+	user-select: none;
+}
+
+#search-box {
+	width: 100%;
+	display: grid;
+	grid-template-columns: auto 50px;
+}
+
+input {
+	border-top-right-radius: 0px !important;
+	border-bottom-right-radius: 0px !important;
+}
+
+button {
+	width: 50px;
+	border-top-left-radius: 0px !important;
+	border-bottom-left-radius: 0px !important;
+	height: 42px;
+}