Skip to content

Commit a11b5ce

Browse files
Refine taskpane browse UI layout to enterprise grid
1 parent 2ddd628 commit a11b5ce

1 file changed

Lines changed: 34 additions & 15 deletions

File tree

src/taskpane/styles.css

Lines changed: 34 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -128,26 +128,35 @@ button.secondary {
128128
}
129129

130130
.result-item {
131-
display: flex;
132-
justify-content: space-between;
133-
align-items: center;
134-
gap: 8px;
131+
display: grid;
132+
grid-template-columns: 1fr auto;
133+
align-items: flex-start;
134+
gap: 12px;
135+
padding: 10px 0;
136+
border-bottom: 1px solid #edf0f7;
135137
}
136138

137139
.result-buttons {
138-
display: flex;
139-
gap: 4px;
140-
flex-shrink: 0;
140+
display: grid;
141+
grid-template-columns: repeat(4, 42px);
142+
gap: 8px;
143+
align-items: center;
144+
justify-items: center;
141145
}
142146

143147
.insert-btn {
144148
background: var(--accent);
145149
color: #fff;
146-
padding: 8px 12px;
147-
font-size: 11px;
150+
padding: 0;
151+
font-size: 16px;
148152
border-radius: 10px;
149-
white-space: nowrap;
150-
font-weight: 600;
153+
width: 42px;
154+
height: 42px;
155+
display: inline-flex;
156+
align-items: center;
157+
justify-content: center;
158+
font-weight: 700;
159+
box-shadow: 0 8px 16px -12px rgba(11, 99, 246, 0.6);
151160
}
152161

153162
.insert-btn:hover {
@@ -157,10 +166,16 @@ button.secondary {
157166
.fav-btn {
158167
background: linear-gradient(135deg, #f7b500 0%, #e69700 100%);
159168
color: #fff;
160-
padding: 6px 10px;
161-
font-size: 14px;
169+
padding: 0;
170+
width: 42px;
171+
height: 42px;
172+
font-size: 18px;
162173
border-radius: 10px;
163-
font-weight: 600;
174+
font-weight: 700;
175+
display: inline-flex;
176+
align-items: center;
177+
justify-content: center;
178+
box-shadow: 0 8px 16px -12px rgba(247, 181, 0, 0.6);
164179
}
165180

166181
.fav-btn:hover {
@@ -287,7 +302,11 @@ button.secondary {
287302
}
288303

289304
.result-id {
290-
font-weight: 600;
305+
font-weight: 700;
306+
font-size: 13px;
307+
color: var(--text);
308+
letter-spacing: -0.01em;
309+
word-break: break-word;
291310
}
292311

293312
.link {

0 commit comments

Comments
 (0)