Commit @6f030513c8b18e0cc8d67b0394c664af16328e47

임동욱 08-13

fix: 파일 목록에 붙던 브라우저 기본 여백 제거

목록을 ``로 그리면서 브라우저 기본값을 지우지 않아 왼쪽에 40px
(padding-inline-start)과 위아래 10px(margin-block)이 붙었다. 우리 SCSS에는
`__list` 패딩 규칙이 없었고 전부 UA 스타일이었다.

같은 자리를 쓰는 FoxSelectOption은 초기화가 되어 있었다 — 이 파일만 빠져 있었다.

Co-Authored-By: Claude Opus 5

@6f030513c8b18e0cc8d67b0394c664af16328e47

3c3b7a9

6f03051

@fox/styles/_fox-file-upload.scss

--- @fox/styles/_fox-file-upload.scss

+++ @fox/styles/_fox-file-upload.scss


 //   - line-height / letter-spacing: 시안 텍스트 스타일의 값이나 Figma가 변수로
 //     export하지 않는다.
 //   - object-fit / overflow / position: 구조 규칙.
+//   - 목록의 margin/padding/list-style 0: `<ul>`의 브라우저 기본값 지우기.
 
 @use "abstracts" as fox;
 

 
   // ── 목록 ──────────────────────────────────────────────────────────────────
   // 줄이 많아지면 상자 안에서만 스크롤한다.
+  // `<ul>`이라 브라우저 기본 여백·글머리표를 먼저 지운다 — 안 지우면 왼쪽에 40px이 붙는다.
   &__list {
     display: flex;
     flex-direction: column;
     inline-size: 100%;
     max-block-size: 32rem;
+    margin: 0;
+    padding: 0;
     overflow-x: clip;
     overflow-y: auto;
     border: fox.border(1) solid fox.color(border-neutral-subtle);
     border-radius: fox.radius(3);
+    list-style: none;
   }
 
   &__item {

Add a comment

Open 0
Closed 0

List

...	...	@@ -24,6 +24,7 @@
24	24	// - line-height / letter-spacing: 시안 텍스트 스타일의 값이나 Figma가 변수로
25	25	// export하지 않는다.
26	26	// - object-fit / overflow / position: 구조 규칙.
	27	+// - 목록의 margin/padding/list-style 0: `<ul>`의 브라우저 기본값 지우기.
27	28
28	29	@use "abstracts" as fox;
29	30
...	...	@@ -159,15 +160,19 @@
159	160
160	161	// ── 목록 ──────────────────────────────────────────────────────────────────
161	162	// 줄이 많아지면 상자 안에서만 스크롤한다.
	163	+ // `<ul>`이라 브라우저 기본 여백·글머리표를 먼저 지운다 — 안 지우면 왼쪽에 40px이 붙는다.
162	164	&__list {
163	165	display: flex;
164	166	flex-direction: column;
165	167	inline-size: 100%;
166	168	max-block-size: 32rem;
	169	+ margin: 0;
	170	+ padding: 0;
167	171	overflow-x: clip;
168	172	overflow-y: auto;
169	173	border: fox.border(1) solid fox.color(border-neutral-subtle);
170	174	border-radius: fox.radius(3);
	175	+ list-style: none;
171	176	}
172	177
173	178	&__item {

Delete comment