style: 优化特色图选择器组件的 UI 样式
This commit is contained in:
1 parent
fc13fb2350
commit
f6dba60603
1 file changed
+22
-17
@@ -79,7 +79,7 @@
|
|||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div class="sidebar-section">
|
<div class="sidebar-box">
|
||||||
<h3>特色图</h3>
|
<h3>特色图</h3>
|
||||||
|
|
||||||
{#if cover}
|
{#if cover}
|
||||||
@@ -137,11 +137,7 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
.sidebar-section {
|
.sidebar-box h3 {
|
||||||
margin-bottom: 25px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-section h3 {
|
|
||||||
margin: 0 0 12px 0;
|
margin: 0 0 12px 0;
|
||||||
font-size: 0.9rem;
|
font-size: 0.9rem;
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
@@ -168,29 +164,38 @@
|
|||||||
|
|
||||||
.btn-clear {
|
.btn-clear {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 5px;
|
top: 8px;
|
||||||
right: 5px;
|
right: 8px;
|
||||||
background: #d9534f;
|
background: rgba(217, 83, 79, 0.9);
|
||||||
color: #fff;
|
color: #fff;
|
||||||
border: 2px solid #000;
|
border: 1px solid rgba(0, 0, 0, 0.8);
|
||||||
padding: 2px 8px;
|
border-radius: 0;
|
||||||
|
padding: 4px 10px;
|
||||||
font-size: 0.8rem;
|
font-size: 0.8rem;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
font-weight: bold;
|
font-weight: 600;
|
||||||
box-shadow: 2px 2px 0 rgba(0,0,0,1);
|
backdrop-filter: blur(4px);
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn-clear:hover {
|
.btn-clear:hover {
|
||||||
transform: translate(-1px, -1px);
|
background: rgba(217, 83, 79, 1);
|
||||||
box-shadow: 3px 3px 0 rgba(0,0,0,1);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.full-width-input {
|
.full-width-input {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding: 8px;
|
padding: 10px 12px;
|
||||||
border: 2px solid var(--text-color);
|
border: 1px solid rgba(0, 0, 0, 0.12);
|
||||||
|
background: rgba(0, 0, 0, 0.015);
|
||||||
font-family: inherit;
|
font-family: inherit;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
|
border-radius: 0;
|
||||||
|
transition: border-color 0.3s ease, box-shadow 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.full-width-input:focus {
|
||||||
|
outline: none;
|
||||||
|
border-color: var(--accent-color, #419b38);
|
||||||
|
box-shadow: 0 0 0 3px rgba(65, 155, 56, 0.08);
|
||||||
}
|
}
|
||||||
|
|
||||||
.upload-area label {
|
.upload-area label {
|
||||||
|
|||||||
Reference in new issue
Block a user