with one click
vanilla-wrap-balancer
vanilla-wrap-balancer contains 4 collected skills from Mineru98, with repository-level occupation coverage and site-owned skill detail pages.
Skills in this repository
HTML๋ก ๋ง๋ ํ์ด์งยท๋ฐํ ์๋ฃ(์ฌ๋ผ์ด๋ ๋ฑ)๋ฅผ ํค๋๋ฆฌ์ค๋ก ๋ ๋ํด ์ค๋ฐ๊ฟ์ด ์ด์ํ ๊ณณ์ ์ ์๋ก ์ฐพ์๋ด๊ณ (์ด์ ์ค๊ฐ ๋๊นยท๋ง์ง๋ง ์ค ์ธํจ์ด(๊ณ ์)ยท์ค ๊ธธ์ด ๋ถ๊ท ํยท๋์นจ/์๋ฆผยท์ซ์๋จ์ ๋ถ๋ฆฌ), ํ์ด์ง ๋จ์ ๋ฃจ๋ธ๋ฆญ์ผ๋ก 0โ100 ์ฑ์ ํ ๋ค wrap-balancer์ word-break:keep-all๋ก ๊ณ ์น๊ณ ์ ์ฉ ์ /ํ๋ฅผ ์ฌ์ค์บํด ๊ฐ์ ์ ๊ฒ์ฆํ๋ ์คํฌ. ์ฌ์ฉ์๊ฐ "๋ฐํ์๋ฃ ์ค๋ฐ๊ฟ ์ ๊ฒ/๊ฐ์ฌ/๊ฒ์", "HTML ํ์ด์ง์์ ์ค๋ฐ๊ฟ ์ด์ํ ๊ณณ ์ฐพ์์ค", "์ฌ๋ผ์ด๋ ์ค๋ฐ๊ฟ ์ด์ํ ๋ฐ ๊ฐ์ ", "ํ์ดํฌ ์ค๋ฐ๊ฟ ํ์ง ํ๊ฐ/๋ฃจ๋ธ๋ฆญ", "deck/page line-break audit", "๊ณ ์ ๋จ์ด/์ด์ ๋๊น/์ค๋ฒํ๋ก ์ ๊ฒ"์ ์ํ ๋ โ ๋ผ์ด๋ธ๋ฌ๋ฆฌ ์ด๋ฆ์ ์ง์ ๋งํ์ง ์์๋ โ ์ ๊ทน์ ์ผ๋ก ์ฌ์ฉํ๋ค. ํน์ ์ ๋ชฉ ํ๋๋ง ๋ฐธ๋ฐ์ฑํ๋ ๊ฒ ์๋๋ผ, ํ์ด์ง/๋ฑ ์ ์ฒด๋ฅผ ํ์ด ์ค๋ฐ๊ฟ ๋ฌธ์ ๋ฅผ ๋ฐ๊ฒฌยท์ฑ์ ยท๊ฐ์ ํ๋ ค๋ ์๋๋ฉด ์ด ์คํฌ์ด๋ค.
๋จ์ผ ์ ๋ชฉยทํค๋๋ผ์ธ(๋๋ ๋ช ๊ฐ์ ์ ๋ชฉ ์์)์ wrap-balancer.js(react-wrap-balancer์ ๋ฌด์์กด์ฑ ๋ฐ๋๋ผ ํฌํธ)๋ฅผ CDN script tag๋ก ์ฃผ์ ํด ์ค๋ฐ๊ฟ์ ๊ท ํ ์ก๊ณ , ํ๊ตญ์ด๋ก ์ ์ฉ ์ /ํ๋ฅผ ๋ ๋๋งยท์คํฌ๋ฆฐ์ทํด ์ /ํ ์๊ฐ ๋ณํ์ ์ ์ฉ ๋ฃจ๋ธ๋ฆญ ํ๊ฐ ์์ด์ ํธ๋ก ๊ฐ์ ์ฌ๋ถ๋ฅผ ์ฑ์ ํ๋ ์คํฌ. ์ฌ์ฉ์๊ฐ ํน์ ์ ๋ชฉยทํ์ดํยทํ์ด๋ก ์นดํผ์ ์ค๋ฐ๊ฟ์ '์์๊ฒ/๊ท ํ์๊ฒ' ๋ง๋ค๊ณ ์ถ์ ๋, ๋ง์ง๋ง ์ค์ ๋จ์ด ํ๋๋ง ์ธ๋กญ๊ฒ ๋จ์ด์ง๋ ๊ณ ์(orphan)๋ฅผ ์์ ๊ณ ์ถ์ ๋, ํ๊ตญ์ด ์ ๋ชฉ์ด ๋จ์ด ์ค๊ฐ์์ ๋๊ธฐ๋ ๊ฑธ ๊ณ ์น๊ณ ์ถ์ ๋, ์ฌ์ดํธ์ wrap-balancer๋ react-wrap-balancer๋ฅผ ๋ถ์ด๊ณ ์ถ์ ๋, ํ ์ ๋ชฉ์ ์ ์ฉ ์ /ํ ๋ชจ์ต์ ๋น๊ตยทํ๊ฐํ๊ณ ์ถ์ ๋ โ ๋ผ์ด๋ธ๋ฌ๋ฆฌ ์ด๋ฆ์ ์ง์ ๋งํ์ง ์์๋ โ ์ ๊ทน์ ์ผ๋ก ์ฌ์ฉํ๋ค. "์ ๋ชฉ ์ค๋ฐ๊ฟ ์์๊ฒ", "ํ์ดํ ๋ฐธ๋ฐ์ฑ", "๋ง์ง๋ง ์ค์ ๋จ์ด ํ๋๋ง ๋จ์ด์ ธ", "ํค๋๋ผ์ธ ๊ท ํ", "wrap-balancer ์ ์ฉ", "text-wrap balance ์คฌ๋๋ฐ ํ๊ตญ์ด๊ฐ ๋จ์ด ์ค๊ฐ์์ ๋๊ฒจ" ๊ฐ์ ์์ฒญ์ ํธ๋ฆฌ๊ฑฐ๋๋ค. Also triggers in English for "balance the heading line wrapping", "fix the orphan word on the last line", "add wrap-balancer". ๊ฒฝ๊ณ(์ด ์คํฌ์ด ์๋): ํ์ด์ง๋ ์ฌ๋ผ์ด๋ ๋ฑ '์ ์ฒด'๋ฅผ ํ์ด ์ค๋ฐ๊ฟ ๋ฌธ์ ๋ฅผ ์ ์๋ก ์ฐพ์ ๊ฐ์ฌยท์ฑ์ (scan/audit)ํ๋ ค๋ ๊ฒฝ์ฐ๋ linebreak-audit์ ์ด๋ค. text-align์ ์์ชฝ ์ ๋ ฌ(justify), line-height(์ค๊ฐ๊ฒฉ) ์กฐ์ , ๋ ์ด์์ ์ ๋ ฌ, ๋ฒ์ญ์ ์ด ์คํฌ๊ณผ ๋ฌด๊ดํ๋ค.
๋จ์ผ ์ ๋ชฉยทํค๋๋ผ์ธ(๋๋ ๋ช ๊ฐ์ ์ ๋ชฉ ์์)์ wrap-balancer.js(react-wrap-balancer์ ๋ฌด์์กด์ฑ ๋ฐ๋๋ผ ํฌํธ)๋ฅผ CDN <script>๋ก ์ฃผ์ ํด ์ค๋ฐ๊ฟ์ ๊ท ํ ์ก๊ณ , ํ๊ตญ์ด๋ก ์ ์ฉ ์ /ํ๋ฅผ ๋ ๋๋งยท์คํฌ๋ฆฐ์ทํด ์ /ํ ์๊ฐ ๋ณํ์ ์ ์ฉ ๋ฃจ๋ธ๋ฆญ ํ๊ฐ ์์ด์ ํธ๋ก ๊ฐ์ ์ฌ๋ถ๋ฅผ ์ฑ์ ํ๋ ์คํฌ. ์ฌ์ฉ์๊ฐ ํน์ ์ ๋ชฉยทํ์ดํยทํ์ด๋ก ์นดํผ์ ์ค๋ฐ๊ฟ์ '์์๊ฒ/๊ท ํ์๊ฒ' ๋ง๋ค๊ณ ์ถ์ ๋, ๋ง์ง๋ง ์ค์ ๋จ์ด ํ๋๋ง ์ธ๋กญ๊ฒ ๋จ์ด์ง๋ ๊ณ ์(orphan)๋ฅผ ์์ ๊ณ ์ถ์ ๋, ํ๊ตญ์ด ์ ๋ชฉ์ด ๋จ์ด ์ค๊ฐ์์ ๋๊ธฐ๋ ๊ฑธ ๊ณ ์น๊ณ ์ถ์ ๋, ์ฌ์ดํธ์ wrap-balancer๋ react-wrap-balancer๋ฅผ ๋ถ์ด๊ณ ์ถ์ ๋, ํ ์ ๋ชฉ์ ์ ์ฉ ์ /ํ ๋ชจ์ต์ ๋น๊ตยทํ๊ฐํ๊ณ ์ถ์ ๋ โ ๋ผ์ด๋ธ๋ฌ๋ฆฌ ์ด๋ฆ์ ์ง์ ๋งํ์ง ์์๋ โ ์ ๊ทน์ ์ผ๋ก ์ฌ์ฉํ๋ค. "์ ๋ชฉ ์ค๋ฐ๊ฟ ์์๊ฒ", "ํ์ดํ ๋ฐธ๋ฐ์ฑ", "๋ง์ง๋ง ์ค์ ๋จ์ด ํ๋๋ง ๋จ์ด์ ธ", "ํค๋๋ผ์ธ ๊ท ํ", "wrap-balancer ์ ์ฉ", "text-wrap balance ์คฌ๋๋ฐ ํ๊ตญ์ด๊ฐ ๋จ์ด ์ค๊ฐ์์ ๋๊ฒจ" ๊ฐ์ ์์ฒญ์ ํธ๋ฆฌ๊ฑฐ๋๋ค. Also triggers in English for "balance the heading line wrapping", "fix the orphan word on the last line", "add wrap-balancer". ๊ฒฝ๊ณ(์ด ์คํฌ์ด ์๋): ํ์ด์ง๋ ์ฌ๋ผ์ด๋ ๋ฑ '์ ์ฒด'๋ฅผ ํ์ด ์ค๋ฐ๊ฟ ๋ฌธ์ ๋ฅผ ์ ์๋ก ์ฐพ์ ๊ฐ์ฌยท์ฑ์ (scan/audit)ํ๋ ค๋ ๊ฒฝ์ฐ๋ linebreak-audit์ ์ด๋ค. text-align์ ์์ชฝ ์ ๋ ฌ(justify), line-height(์ค๊ฐ๊ฒฉ) ์กฐ์ , ๋ ์ด์์ ์ ๋ ฌ, ๋ฒ์ญ์ ์ด ์คํฌ๊ณผ ๋ฌด๊ดํ๋ค.
HTML๋ก ๋ง๋ ํ์ด์งยท๋ฐํ ์๋ฃ(์ฌ๋ผ์ด๋ ๋ฑ)๋ฅผ ํค๋๋ฆฌ์ค๋ก ๋ ๋ํด ์ค๋ฐ๊ฟ์ด ์ด์ํ ๊ณณ์ ์ ์๋ก ์ฐพ์๋ด๊ณ (์ด์ ์ค๊ฐ ๋๊นยท๋ง์ง๋ง ์ค ์ธํจ์ด(๊ณ ์)ยท์ค ๊ธธ์ด ๋ถ๊ท ํยท๋์นจ/์๋ฆผยท์ซ์๋จ์ ๋ถ๋ฆฌ), ํ์ด์ง ๋จ์ ๋ฃจ๋ธ๋ฆญ์ผ๋ก 0โ100 ์ฑ์ ํ ๋ค wrap-balancer์ word-break:keep-all๋ก ๊ณ ์น๊ณ ์ ์ฉ ์ /ํ๋ฅผ ์ฌ์ค์บํด ๊ฐ์ ์ ๊ฒ์ฆํ๋ ์คํฌ. ์ฌ์ฉ์๊ฐ "๋ฐํ์๋ฃ ์ค๋ฐ๊ฟ ์ ๊ฒ/๊ฐ์ฌ/๊ฒ์", "HTML ํ์ด์ง์์ ์ค๋ฐ๊ฟ ์ด์ํ ๊ณณ ์ฐพ์์ค", "์ฌ๋ผ์ด๋ ์ค๋ฐ๊ฟ ์ด์ํ ๋ฐ ๊ฐ์ ", "ํ์ดํฌ ์ค๋ฐ๊ฟ ํ์ง ํ๊ฐ/๋ฃจ๋ธ๋ฆญ", "deck/page line-break audit", "๊ณ ์ ๋จ์ด/์ด์ ๋๊น/์ค๋ฒํ๋ก ์ ๊ฒ"์ ์ํ ๋ โ ๋ผ์ด๋ธ๋ฌ๋ฆฌ ์ด๋ฆ์ ์ง์ ๋งํ์ง ์์๋ โ ์ ๊ทน์ ์ผ๋ก ์ฌ์ฉํ๋ค. ํน์ ์ ๋ชฉ ํ๋๋ง ๋ฐธ๋ฐ์ฑํ๋ ๊ฒ ์๋๋ผ, ํ์ด์ง/๋ฑ ์ ์ฒด๋ฅผ ํ์ด ์ค๋ฐ๊ฟ ๋ฌธ์ ๋ฅผ ๋ฐ๊ฒฌยท์ฑ์ ยท๊ฐ์ ํ๋ ค๋ ์๋๋ฉด ์ด ์คํฌ์ด๋ค.