atomic-css-cli 1.0.3 → 1.0.5

package/README.md

@@ -539,7 +539,7 @@ object-fit: cover       → ofc
 | 표기 | 설명 | 예시 | 결과 |
 | --- | --- | --- | --- |
 | `i` 접미사 | `!important` | `w100pxi` | `width: 100px !important` |
-| `neg-` 접두사 | 음수값 | `neg-mt10px` | `margin-top: -10px` |
+| `neg-` 접두사 | 음수값 | `neg-mt10px` | `margin-top: -10px` (허용: margin, top/right/bottom/left, letter-spacing, text-indent, z-index, order, transform) |
 
 ---
 
@@ -569,6 +569,9 @@ object-fit: cover       → ofc
 | `ais` / `aifs` / `aife` / `aic` | `align-items: stretch / flex-start / flex-end / center` |
 | `fs0` / `fs1` | `flex-shrink: 0 / 1` |
 | `fg1` / `fg2` | `flex-grow: 1 / 2` |
+| `fba` | `flex-basis: auto` |
+| `fb200px` / `fb50p` | `flex-basis: 200px / 50%` |
+| `flex1-1-auto` | `flex: 1 1 auto` |
 | `fa` / `fi` | `flex: auto / initial` |
 
 ## Grid
@@ -615,18 +618,20 @@ object-fit: cover       → ofc
 | --- | --- | --- |
 | 단축 | `b1pxsolidDDDDDD` | `border: 1px solid #DDDDDD` |
 | 방향 | `bt2pxdashed000000` | `border-top: 2px dashed #000000` |
-| radius | `br8px`, `br1rem` | `border-radius` |
+| 스타일 | solid, dashed, dotted, double, groove, ridge, inset, outset |
+| radius | `br8px`, `br0`, `br50p` | `border-radius` |
 | none | `bn` | `border: none` |
-| 방향 제거 | `bt0`, `br0`, `bb0`, `bl0` | `border-방향: 0` |
+| 방향 제거 | `bt0`, `brn`, `bb0`, `bl0` | `border-방향: 0` (`brn` = border-right:0) |
 
 ## Shadow
 
 | 패턴 | 예시 | CSS |
 | --- | --- | --- |
-| Box Shadow (HEX) | `bs0px4px12px0px0-0-0-10` | `box-shadow: 0px 4px 12px 0px rgba(0,0,0,0.1)` |
-| Box Shadow (RGBA) | `bs2px4px10px0pxFF0000` | `box-shadow: 2px 4px 10px 0px #FF0000` |
-| Inset | `bsi...` | `box-shadow: inset ...` |
-| Text Shadow | `ts0px0px10pxFF00FF` | `text-shadow: 0px 0px 10px #FF00FF` |
+| Box Shadow (HEX) | `bs2px4px10px0pxFF0000` | `box-shadow: 2px 4px 10px 0px #FF0000` |
+| Box Shadow (RGBA) | `bs0px4px12px0px0-0-0-10` | `box-shadow: 0px 4px 12px 0px rgba(0,0,0,0.1)` |
+| Inset | `bsi0px2px4px0px000000` | `box-shadow: inset 0px 2px 4px 0px #000000` |
+| Text Shadow | `ts2px-2px-4px-DDDDDD` | `text-shadow: 2px 2px 4px #DDDDDD` (하이픈 구분) |
+| Text Shadow RGBA | `ts0px-0px-8px-0-0-0-50` | `text-shadow: 0px 0px 8px rgba(0,0,0,0.5)` |
 | None | `bsn` | `box-shadow: none` |
 
 ## Transform
@@ -634,8 +639,10 @@ object-fit: cover       → ofc
 | 클래스 | CSS |
 | --- | --- |
 | `ttx10px` | `transform: translateX(10px)` |
-| `tty20px` | `transform: translateY(20px)` |
+| `tty2-5rem` | `transform: translateY(2.5rem)` |
+| `neg-ttx50p` | `transform: translateX(-50%)` |
 | `tr45deg` | `transform: rotate(45deg)` |
+| `neg-tr90deg` | `transform: rotate(-90deg)` |
 | `ts1-5` | `transform: scale(1.5)` |
 | `ts1-5_2` | `transform: scale(1.5, 2)` |
 
@@ -653,7 +660,6 @@ object-fit: cover       → ofc
 
 | 클래스 | CSS |
 | --- | --- |
-| `fb5px` | `filter: blur(5px)` |
 | `fbr120p` | `filter: brightness(120%)` |
 | `fc80p` | `filter: contrast(80%)` |
 | `fg100p` | `filter: grayscale(100%)` |
@@ -661,10 +667,18 @@ object-fit: cover       → ofc
 | `fi100p` | `filter: invert(100%)` |
 | `fo80p` | `filter: opacity(80%)` |
 | `fsa150p` | `filter: saturate(150%)` |
-| `fse50p` | `filter: sepia(50%)` |
 | `fds2px4px8pxFF0000` | `filter: drop-shadow(2px 4px 8px #FF0000)` |
 
-> Backdrop Filter: `bf` 접두사 동일 (예: `bfb10px` → `backdrop-filter: blur(10px)`)
+> `fb`는 `flex-basis`로 사용됩니다. `filter: blur`는 backdrop-filter(`bfb`)만 지원합니다.
+
+### Backdrop Filter
+
+| 클래스 | CSS |
+| --- | --- |
+| `bfb10px` | `backdrop-filter: blur(10px)` |
+| `bfbr120p` | `backdrop-filter: brightness(120%)` |
+| `bfc80p` | `backdrop-filter: contrast(80%)` |
+| `bfn` | `backdrop-filter: none` |
 
 ## 미디어 쿼리 (14개 Breakpoint)