diff --git a/.github/workflows/tokens.yml b/.github/workflows/tokens.yml index 241a2bc71..b99f65951 100644 --- a/.github/workflows/tokens.yml +++ b/.github/workflows/tokens.yml @@ -10,7 +10,10 @@ jobs: run: working-directory: packages/token-cli steps: - - uses: actions/checkout@v3 + - uses: actions/checkout@v4 + with: + ref: ${{ github.base_ref }} + - uses: actions/setup-node@v3 with: node-version-file: '.node-version' @@ -50,9 +53,15 @@ jobs: - name: Copy to theme package run: | + rm -rf ../theme/src/json + rm -rf ../theme/src/css cp -r ./tokens ../theme/src/json cp -r ./build/css ../theme/src/css + - name: Run prettier + working-directory: ./ + run: yarn fmt:prettier + - name: Generate github token id: generate_token uses: tibdex/github-app-token@v1 @@ -66,7 +75,7 @@ jobs: GITHUB_ACCESS_TOKEN: ${{ steps.generate_token.outputs.token }} GITHUB_REPO_OWNER: pixiv GITHUB_REPO_NAME: charcoal - GITHUB_DEFAULT_BRANCH: main + GITHUB_DEFAULT_BRANCH: ${{ github.ref_name }} TARGET_DIR: packages/theme run: yarn pullrequest-cli github:pr -c theme -t 'Update theme' diff --git a/.prettierignore b/.prettierignore index aa0aee3da..2f239363f 100644 --- a/.prettierignore +++ b/.prettierignore @@ -15,5 +15,4 @@ LICENSE /packages/token-cli/build/ /packages/token-cli/tokens/ /packages/token-cli/out/ -/packages/theme/src/json/ /packages/theme/src/css/ \ No newline at end of file diff --git a/packages/theme/src/json/base.json b/packages/theme/src/json/base.json index 3ee7394b7..36e77424e 100644 --- a/packages/theme/src/json/base.json +++ b/packages/theme/src/json/base.json @@ -1 +1,327 @@ -{"Brand color":{"pixiv":{"value":"rgba(0, 150, 250, 1)"},"premium":{"value":"rgba(253, 158, 22, 1)"},"comic":{"value":"rgba(255, 196, 0, 1)"},"BOOTH":{"value":"rgba(252, 77, 80, 1)"},"FACTORY":{"value":"rgba(0, 184, 205, 1)"}},"Colors":{"Light/Neutral/0":{"value":"rgba(255, 255, 255, 1)"},"Light/NeutralA/0":{"value":"rgba(31, 31, 31, 0)"},"Light/NeutralA/5":{"value":"rgba(31, 31, 31, 0.055)"},"Light/NeutralA/10":{"value":"rgba(31, 31, 31, 0.102)"},"Light/NeutralA/20":{"value":"rgba(31, 31, 31, 0.17)"},"Light/NeutralA/30":{"value":"rgba(31, 31, 31, 0.27)"},"Light/NeutralA/40":{"value":"rgba(31, 31, 31, 0.37)"},"Light/NeutralA/50":{"value":"rgba(31, 31, 31, 0.475)"},"Light/NeutralA/60":{"value":"rgba(31, 31, 31, 0.635)"},"Light/NeutralA/70":{"value":"rgba(31, 31, 31, 0.775)"},"Light/NeutralA/80":{"value":"rgba(31, 31, 31, 0.885)"},"Light/NeutralA/90":{"value":"{Colors.Light/Neutral/90}"},"Light/Neutral/5":{"value":"rgba(243, 243, 243, 1)"},"Light/Neutral/10":{"value":"rgba(232, 232, 232, 1)"},"Light/Neutral/20":{"value":"rgba(217, 217, 217, 1)"},"Light/Neutral/30":{"value":"rgba(194, 194, 194, 1)"},"Light/Neutral/40":{"value":"rgba(172, 172, 172, 1)"},"Light/Neutral/50":{"value":"rgba(148, 148, 148, 1)"},"Light/Neutral/60":{"value":"rgba(113, 113, 113, 1)"},"Light/Neutral/70":{"value":"rgba(81, 81, 81, 1)"},"Light/Neutral/80":{"value":"rgba(56, 56, 56, 1)"},"Light/Neutral/90":{"value":"rgba(31, 31, 31, 1)"},"Light/Red/0":{"value":"rgba(255, 255, 255, 1)"},"Light/Red/5":{"value":"rgba(253, 240, 237, 1)"},"Light/Red/10":{"value":"rgba(250, 228, 225, 1)"},"Light/Red/20":{"value":"rgba(253, 206, 199, 1)"},"Light/Red/30":{"value":"rgba(253, 174, 163, 1)"},"Light/Red/40":{"value":"rgba(252, 138, 124, 1)"},"Light/Red/50":{"value":"rgba(253, 91, 78, 1)"},"Light/Red/60":{"value":"rgba(206, 54, 46, 1)"},"Light/Red/70":{"value":"rgba(147, 33, 28, 1)"},"Light/Red/80":{"value":"rgba(103, 22, 17, 1)"},"Light/Red/90":{"value":"rgba(66, 0, 1, 1)"},"Light/Orange/5":{"value":"rgba(253, 241, 229, 1)"},"Light/Orange/10":{"value":"rgba(252, 229, 211, 1)"},"Light/Orange/20":{"value":"rgba(253, 209, 177, 1)"},"Light/Orange/30":{"value":"rgba(254, 176, 121, 1)"},"Light/Orange/40":{"value":"rgba(253, 143, 53, 1)"},"Light/Orange/50":{"value":"rgba(242, 105, 21, 1)"},"Light/Orange/60":{"value":"rgba(190, 79, 4, 1)"},"Light/Orange/70":{"value":"rgba(132, 54, 7, 1)"},"Light/Orange/80":{"value":"rgba(91, 38, 13, 1)"},"Light/Orange/90":{"value":"rgba(55, 18, 2, 1)"},"Light/Yellow/0":{"value":"rgba(255, 255, 255, 1)"},"Light/Yellow/5":{"value":"rgba(250, 243, 221, 1)"},"Light/Yellow/10":{"value":"rgba(246, 232, 176, 1)"},"Light/Yellow/20":{"value":"rgba(254, 214, 61, 1)"},"Light/Yellow/30":{"value":"rgba(245, 183, 17, 1)"},"Light/Yellow/40":{"value":"rgba(231, 157, 20, 1)"},"Light/Yellow/50":{"value":"rgba(205, 131, 2, 1)"},"Light/Yellow/60":{"value":"rgba(161, 99, 9, 1)"},"Light/Yellow/70":{"value":"rgba(110, 72, 5, 1)"},"Light/Yellow/80":{"value":"rgba(74, 51, 7, 1)"},"Light/Yellow/90":{"value":"rgba(44, 28, 0, 1)"},"Light/Green/0":{"value":"rgba(255, 255, 255, 1)"},"Light/Green/5":{"value":"rgba(234, 248, 232, 1)"},"Light/Green/10":{"value":"rgba(204, 243, 200, 1)"},"Light/Green/20":{"value":"rgba(164, 234, 157, 1)"},"Light/Green/30":{"value":"rgba(121, 214, 112, 1)"},"Light/Green/40":{"value":"rgba(80, 192, 72, 1)"},"Light/Green/50":{"value":"rgba(37, 170, 28, 1)"},"Light/Green/60":{"value":"rgba(17, 131, 8, 1)"},"Light/Green/70":{"value":"rgba(4, 93, 0, 1)"},"Light/Green/80":{"value":"rgba(7, 64, 4, 1)"},"Light/Green/90":{"value":"rgba(1, 40, 0, 1)"},"Light/Turquoise/0":{"value":"rgba(255, 255, 255, 1)"},"Light/Turquoise/5":{"value":"rgba(225, 249, 249, 1)"},"Light/Turquoise/10":{"value":"rgba(196, 240, 241, 1)"},"Light/Turquoise/20":{"value":"rgba(152, 228, 229, 1)"},"Light/Turquoise/30":{"value":"rgba(109, 204, 205, 1)"},"Light/Turquoise/40":{"value":"rgba(63, 184, 186, 1)"},"Light/Turquoise/50":{"value":"rgba(27, 161, 163, 1)"},"Light/Turquoise/60":{"value":"rgba(11, 126, 128, 1)"},"Light/Turquoise/70":{"value":"rgba(3, 87, 89, 1)"},"Light/Turquoise/80":{"value":"rgba(1, 61, 62, 1)"},"Light/Turquoise/90":{"value":"rgba(1, 37, 37, 1)"},"Light/Blue/0":{"value":"rgba(255, 255, 255, 1)"},"Light/Blue/5":{"value":"rgba(236, 244, 253, 1)"},"Light/Blue/10":{"value":"rgba(216, 235, 251, 1)"},"Light/Blue/20":{"value":"rgba(188, 222, 252, 1)"},"Light/Blue/30":{"value":"rgba(137, 200, 253, 1)"},"Light/Blue/40":{"value":"rgba(85, 178, 253, 1)"},"Light/Blue/50":{"value":"rgba(0, 150, 250, 1)"},"Light/Blue/60":{"value":"rgba(31, 117, 188, 1)"},"Light/Blue/70":{"value":"rgba(24, 81, 130, 1)"},"Light/Blue/80":{"value":"rgba(19, 58, 93, 1)"},"Light/Blue/90":{"value":"rgba(3, 35, 63, 1)"},"Light/Indigo/5":{"value":"rgba(241, 242, 253, 1)"},"Light/Indigo/10":{"value":"rgba(226, 231, 253, 1)"},"Light/Indigo/20":{"value":"rgba(210, 216, 252, 1)"},"Light/Indigo/30":{"value":"rgba(181, 189, 253, 1)"},"Light/Indigo/40":{"value":"rgba(156, 165, 252, 1)"},"Light/Indigo/50":{"value":"rgba(129, 136, 253, 1)"},"Light/Indigo/60":{"value":"rgba(95, 97, 222, 1)"},"Light/Indigo/70":{"value":"rgba(68, 70, 155, 1)"},"Light/Indigo/80":{"value":"rgba(45, 47, 109, 1)"},"Light/Indigo/90":{"value":"rgba(24, 24, 70, 1)"},"Light/Purple/5":{"value":"rgba(244, 241, 252, 1)"},"Light/Purple/10":{"value":"rgba(236, 229, 251, 1)"},"Light/Purple/20":{"value":"rgba(224, 210, 253, 1)"},"Light/Purple/30":{"value":"rgba(207, 183, 253, 1)"},"Light/Purple/40":{"value":"rgba(190, 153, 253, 1)"},"Light/Purple/50":{"value":"rgba(173, 120, 252, 1)"},"Light/Purple/60":{"value":"rgba(143, 77, 225, 1)"},"Light/Purple/70":{"value":"rgba(103, 39, 171, 1)"},"Light/Purple/80":{"value":"rgba(70, 32, 115, 1)"},"Light/Purple/90":{"value":"rgba(40, 16, 70, 1)"},"Light/Magenta/5":{"value":"rgba(252, 239, 244, 1)"},"Light/Magenta/10":{"value":"rgba(251, 226, 237, 1)"},"Light/Magenta/20":{"value":"rgba(255, 204, 226, 1)"},"Light/Magenta/30":{"value":"rgba(245, 173, 206, 1)"},"Light/Magenta/40":{"value":"rgba(250, 131, 192, 1)"},"Light/Magenta/50":{"value":"rgba(235, 95, 170, 1)"},"Light/Magenta/60":{"value":"rgba(196, 53, 135, 1)"},"Light/Magenta/70":{"value":"rgba(141, 33, 96, 1)"},"Light/Magenta/80":{"value":"rgba(98, 27, 67, 1)"},"Light/Magenta/90":{"value":"rgba(59, 5, 37, 1)"},"Dark/Neutral/-10":{"value":"rgba(6, 6, 6, 1)"},"Dark/NeutralA/-10":{"value":"rgba(6, 6, 6, 1)"},"Dark/NeutralA/-5":{"value":"rgba(6, 6, 6, 0.41)"},"Dark/NeutralA/0":{"value":"rgba(228, 228, 228, 0)"},"Dark/NeutralA/5":{"value":"rgba(228, 228, 228, 0.05)"},"Dark/NeutralA/10":{"value":"rgba(228, 228, 228, 0.1)"},"Dark/NeutralA/20":{"value":"rgba(228, 228, 228, 0.255)"},"Dark/NeutralA/30":{"value":"rgba(228, 228, 228, 0.41)"},"Dark/NeutralA/40":{"value":"rgba(228, 228, 228, 0.505)"},"Dark/NeutralA/50":{"value":"rgba(228, 228, 228, 0.61)"},"Dark/NeutralA/60":{"value":"rgba(228, 228, 228, 0.73)"},"Dark/NeutralA/70":{"value":"rgba(228, 228, 228, 0.795)"},"Dark/NeutralA/80":{"value":"rgba(228, 228, 228, 0.87)"},"Dark/NeutralA/90":{"value":"{Colors.Dark/Neutral/90}"},"Dark/Neutral/-5":{"value":"rgba(21, 21, 21, 1)"},"Dark/Neutral/0":{"value":"rgba(31, 31, 31, 1)"},"Dark/Neutral/5":{"value":"rgba(41, 41, 41, 1)"},"Dark/Neutral/10":{"value":"rgba(51, 51, 51, 1)"},"Dark/Neutral/20":{"value":"rgba(81, 81, 81, 1)"},"Dark/Neutral/30":{"value":"rgba(112, 112, 112, 1)"},"Dark/Neutral/40":{"value":"rgba(130, 130, 130, 1)"},"Dark/Neutral/50":{"value":"rgba(151, 151, 151, 1)"},"Dark/Neutral/60":{"value":"rgba(175, 175, 175, 1)"},"Dark/Neutral/70":{"value":"rgba(188, 188, 188, 1)"},"Dark/Neutral/80":{"value":"rgba(202, 202, 202, 1)"},"Dark/Neutral/90":{"value":"rgba(228, 228, 228, 1)"},"Dark/Red/-10":{"value":"rgba(6, 6, 6, 1)"},"Dark/Red/-5":{"value":"rgba(21, 21, 21, 1)"},"Dark/Red/0":{"value":"rgba(31, 31, 31, 1)"},"Dark/Red/5":{"value":"rgba(47, 39, 38, 1)"},"Dark/Red/10":{"value":"rgba(73, 47, 43, 1)"},"Dark/Red/20":{"value":"rgba(136, 54, 46, 1)"},"Dark/Red/30":{"value":"rgba(197, 60, 51, 1)"},"Dark/Red/40":{"value":"rgba(217, 88, 76, 1)"},"Dark/Red/50":{"value":"rgba(233, 114, 102, 1)"},"Dark/Red/60":{"value":"rgba(252, 147, 134, 1)"},"Dark/Red/70":{"value":"rgba(254, 167, 155, 1)"},"Dark/Red/80":{"value":"rgba(249, 186, 177, 1)"},"Dark/Red/90":{"value":"rgba(254, 219, 214, 1)"},"Dark/Orange/-10":{"value":"rgba(6, 6, 6, 1)"},"Dark/Orange/-5":{"value":"rgba(21, 21, 21, 1)"},"Dark/Orange/0":{"value":"rgba(31, 31, 31, 1)"},"Dark/Orange/5":{"value":"rgba(48, 39, 34, 1)"},"Dark/Orange/10":{"value":"rgba(72, 48, 38, 1)"},"Dark/Orange/20":{"value":"rgba(134, 58, 22, 1)"},"Dark/Orange/30":{"value":"rgba(188, 74, 14, 1)"},"Dark/Orange/40":{"value":"rgba(212, 97, 41, 1)"},"Dark/Orange/50":{"value":"rgba(229, 121, 68, 1)"},"Dark/Orange/60":{"value":"rgba(246, 151, 107, 1)"},"Dark/Orange/70":{"value":"rgba(248, 170, 135, 1)"},"Dark/Orange/80":{"value":"rgba(245, 188, 163, 1)"},"Dark/Orange/90":{"value":"rgba(252, 221, 207, 1)"},"Dark/Yellow/-10":{"value":"rgba(6, 6, 6, 1)"},"Dark/Yellow/-5":{"value":"rgba(21, 21, 21, 1)"},"Dark/Yellow/0":{"value":"rgba(31, 31, 31, 1)"},"Dark/Yellow/5":{"value":"rgba(44, 40, 35, 1)"},"Dark/Yellow/10":{"value":"rgba(66, 51, 30, 1)"},"Dark/Yellow/20":{"value":"rgba(109, 75, 31, 1)"},"Dark/Yellow/30":{"value":"rgba(153, 99, 8, 1)"},"Dark/Yellow/40":{"value":"rgba(174, 121, 14, 1)"},"Dark/Yellow/50":{"value":"rgba(199, 140, 10, 1)"},"Dark/Yellow/60":{"value":"rgba(222, 167, 29, 1)"},"Dark/Yellow/70":{"value":"rgba(222, 185, 7, 1)"},"Dark/Yellow/80":{"value":"rgba(231, 199, 80, 1)"},"Dark/Yellow/90":{"value":"rgba(252, 227, 145, 1)"},"Dark/Green/-10":{"value":"rgba(6, 6, 6, 1)"},"Dark/Green/-5":{"value":"rgba(21, 21, 21, 1)"},"Dark/Green/0":{"value":"rgba(31, 31, 31, 1)"},"Dark/Green/5":{"value":"rgba(37, 43, 37, 1)"},"Dark/Green/10":{"value":"rgba(41, 59, 40, 1)"},"Dark/Green/20":{"value":"rgba(39, 92, 35, 1)"},"Dark/Green/30":{"value":"rgba(13, 129, 5, 1)"},"Dark/Green/40":{"value":"rgba(58, 150, 52, 1)"},"Dark/Green/50":{"value":"rgba(86, 169, 79, 1)"},"Dark/Green/60":{"value":"rgba(120, 194, 113, 1)"},"Dark/Green/70":{"value":"rgba(141, 204, 135, 1)"},"Dark/Green/80":{"value":"rgba(161, 215, 155, 1)"},"Dark/Green/90":{"value":"rgba(191, 241, 186, 1)"},"Dark/Turquoise/-10":{"value":"rgba(6, 6, 6, 1)"},"Dark/Turquoise/-5":{"value":"rgba(21, 21, 21, 1)"},"Dark/Turquoise/0":{"value":"rgba(31, 31, 31, 1)"},"Dark/Turquoise/5":{"value":"rgba(35, 42, 41, 1)"},"Dark/Turquoise/10":{"value":"rgba(26, 60, 58, 1)"},"Dark/Turquoise/20":{"value":"rgba(0, 91, 88, 1)"},"Dark/Turquoise/30":{"value":"rgba(0, 123, 118, 1)"},"Dark/Turquoise/40":{"value":"rgba(0, 147, 142, 1)"},"Dark/Turquoise/50":{"value":"rgba(32, 170, 164, 1)"},"Dark/Turquoise/60":{"value":"rgba(84, 193, 186, 1)"},"Dark/Turquoise/70":{"value":"rgba(118, 205, 199, 1)"},"Dark/Turquoise/80":{"value":"rgba(144, 213, 207, 1)"},"Dark/Turquoise/90":{"value":"rgba(180, 239, 234, 1)"},"Dark/Blue/-10":{"value":"rgba(6, 6, 6, 1)"},"Dark/Blue/-5":{"value":"rgba(21, 21, 21, 1)"},"Dark/Blue/0":{"value":"rgba(31, 31, 31, 1)"},"Dark/Blue/5":{"value":"rgba(33, 41, 50, 1)"},"Dark/Blue/10":{"value":"rgba(36, 55, 73, 1)"},"Dark/Blue/20":{"value":"rgba(39, 84, 126, 1)"},"Dark/Blue/30":{"value":"rgba(8, 114, 190, 1)"},"Dark/Blue/40":{"value":"rgba(55, 136, 208, 1)"},"Dark/Blue/50":{"value":"rgba(83, 156, 224, 1)"},"Dark/Blue/60":{"value":"rgba(114, 181, 245, 1)"},"Dark/Blue/70":{"value":"rgba(139, 193, 248, 1)"},"Dark/Blue/80":{"value":"rgba(166, 205, 245, 1)"},"Dark/Blue/90":{"value":"rgba(207, 230, 253, 1)"},"Dark/Indigo/-10":{"value":"rgba(6, 6, 6, 1)"},"Dark/Indigo/-5":{"value":"rgba(21, 21, 21, 1)"},"Dark/Indigo/0":{"value":"rgba(31, 31, 31, 1)"},"Dark/Indigo/5":{"value":"rgba(39, 40, 46, 1)"},"Dark/Indigo/10":{"value":"rgba(48, 51, 74, 1)"},"Dark/Indigo/20":{"value":"rgba(72, 76, 134, 1)"},"Dark/Indigo/30":{"value":"rgba(96, 100, 199, 1)"},"Dark/Indigo/40":{"value":"rgba(115, 123, 219, 1)"},"Dark/Indigo/50":{"value":"rgba(135, 143, 231, 1)"},"Dark/Indigo/60":{"value":"rgba(160, 170, 249, 1)"},"Dark/Indigo/70":{"value":"rgba(175, 184, 254, 1)"},"Dark/Indigo/80":{"value":"rgba(192, 199, 248, 1)"},"Dark/Indigo/90":{"value":"rgba(222, 227, 255, 1)"},"Dark/Purple/-10":{"value":"rgba(6, 6, 6, 1)"},"Dark/Purple/-5":{"value":"rgba(21, 21, 21, 1)"},"Dark/Purple/0":{"value":"rgba(31, 31, 31, 1)"},"Dark/Purple/5":{"value":"rgba(42, 38, 49, 1)"},"Dark/Purple/10":{"value":"rgba(56, 48, 71, 1)"},"Dark/Purple/20":{"value":"rgba(93, 68, 132, 1)"},"Dark/Purple/30":{"value":"rgba(131, 88, 194, 1)"},"Dark/Purple/40":{"value":"rgba(149, 110, 210, 1)"},"Dark/Purple/50":{"value":"rgba(169, 133, 229, 1)"},"Dark/Purple/60":{"value":"rgba(191, 160, 246, 1)"},"Dark/Purple/70":{"value":"rgba(201, 176, 249, 1)"},"Dark/Purple/80":{"value":"rgba(210, 192, 245, 1)"},"Dark/Purple/90":{"value":"rgba(233, 223, 255, 1)"},"Dark/Magenta/-10":{"value":"rgba(6, 6, 6, 1)"},"Dark/Magenta/-5":{"value":"rgba(21, 21, 21, 1)"},"Dark/Magenta/0":{"value":"rgba(31, 31, 31, 1)"},"Dark/Magenta/5":{"value":"rgba(48, 36, 42, 1)"},"Dark/Magenta/10":{"value":"rgba(69, 44, 56, 1)"},"Dark/Magenta/20":{"value":"rgba(124, 58, 91, 1)"},"Dark/Magenta/30":{"value":"rgba(185, 64, 130, 1)"},"Dark/Magenta/40":{"value":"rgba(202, 91, 149, 1)"},"Dark/Magenta/50":{"value":"rgba(220, 114, 168, 1)"},"Dark/Magenta/60":{"value":"rgba(240, 146, 191, 1)"},"Dark/Magenta/70":{"value":"rgba(243, 163, 200, 1)"},"Dark/Magenta/80":{"value":"rgba(247, 184, 213, 1)"},"Dark/Magenta/90":{"value":"rgba(253, 217, 233, 1)"}},"Spacings":{"space/0":{"value":"0"},"space/1":{"value":"2"},"space/10":{"value":"4"},"space/15":{"value":"6"},"space/20":{"value":"8"},"space/25":{"value":"12"},"space/30":{"value":"16"},"space/35":{"value":"20"},"space/40":{"value":"24"},"space/43":{"value":"28"},"space/46":{"value":"32"},"space/50":{"value":"40"},"space/55":{"value":"48"},"space/60":{"value":"64"},"space/63":{"value":"80"},"space/66":{"value":"96"},"space/70":{"value":"104"},"space/80":{"value":"168"},"space/90":{"value":"272"},"space/100":{"value":"440"},"space/999":{"value":"999999"}},"Text":{"font-size/0":{"value":"11"},"font-size/1":{"value":"12"},"font-size/5":{"value":"14"},"font-size/10":{"value":"16"},"font-size/20":{"value":"18"},"font-size/30":{"value":"20"},"font-size/40":{"value":"22"},"font-size/50":{"value":"25"},"font-size/60":{"value":"28"},"font-size/70":{"value":"32"},"font-size/80":{"value":"36"},"font-size/90":{"value":"40"},"font-size/100":{"value":"45"},"font-size/110":{"value":"50"},"font-size/120":{"value":"60"},"line-height/0":{"value":"16"},"font-weight/40":{"value":"400"},"font-weight/70":{"value":"700"},"line-height/1":{"value":"18"},"line-height/5":{"value":"20"},"line-height/10":{"value":"24"},"line-height/20":{"value":"28"},"line-height/30":{"value":"32"},"line-height/40":{"value":"36"},"line-height/50":{"value":"40"},"line-height/60":{"value":"44"},"line-height/70":{"value":"52"},"line-height/80":{"value":"56"},"line-height/90":{"value":"64"},"line-height/100":{"value":"72"},"font-family/sans":{"value":"Sarasa UI J"}}} \ No newline at end of file +{ + "Brand color": { + "pixiv": { "value": "rgba(0, 150, 250, 1)" }, + "premium": { "value": "rgba(253, 158, 22, 1)" }, + "comic": { "value": "rgba(255, 196, 0, 1)" }, + "BOOTH": { "value": "rgba(252, 77, 80, 1)" }, + "FACTORY": { "value": "rgba(0, 184, 205, 1)" } + }, + "Colors": { + "Light/Neutral/0": { "value": "rgba(255, 255, 255, 1)" }, + "Light/NeutralA/0": { "value": "rgba(31, 31, 31, 0)" }, + "Light/NeutralA/5": { "value": "rgba(31, 31, 31, 0.055)" }, + "Light/NeutralA/10": { "value": "rgba(31, 31, 31, 0.102)" }, + "Light/NeutralA/20": { "value": "rgba(31, 31, 31, 0.17)" }, + "Light/NeutralA/30": { "value": "rgba(31, 31, 31, 0.27)" }, + "Light/NeutralA/40": { "value": "rgba(31, 31, 31, 0.37)" }, + "Light/NeutralA/50": { "value": "rgba(31, 31, 31, 0.475)" }, + "Light/NeutralA/60": { "value": "rgba(31, 31, 31, 0.635)" }, + "Light/NeutralA/70": { "value": "rgba(31, 31, 31, 0.775)" }, + "Light/NeutralA/80": { "value": "rgba(31, 31, 31, 0.885)" }, + "Light/NeutralA/90": { "value": "{Colors.Light/Neutral/90}" }, + "Light/Neutral/5": { "value": "rgba(243, 243, 243, 1)" }, + "Light/Neutral/10": { "value": "rgba(232, 232, 232, 1)" }, + "Light/Neutral/20": { "value": "rgba(217, 217, 217, 1)" }, + "Light/Neutral/30": { "value": "rgba(194, 194, 194, 1)" }, + "Light/Neutral/40": { "value": "rgba(172, 172, 172, 1)" }, + "Light/Neutral/50": { "value": "rgba(148, 148, 148, 1)" }, + "Light/Neutral/60": { "value": "rgba(113, 113, 113, 1)" }, + "Light/Neutral/70": { "value": "rgba(81, 81, 81, 1)" }, + "Light/Neutral/80": { "value": "rgba(56, 56, 56, 1)" }, + "Light/Neutral/90": { "value": "rgba(31, 31, 31, 1)" }, + "Light/Red/0": { "value": "rgba(255, 255, 255, 1)" }, + "Light/Red/5": { "value": "rgba(253, 240, 237, 1)" }, + "Light/Red/10": { "value": "rgba(250, 228, 225, 1)" }, + "Light/Red/20": { "value": "rgba(253, 206, 199, 1)" }, + "Light/Red/30": { "value": "rgba(253, 174, 163, 1)" }, + "Light/Red/40": { "value": "rgba(252, 138, 124, 1)" }, + "Light/Red/50": { "value": "rgba(253, 91, 78, 1)" }, + "Light/Red/60": { "value": "rgba(206, 54, 46, 1)" }, + "Light/Red/70": { "value": "rgba(147, 33, 28, 1)" }, + "Light/Red/80": { "value": "rgba(103, 22, 17, 1)" }, + "Light/Red/90": { "value": "rgba(66, 0, 1, 1)" }, + "Light/Orange/5": { "value": "rgba(253, 241, 229, 1)" }, + "Light/Orange/10": { "value": "rgba(252, 229, 211, 1)" }, + "Light/Orange/20": { "value": "rgba(253, 209, 177, 1)" }, + "Light/Orange/30": { "value": "rgba(254, 176, 121, 1)" }, + "Light/Orange/40": { "value": "rgba(253, 143, 53, 1)" }, + "Light/Orange/50": { "value": "rgba(242, 105, 21, 1)" }, + "Light/Orange/60": { "value": "rgba(190, 79, 4, 1)" }, + "Light/Orange/70": { "value": "rgba(132, 54, 7, 1)" }, + "Light/Orange/80": { "value": "rgba(91, 38, 13, 1)" }, + "Light/Orange/90": { "value": "rgba(55, 18, 2, 1)" }, + "Light/Yellow/0": { "value": "rgba(255, 255, 255, 1)" }, + "Light/Yellow/5": { "value": "rgba(250, 243, 221, 1)" }, + "Light/Yellow/10": { "value": "rgba(246, 232, 176, 1)" }, + "Light/Yellow/20": { "value": "rgba(254, 214, 61, 1)" }, + "Light/Yellow/30": { "value": "rgba(245, 183, 17, 1)" }, + "Light/Yellow/40": { "value": "rgba(231, 157, 20, 1)" }, + "Light/Yellow/50": { "value": "rgba(205, 131, 2, 1)" }, + "Light/Yellow/60": { "value": "rgba(161, 99, 9, 1)" }, + "Light/Yellow/70": { "value": "rgba(110, 72, 5, 1)" }, + "Light/Yellow/80": { "value": "rgba(74, 51, 7, 1)" }, + "Light/Yellow/90": { "value": "rgba(44, 28, 0, 1)" }, + "Light/Green/0": { "value": "rgba(255, 255, 255, 1)" }, + "Light/Green/5": { "value": "rgba(234, 248, 232, 1)" }, + "Light/Green/10": { "value": "rgba(204, 243, 200, 1)" }, + "Light/Green/20": { "value": "rgba(164, 234, 157, 1)" }, + "Light/Green/30": { "value": "rgba(121, 214, 112, 1)" }, + "Light/Green/40": { "value": "rgba(80, 192, 72, 1)" }, + "Light/Green/50": { "value": "rgba(37, 170, 28, 1)" }, + "Light/Green/60": { "value": "rgba(17, 131, 8, 1)" }, + "Light/Green/70": { "value": "rgba(4, 93, 0, 1)" }, + "Light/Green/80": { "value": "rgba(7, 64, 4, 1)" }, + "Light/Green/90": { "value": "rgba(1, 40, 0, 1)" }, + "Light/Turquoise/0": { "value": "rgba(255, 255, 255, 1)" }, + "Light/Turquoise/5": { "value": "rgba(225, 249, 249, 1)" }, + "Light/Turquoise/10": { "value": "rgba(196, 240, 241, 1)" }, + "Light/Turquoise/20": { "value": "rgba(152, 228, 229, 1)" }, + "Light/Turquoise/30": { "value": "rgba(109, 204, 205, 1)" }, + "Light/Turquoise/40": { "value": "rgba(63, 184, 186, 1)" }, + "Light/Turquoise/50": { "value": "rgba(27, 161, 163, 1)" }, + "Light/Turquoise/60": { "value": "rgba(11, 126, 128, 1)" }, + "Light/Turquoise/70": { "value": "rgba(3, 87, 89, 1)" }, + "Light/Turquoise/80": { "value": "rgba(1, 61, 62, 1)" }, + "Light/Turquoise/90": { "value": "rgba(1, 37, 37, 1)" }, + "Light/Blue/0": { "value": "rgba(255, 255, 255, 1)" }, + "Light/Blue/5": { "value": "rgba(236, 244, 253, 1)" }, + "Light/Blue/10": { "value": "rgba(216, 235, 251, 1)" }, + "Light/Blue/20": { "value": "rgba(188, 222, 252, 1)" }, + "Light/Blue/30": { "value": "rgba(137, 200, 253, 1)" }, + "Light/Blue/40": { "value": "rgba(85, 178, 253, 1)" }, + "Light/Blue/50": { "value": "rgba(0, 150, 250, 1)" }, + "Light/Blue/60": { "value": "rgba(31, 117, 188, 1)" }, + "Light/Blue/70": { "value": "rgba(24, 81, 130, 1)" }, + "Light/Blue/80": { "value": "rgba(19, 58, 93, 1)" }, + "Light/Blue/90": { "value": "rgba(3, 35, 63, 1)" }, + "Light/Indigo/5": { "value": "rgba(241, 242, 253, 1)" }, + "Light/Indigo/10": { "value": "rgba(226, 231, 253, 1)" }, + "Light/Indigo/20": { "value": "rgba(210, 216, 252, 1)" }, + "Light/Indigo/30": { "value": "rgba(181, 189, 253, 1)" }, + "Light/Indigo/40": { "value": "rgba(156, 165, 252, 1)" }, + "Light/Indigo/50": { "value": "rgba(129, 136, 253, 1)" }, + "Light/Indigo/60": { "value": "rgba(95, 97, 222, 1)" }, + "Light/Indigo/70": { "value": "rgba(68, 70, 155, 1)" }, + "Light/Indigo/80": { "value": "rgba(45, 47, 109, 1)" }, + "Light/Indigo/90": { "value": "rgba(24, 24, 70, 1)" }, + "Light/Purple/5": { "value": "rgba(244, 241, 252, 1)" }, + "Light/Purple/10": { "value": "rgba(236, 229, 251, 1)" }, + "Light/Purple/20": { "value": "rgba(224, 210, 253, 1)" }, + "Light/Purple/30": { "value": "rgba(207, 183, 253, 1)" }, + "Light/Purple/40": { "value": "rgba(190, 153, 253, 1)" }, + "Light/Purple/50": { "value": "rgba(173, 120, 252, 1)" }, + "Light/Purple/60": { "value": "rgba(143, 77, 225, 1)" }, + "Light/Purple/70": { "value": "rgba(103, 39, 171, 1)" }, + "Light/Purple/80": { "value": "rgba(70, 32, 115, 1)" }, + "Light/Purple/90": { "value": "rgba(40, 16, 70, 1)" }, + "Light/Magenta/5": { "value": "rgba(252, 239, 244, 1)" }, + "Light/Magenta/10": { "value": "rgba(251, 226, 237, 1)" }, + "Light/Magenta/20": { "value": "rgba(255, 204, 226, 1)" }, + "Light/Magenta/30": { "value": "rgba(245, 173, 206, 1)" }, + "Light/Magenta/40": { "value": "rgba(250, 131, 192, 1)" }, + "Light/Magenta/50": { "value": "rgba(235, 95, 170, 1)" }, + "Light/Magenta/60": { "value": "rgba(196, 53, 135, 1)" }, + "Light/Magenta/70": { "value": "rgba(141, 33, 96, 1)" }, + "Light/Magenta/80": { "value": "rgba(98, 27, 67, 1)" }, + "Light/Magenta/90": { "value": "rgba(59, 5, 37, 1)" }, + "Dark/Neutral/-10": { "value": "rgba(6, 6, 6, 1)" }, + "Dark/NeutralA/-10": { "value": "rgba(6, 6, 6, 1)" }, + "Dark/NeutralA/-5": { "value": "rgba(6, 6, 6, 0.41)" }, + "Dark/NeutralA/0": { "value": "rgba(228, 228, 228, 0)" }, + "Dark/NeutralA/5": { "value": "rgba(228, 228, 228, 0.05)" }, + "Dark/NeutralA/10": { "value": "rgba(228, 228, 228, 0.1)" }, + "Dark/NeutralA/20": { "value": "rgba(228, 228, 228, 0.255)" }, + "Dark/NeutralA/30": { "value": "rgba(228, 228, 228, 0.41)" }, + "Dark/NeutralA/40": { "value": "rgba(228, 228, 228, 0.505)" }, + "Dark/NeutralA/50": { "value": "rgba(228, 228, 228, 0.61)" }, + "Dark/NeutralA/60": { "value": "rgba(228, 228, 228, 0.73)" }, + "Dark/NeutralA/70": { "value": "rgba(228, 228, 228, 0.795)" }, + "Dark/NeutralA/80": { "value": "rgba(228, 228, 228, 0.87)" }, + "Dark/NeutralA/90": { "value": "{Colors.Dark/Neutral/90}" }, + "Dark/Neutral/-5": { "value": "rgba(21, 21, 21, 1)" }, + "Dark/Neutral/0": { "value": "rgba(31, 31, 31, 1)" }, + "Dark/Neutral/5": { "value": "rgba(41, 41, 41, 1)" }, + "Dark/Neutral/10": { "value": "rgba(51, 51, 51, 1)" }, + "Dark/Neutral/20": { "value": "rgba(81, 81, 81, 1)" }, + "Dark/Neutral/30": { "value": "rgba(112, 112, 112, 1)" }, + "Dark/Neutral/40": { "value": "rgba(130, 130, 130, 1)" }, + "Dark/Neutral/50": { "value": "rgba(151, 151, 151, 1)" }, + "Dark/Neutral/60": { "value": "rgba(175, 175, 175, 1)" }, + "Dark/Neutral/70": { "value": "rgba(188, 188, 188, 1)" }, + "Dark/Neutral/80": { "value": "rgba(202, 202, 202, 1)" }, + "Dark/Neutral/90": { "value": "rgba(228, 228, 228, 1)" }, + "Dark/Red/-10": { "value": "rgba(6, 6, 6, 1)" }, + "Dark/Red/-5": { "value": "rgba(21, 21, 21, 1)" }, + "Dark/Red/0": { "value": "rgba(31, 31, 31, 1)" }, + "Dark/Red/5": { "value": "rgba(47, 39, 38, 1)" }, + "Dark/Red/10": { "value": "rgba(73, 47, 43, 1)" }, + "Dark/Red/20": { "value": "rgba(136, 54, 46, 1)" }, + "Dark/Red/30": { "value": "rgba(197, 60, 51, 1)" }, + "Dark/Red/40": { "value": "rgba(217, 88, 76, 1)" }, + "Dark/Red/50": { "value": "rgba(233, 114, 102, 1)" }, + "Dark/Red/60": { "value": "rgba(252, 147, 134, 1)" }, + "Dark/Red/70": { "value": "rgba(254, 167, 155, 1)" }, + "Dark/Red/80": { "value": "rgba(249, 186, 177, 1)" }, + "Dark/Red/90": { "value": "rgba(254, 219, 214, 1)" }, + "Dark/Orange/-10": { "value": "rgba(6, 6, 6, 1)" }, + "Dark/Orange/-5": { "value": "rgba(21, 21, 21, 1)" }, + "Dark/Orange/0": { "value": "rgba(31, 31, 31, 1)" }, + "Dark/Orange/5": { "value": "rgba(48, 39, 34, 1)" }, + "Dark/Orange/10": { "value": "rgba(72, 48, 38, 1)" }, + "Dark/Orange/20": { "value": "rgba(134, 58, 22, 1)" }, + "Dark/Orange/30": { "value": "rgba(188, 74, 14, 1)" }, + "Dark/Orange/40": { "value": "rgba(212, 97, 41, 1)" }, + "Dark/Orange/50": { "value": "rgba(229, 121, 68, 1)" }, + "Dark/Orange/60": { "value": "rgba(246, 151, 107, 1)" }, + "Dark/Orange/70": { "value": "rgba(248, 170, 135, 1)" }, + "Dark/Orange/80": { "value": "rgba(245, 188, 163, 1)" }, + "Dark/Orange/90": { "value": "rgba(252, 221, 207, 1)" }, + "Dark/Yellow/-10": { "value": "rgba(6, 6, 6, 1)" }, + "Dark/Yellow/-5": { "value": "rgba(21, 21, 21, 1)" }, + "Dark/Yellow/0": { "value": "rgba(31, 31, 31, 1)" }, + "Dark/Yellow/5": { "value": "rgba(44, 40, 35, 1)" }, + "Dark/Yellow/10": { "value": "rgba(66, 51, 30, 1)" }, + "Dark/Yellow/20": { "value": "rgba(109, 75, 31, 1)" }, + "Dark/Yellow/30": { "value": "rgba(153, 99, 8, 1)" }, + "Dark/Yellow/40": { "value": "rgba(174, 121, 14, 1)" }, + "Dark/Yellow/50": { "value": "rgba(199, 140, 10, 1)" }, + "Dark/Yellow/60": { "value": "rgba(222, 167, 29, 1)" }, + "Dark/Yellow/70": { "value": "rgba(222, 185, 7, 1)" }, + "Dark/Yellow/80": { "value": "rgba(231, 199, 80, 1)" }, + "Dark/Yellow/90": { "value": "rgba(252, 227, 145, 1)" }, + "Dark/Green/-10": { "value": "rgba(6, 6, 6, 1)" }, + "Dark/Green/-5": { "value": "rgba(21, 21, 21, 1)" }, + "Dark/Green/0": { "value": "rgba(31, 31, 31, 1)" }, + "Dark/Green/5": { "value": "rgba(37, 43, 37, 1)" }, + "Dark/Green/10": { "value": "rgba(41, 59, 40, 1)" }, + "Dark/Green/20": { "value": "rgba(39, 92, 35, 1)" }, + "Dark/Green/30": { "value": "rgba(13, 129, 5, 1)" }, + "Dark/Green/40": { "value": "rgba(58, 150, 52, 1)" }, + "Dark/Green/50": { "value": "rgba(86, 169, 79, 1)" }, + "Dark/Green/60": { "value": "rgba(120, 194, 113, 1)" }, + "Dark/Green/70": { "value": "rgba(141, 204, 135, 1)" }, + "Dark/Green/80": { "value": "rgba(161, 215, 155, 1)" }, + "Dark/Green/90": { "value": "rgba(191, 241, 186, 1)" }, + "Dark/Turquoise/-10": { "value": "rgba(6, 6, 6, 1)" }, + "Dark/Turquoise/-5": { "value": "rgba(21, 21, 21, 1)" }, + "Dark/Turquoise/0": { "value": "rgba(31, 31, 31, 1)" }, + "Dark/Turquoise/5": { "value": "rgba(35, 42, 41, 1)" }, + "Dark/Turquoise/10": { "value": "rgba(26, 60, 58, 1)" }, + "Dark/Turquoise/20": { "value": "rgba(0, 91, 88, 1)" }, + "Dark/Turquoise/30": { "value": "rgba(0, 123, 118, 1)" }, + "Dark/Turquoise/40": { "value": "rgba(0, 147, 142, 1)" }, + "Dark/Turquoise/50": { "value": "rgba(32, 170, 164, 1)" }, + "Dark/Turquoise/60": { "value": "rgba(84, 193, 186, 1)" }, + "Dark/Turquoise/70": { "value": "rgba(118, 205, 199, 1)" }, + "Dark/Turquoise/80": { "value": "rgba(144, 213, 207, 1)" }, + "Dark/Turquoise/90": { "value": "rgba(180, 239, 234, 1)" }, + "Dark/Blue/-10": { "value": "rgba(6, 6, 6, 1)" }, + "Dark/Blue/-5": { "value": "rgba(21, 21, 21, 1)" }, + "Dark/Blue/0": { "value": "rgba(31, 31, 31, 1)" }, + "Dark/Blue/5": { "value": "rgba(33, 41, 50, 1)" }, + "Dark/Blue/10": { "value": "rgba(36, 55, 73, 1)" }, + "Dark/Blue/20": { "value": "rgba(39, 84, 126, 1)" }, + "Dark/Blue/30": { "value": "rgba(8, 114, 190, 1)" }, + "Dark/Blue/40": { "value": "rgba(55, 136, 208, 1)" }, + "Dark/Blue/50": { "value": "rgba(83, 156, 224, 1)" }, + "Dark/Blue/60": { "value": "rgba(114, 181, 245, 1)" }, + "Dark/Blue/70": { "value": "rgba(139, 193, 248, 1)" }, + "Dark/Blue/80": { "value": "rgba(166, 205, 245, 1)" }, + "Dark/Blue/90": { "value": "rgba(207, 230, 253, 1)" }, + "Dark/Indigo/-10": { "value": "rgba(6, 6, 6, 1)" }, + "Dark/Indigo/-5": { "value": "rgba(21, 21, 21, 1)" }, + "Dark/Indigo/0": { "value": "rgba(31, 31, 31, 1)" }, + "Dark/Indigo/5": { "value": "rgba(39, 40, 46, 1)" }, + "Dark/Indigo/10": { "value": "rgba(48, 51, 74, 1)" }, + "Dark/Indigo/20": { "value": "rgba(72, 76, 134, 1)" }, + "Dark/Indigo/30": { "value": "rgba(96, 100, 199, 1)" }, + "Dark/Indigo/40": { "value": "rgba(115, 123, 219, 1)" }, + "Dark/Indigo/50": { "value": "rgba(135, 143, 231, 1)" }, + "Dark/Indigo/60": { "value": "rgba(160, 170, 249, 1)" }, + "Dark/Indigo/70": { "value": "rgba(175, 184, 254, 1)" }, + "Dark/Indigo/80": { "value": "rgba(192, 199, 248, 1)" }, + "Dark/Indigo/90": { "value": "rgba(222, 227, 255, 1)" }, + "Dark/Purple/-10": { "value": "rgba(6, 6, 6, 1)" }, + "Dark/Purple/-5": { "value": "rgba(21, 21, 21, 1)" }, + "Dark/Purple/0": { "value": "rgba(31, 31, 31, 1)" }, + "Dark/Purple/5": { "value": "rgba(42, 38, 49, 1)" }, + "Dark/Purple/10": { "value": "rgba(56, 48, 71, 1)" }, + "Dark/Purple/20": { "value": "rgba(93, 68, 132, 1)" }, + "Dark/Purple/30": { "value": "rgba(131, 88, 194, 1)" }, + "Dark/Purple/40": { "value": "rgba(149, 110, 210, 1)" }, + "Dark/Purple/50": { "value": "rgba(169, 133, 229, 1)" }, + "Dark/Purple/60": { "value": "rgba(191, 160, 246, 1)" }, + "Dark/Purple/70": { "value": "rgba(201, 176, 249, 1)" }, + "Dark/Purple/80": { "value": "rgba(210, 192, 245, 1)" }, + "Dark/Purple/90": { "value": "rgba(233, 223, 255, 1)" }, + "Dark/Magenta/-10": { "value": "rgba(6, 6, 6, 1)" }, + "Dark/Magenta/-5": { "value": "rgba(21, 21, 21, 1)" }, + "Dark/Magenta/0": { "value": "rgba(31, 31, 31, 1)" }, + "Dark/Magenta/5": { "value": "rgba(48, 36, 42, 1)" }, + "Dark/Magenta/10": { "value": "rgba(69, 44, 56, 1)" }, + "Dark/Magenta/20": { "value": "rgba(124, 58, 91, 1)" }, + "Dark/Magenta/30": { "value": "rgba(185, 64, 130, 1)" }, + "Dark/Magenta/40": { "value": "rgba(202, 91, 149, 1)" }, + "Dark/Magenta/50": { "value": "rgba(220, 114, 168, 1)" }, + "Dark/Magenta/60": { "value": "rgba(240, 146, 191, 1)" }, + "Dark/Magenta/70": { "value": "rgba(243, 163, 200, 1)" }, + "Dark/Magenta/80": { "value": "rgba(247, 184, 213, 1)" }, + "Dark/Magenta/90": { "value": "rgba(253, 217, 233, 1)" } + }, + "Spacings": { + "space/0": { "value": "0" }, + "space/1": { "value": "2" }, + "space/10": { "value": "4" }, + "space/15": { "value": "6" }, + "space/20": { "value": "8" }, + "space/25": { "value": "12" }, + "space/30": { "value": "16" }, + "space/35": { "value": "20" }, + "space/40": { "value": "24" }, + "space/43": { "value": "28" }, + "space/46": { "value": "32" }, + "space/50": { "value": "40" }, + "space/55": { "value": "48" }, + "space/60": { "value": "64" }, + "space/63": { "value": "80" }, + "space/66": { "value": "96" }, + "space/70": { "value": "104" }, + "space/80": { "value": "168" }, + "space/90": { "value": "272" }, + "space/100": { "value": "440" }, + "space/999": { "value": "999999" } + }, + "Text": { + "font-size/0": { "value": "11" }, + "font-size/1": { "value": "12" }, + "font-size/5": { "value": "14" }, + "font-size/10": { "value": "16" }, + "font-size/20": { "value": "18" }, + "font-size/30": { "value": "20" }, + "font-size/40": { "value": "22" }, + "font-size/50": { "value": "25" }, + "font-size/60": { "value": "28" }, + "font-size/70": { "value": "32" }, + "font-size/80": { "value": "36" }, + "font-size/90": { "value": "40" }, + "font-size/100": { "value": "45" }, + "font-size/110": { "value": "50" }, + "font-size/120": { "value": "60" }, + "line-height/0": { "value": "16" }, + "font-weight/40": { "value": "400" }, + "font-weight/70": { "value": "700" }, + "line-height/1": { "value": "18" }, + "line-height/5": { "value": "20" }, + "line-height/10": { "value": "24" }, + "line-height/20": { "value": "28" }, + "line-height/30": { "value": "32" }, + "line-height/40": { "value": "36" }, + "line-height/50": { "value": "40" }, + "line-height/60": { "value": "44" }, + "line-height/70": { "value": "52" }, + "line-height/80": { "value": "56" }, + "line-height/90": { "value": "64" }, + "line-height/100": { "value": "72" }, + "font-family/sans": { "value": "Sarasa UI J" } + } +} diff --git a/packages/theme/src/json/pixiv-dark.json b/packages/theme/src/json/pixiv-dark.json index 92ca5d5ab..022ab875b 100644 --- a/packages/theme/src/json/pixiv-dark.json +++ b/packages/theme/src/json/pixiv-dark.json @@ -1 +1,181 @@ -{"Color":{"pixiv/dark":{"background/default":{"value":"{Colors.Dark/Neutral/0}"},"background/secondary":{"value":"{Colors.Dark/Neutral/-5}"},"background/tertiary":{"value":"{Colors.Dark/Neutral/-10}"},"container/default":{"value":"{Colors.Dark/Neutral/0}"},"container/hover":{"value":"{Colors.Dark/Neutral/5}"},"container/press":{"value":"{Colors.Dark/Neutral/10}"},"container/disable":{"value":"{Colors.Dark/Neutral/10}"},"container/secondary/default":{"value":"{Colors.Dark/Neutral/5}"},"container/tertiary/default":{"value":"{Colors.Dark/Neutral/10}"},"container/tertiary/hover":{"value":"{Colors.Dark/Neutral/20}"},"container/tertiary/press":{"value":"{Colors.Dark/Neutral/30}"},"container/tertiary/defaultA":{"value":"{Colors.Dark/NeutralA/10}"},"container/tertiary/hoverA":{"value":"{Colors.Dark/NeutralA/20}"},"container/tertiary/pressA":{"value":"{Colors.Dark/NeutralA/30}"},"container/primary/default":{"value":"{Colors.Dark/Blue/30}"},"container/primary/hover":{"value":"{Colors.Dark/Blue/40}"},"container/primary/press":{"value":"{Colors.Dark/Blue/50}"},"container/secondary/hover":{"value":"{Colors.Dark/Neutral/10}"},"container/secondary/press":{"value":"{Colors.Dark/Neutral/20}"},"container/secondary/defaultA":{"value":"{Colors.Dark/NeutralA/5}"},"container/secondary/hoverA":{"value":"{Colors.Dark/NeutralA/10}"},"container/secondary/pressA":{"value":"{Colors.Dark/NeutralA/20}"},"container/on-img/default":{"value":"{Colors.Light/NeutralA/40}"},"container/on-img/hover":{"value":"{Colors.Light/NeutralA/50}"},"container/on-img/press":{"value":"{Colors.Light/NeutralA/60}"},"container/negative/default":{"value":"{Colors.Dark/Red/30}"},"container/negative/hover":{"value":"{Colors.Dark/Red/40}"},"container/negative/press":{"value":"{Colors.Dark/Red/50}"},"container/positive/default":{"value":"{Colors.Dark/Green/30}"},"container/positive/hover":{"value":"{Colors.Dark/Green/40}"},"container/positive/press":{"value":"{Colors.Dark/Green/50}"},"container/notice/default":{"value":"{Colors.Dark/Yellow/70}"},"container/notice/hover":{"value":"{Colors.Dark/Yellow/80}"},"container/notice/press":{"value":"{Colors.Dark/Yellow/90}"},"container/neutral/default":{"value":"{Colors.Dark/Neutral/30}"},"container/discovery/default":{"value":"{Colors.Dark/Red/30}"},"container/discovery/hover":{"value":"{Colors.Dark/Red/40}"},"container/discovery/press":{"value":"{Colors.Dark/Red/50}"},"container/neutral/hover":{"value":"{Colors.Dark/Neutral/40}"},"container/neutral/press":{"value":"{Colors.Dark/Neutral/50}"},"container/HUD/default":{"value":"{Colors.Light/Neutral/10}"},"container/HUD/hover":{"value":"{Colors.Light/Neutral/20}"},"container/HUD/press":{"value":"{Colors.Light/Neutral/20}"},"container/skeleton":{"value":"{Colors.Dark/NeutralA/5}"},"container/subtle":{"value":"rgba(228, 228, 228, 0.02)"},"icon/secondary/default":{"value":"{Color.text/secondary/default}"},"icon/tertiary/default":{"value":"{Color.text/tertiary/default}"},"icon/negative/default":{"value":"{Color.text/negative/default}"},"icon/negative/hover":{"value":"{Color.text/negative/hover}"},"icon/negative/press":{"value":"{Color.text/negative/press}"},"icon/positive/default":{"value":"{Color.text/positive/default}"},"icon/positive/hover":{"value":"{Color.text/positive/hover}"},"icon/positive/press":{"value":"{Color.text/positive/press}"},"icon/notice/default":{"value":"{Color.text/notice/default}"},"icon/notice/hover":{"value":"{Color.text/notice/hover}"},"icon/notice/press":{"value":"{Color.text/notice/press}"},"icon/tertiary/hover":{"value":"{Color.text/tertiary/hover}"},"icon/tertiary/press":{"value":"{Color.text/tertiary/press}"},"icon/secondary/hover":{"value":"{Color.text/secondary/hover}"},"icon/secondary/press":{"value":"{Color.text/secondary/press}"},"text/default":{"value":"{Colors.Dark/Neutral/90}"},"text/hover":{"value":"{Colors.Dark/Neutral/80}"},"text/press":{"value":"{Colors.Dark/Neutral/70}"},"text/disable":{"value":"{Colors.Dark/Neutral/40}"},"text/secondary/default":{"value":"{Colors.Dark/Neutral/60}"},"text/secondary/hover":{"value":"{Colors.Dark/Neutral/70}"},"text/secondary/press":{"value":"{Colors.Dark/Neutral/80}"},"text/tertiary/default":{"value":"{Colors.Dark/Neutral/40}"},"text/tertiary/hover":{"value":"{Colors.Dark/Neutral/60}"},"text/tertiary/press":{"value":"{Colors.Dark/Neutral/70}"},"text/placeholder/default":{"value":"{Colors.Dark/Neutral/30}"},"text/placeholder/hover":{"value":"{Colors.Dark/Neutral/40}"},"text/placeholder/press":{"value":"{Colors.Dark/Neutral/50}"},"text/negative/default":{"value":"{Colors.Dark/Red/60}"},"text/negative/hover":{"value":"{Colors.Dark/Red/80}"},"text/negative/press":{"value":"{Colors.Dark/Red/90}"},"text/positive/default":{"value":"{Colors.Dark/Green/60}"},"text/positive/hover":{"value":"{Colors.Dark/Green/80}"},"text/positive/press":{"value":"{Colors.Dark/Green/90}"},"text/notice/default":{"value":"{Colors.Dark/Yellow/60}"},"text/notice/hover":{"value":"{Colors.Dark/Yellow/80}"},"text/notice/press":{"value":"{Colors.Dark/Yellow/90}"},"text/info/default":{"value":"{Colors.Dark/Blue/60}"},"text/info/hover":{"value":"{Colors.Dark/Blue/80}"},"text/info/press":{"value":"{Colors.Dark/Blue/90}"},"text/visited/default":{"value":"{Colors.Dark/Purple/60}"},"text/visited/hover":{"value":"{Colors.Dark/Purple/80}"},"text/visited/press":{"value":"{Colors.Dark/Purple/90}"},"text/on-primary/default":{"value":"{Colors.Dark/Neutral/90}"},"text/on-on-img/default":{"value":"{Colors.Dark/Neutral/90}"},"text/on-on-img/hover":{"value":"{Colors.Dark/Neutral/90}"},"text/on-on-img/press":{"value":"{Colors.Dark/Neutral/90}"},"text/on-primary/hover":{"value":"{Colors.Dark/Neutral/90}"},"text/on-primary/press":{"value":"{Colors.Dark/Neutral/90}"},"text/on-negative/default":{"value":"{Colors.Dark/Neutral/90}"},"text/on-negative/hover":{"value":"{Colors.Dark/Neutral/90}"},"text/on-negative/press":{"value":"{Colors.Dark/Neutral/90}"},"text/on-positive/default":{"value":"{Colors.Dark/Neutral/90}"},"text/on-positive/hover":{"value":"{Colors.Dark/Neutral/90}"},"text/on-positive/press":{"value":"{Colors.Dark/Neutral/90}"},"text/on-notice/default":{"value":"{Colors.Dark/Neutral/5}"},"text/on-notice/hover":{"value":"{Colors.Dark/Neutral/5}"},"text/on-notice/press":{"value":"{Colors.Dark/Neutral/5}"},"text/on-discovery/default":{"value":"{Colors.Dark/Neutral/90}"},"text/on-discovery/hover":{"value":"{Colors.Dark/Neutral/90}"},"text/on-discovery/press":{"value":"{Colors.Dark/Neutral/90}"},"text/on-HUD/default":{"value":"{Colors.Light/Neutral/90}"},"text/on-HUD/hover":{"value":"{Colors.Light/Neutral/90}"},"text/on-HUD/press":{"value":"{Colors.Light/Neutral/90}"},"text/brand-premium/default":{"value":"{Brand color.premium}"},"text/brand-premium/hover":{"value":"rgba(243, 152, 21, 1)"},"text/brand-premium/press":{"value":"rgba(213, 133, 18, 1)"},"icon/default":{"value":"{Color.text/default}"},"icon/hover":{"value":"{Color.text/hover}"},"icon/press":{"value":"{Color.text/press}"},"icon/disable":{"value":"{Color.text/disable}"},"icon/on-primary/default":{"value":"{Color.text/on-primary/default}"},"icon/on-primary/hover":{"value":"{Color.text/on-primary/hover}"},"icon/on-primary/press":{"value":"{Color.text/on-primary/press}"},"icon/on-on-img/default":{"value":"{Color.text/on-on-img/default}"},"icon/on-on-img/hover":{"value":"{Color.text/on-on-img/hover}"},"icon/on-on-img/press":{"value":"{Color.text/on-on-img/press}"},"icon/on-neutral/default":{"value":"{Colors.Dark/Neutral/90}"},"icon/on-neutral/hover":{"value":"{Colors.Dark/Neutral/90}"},"icon/on-neutral/press":{"value":"{Colors.Dark/Neutral/90}"},"border/default":{"value":"{Colors.Dark/Neutral/30}"},"border/secondary":{"value":"{Colors.Dark/NeutralA/10}"},"border/disable":{"value":"{Colors.Dark/NeutralA/5}"},"border/focus":{"value":"{Colors.Dark/Blue/20}"},"border/negative":{"value":"{Colors.Dark/Red/20}"},"icon/on-negative/default":{"value":"{Color.text/on-negative/default}"},"icon/on-negative/hover":{"value":"{Color.text/on-negative/hover}"},"icon/on-negative/press":{"value":"{Color.text/on-negative/press}"},"icon/on-positive/default":{"value":"{Color.text/on-positive/default}"},"icon/on-notice/default":{"value":"{Color.text/on-notice/default}"},"icon/on-notice/hover":{"value":"{Color.text/on-notice/hover}"},"icon/on-notice/press":{"value":"{Color.text/on-notice/press}"},"icon/on-positive/hover":{"value":"{Color.text/on-positive/hover}"},"icon/on-positive/press":{"value":"{Color.text/on-positive/press}"}}},"Space":{"target-size/compact":{"value":"24"},"target-size/default":{"value":"32"},"target-size/cozy":{"value":"48"},"component/0":{"value":"{Spacings.space/0}"},"component/1":{"value":"{Spacings.space/1}"},"component/10":{"value":"{Spacings.space/10}"},"component/15":{"value":"{Spacings.space/15}"},"component/20":{"value":"{Spacings.space/20}"},"component/25":{"value":"{Spacings.space/25}"},"component/30":{"value":"{Spacings.space/30}"},"component/35":{"value":"{Spacings.space/35}"},"component/40":{"value":"{Spacings.space/40}"},"component/43":{"value":"{Spacings.space/43}"},"component/46":{"value":"{Spacings.space/46}"},"component/50":{"value":"{Spacings.space/50}"},"component/55":{"value":"{Spacings.space/55}"},"component/60":{"value":"{Spacings.space/60}"},"component/63":{"value":"{Spacings.space/63}"},"component/66":{"value":"{Spacings.space/66}"},"layout/0":{"value":"{Spacings.space/0}"},"layout/10":{"value":"{Spacings.space/10}"},"layout/20":{"value":"{Spacings.space/20}"},"layout/30":{"value":"{Spacings.space/30}"},"layout/40":{"value":"{Spacings.space/40}"},"layout/50":{"value":"{Spacings.space/50}"},"layout/60":{"value":"{Spacings.space/60}"},"layout/70":{"value":"{Spacings.space/70}"},"layout/80":{"value":"{Spacings.space/80}"},"layout/90":{"value":"{Spacings.space/90}"},"layout/100":{"value":"{Spacings.space/100}"}}} \ No newline at end of file +{ + "Color": { + "pixiv/dark": { + "background/default": { "value": "{Colors.Dark/Neutral/0}" }, + "background/secondary": { "value": "{Colors.Dark/Neutral/-5}" }, + "background/tertiary": { "value": "{Colors.Dark/Neutral/-10}" }, + "container/default": { "value": "{Colors.Dark/Neutral/0}" }, + "container/hover": { "value": "{Colors.Dark/Neutral/5}" }, + "container/press": { "value": "{Colors.Dark/Neutral/10}" }, + "container/disable": { "value": "{Colors.Dark/Neutral/10}" }, + "container/secondary/default": { "value": "{Colors.Dark/Neutral/5}" }, + "container/tertiary/default": { "value": "{Colors.Dark/Neutral/10}" }, + "container/tertiary/hover": { "value": "{Colors.Dark/Neutral/20}" }, + "container/tertiary/press": { "value": "{Colors.Dark/Neutral/30}" }, + "container/tertiary/defaultA": { "value": "{Colors.Dark/NeutralA/10}" }, + "container/tertiary/hoverA": { "value": "{Colors.Dark/NeutralA/20}" }, + "container/tertiary/pressA": { "value": "{Colors.Dark/NeutralA/30}" }, + "container/primary/default": { "value": "{Colors.Dark/Blue/30}" }, + "container/primary/hover": { "value": "{Colors.Dark/Blue/40}" }, + "container/primary/press": { "value": "{Colors.Dark/Blue/50}" }, + "container/secondary/hover": { "value": "{Colors.Dark/Neutral/10}" }, + "container/secondary/press": { "value": "{Colors.Dark/Neutral/20}" }, + "container/secondary/defaultA": { "value": "{Colors.Dark/NeutralA/5}" }, + "container/secondary/hoverA": { "value": "{Colors.Dark/NeutralA/10}" }, + "container/secondary/pressA": { "value": "{Colors.Dark/NeutralA/20}" }, + "container/on-img/default": { "value": "{Colors.Light/NeutralA/40}" }, + "container/on-img/hover": { "value": "{Colors.Light/NeutralA/50}" }, + "container/on-img/press": { "value": "{Colors.Light/NeutralA/60}" }, + "container/negative/default": { "value": "{Colors.Dark/Red/30}" }, + "container/negative/hover": { "value": "{Colors.Dark/Red/40}" }, + "container/negative/press": { "value": "{Colors.Dark/Red/50}" }, + "container/positive/default": { "value": "{Colors.Dark/Green/30}" }, + "container/positive/hover": { "value": "{Colors.Dark/Green/40}" }, + "container/positive/press": { "value": "{Colors.Dark/Green/50}" }, + "container/notice/default": { "value": "{Colors.Dark/Yellow/70}" }, + "container/notice/hover": { "value": "{Colors.Dark/Yellow/80}" }, + "container/notice/press": { "value": "{Colors.Dark/Yellow/90}" }, + "container/neutral/default": { "value": "{Colors.Dark/Neutral/30}" }, + "container/discovery/default": { "value": "{Colors.Dark/Red/30}" }, + "container/discovery/hover": { "value": "{Colors.Dark/Red/40}" }, + "container/discovery/press": { "value": "{Colors.Dark/Red/50}" }, + "container/neutral/hover": { "value": "{Colors.Dark/Neutral/40}" }, + "container/neutral/press": { "value": "{Colors.Dark/Neutral/50}" }, + "container/HUD/default": { "value": "{Colors.Light/Neutral/10}" }, + "container/HUD/hover": { "value": "{Colors.Light/Neutral/20}" }, + "container/HUD/press": { "value": "{Colors.Light/Neutral/20}" }, + "container/skeleton": { "value": "{Colors.Dark/NeutralA/5}" }, + "container/subtle": { "value": "rgba(228, 228, 228, 0.02)" }, + "icon/secondary/default": { "value": "{Color.text/secondary/default}" }, + "icon/tertiary/default": { "value": "{Color.text/tertiary/default}" }, + "icon/negative/default": { "value": "{Color.text/negative/default}" }, + "icon/negative/hover": { "value": "{Color.text/negative/hover}" }, + "icon/negative/press": { "value": "{Color.text/negative/press}" }, + "icon/positive/default": { "value": "{Color.text/positive/default}" }, + "icon/positive/hover": { "value": "{Color.text/positive/hover}" }, + "icon/positive/press": { "value": "{Color.text/positive/press}" }, + "icon/notice/default": { "value": "{Color.text/notice/default}" }, + "icon/notice/hover": { "value": "{Color.text/notice/hover}" }, + "icon/notice/press": { "value": "{Color.text/notice/press}" }, + "icon/tertiary/hover": { "value": "{Color.text/tertiary/hover}" }, + "icon/tertiary/press": { "value": "{Color.text/tertiary/press}" }, + "icon/secondary/hover": { "value": "{Color.text/secondary/hover}" }, + "icon/secondary/press": { "value": "{Color.text/secondary/press}" }, + "text/default": { "value": "{Colors.Dark/Neutral/90}" }, + "text/hover": { "value": "{Colors.Dark/Neutral/80}" }, + "text/press": { "value": "{Colors.Dark/Neutral/70}" }, + "text/disable": { "value": "{Colors.Dark/Neutral/40}" }, + "text/secondary/default": { "value": "{Colors.Dark/Neutral/60}" }, + "text/secondary/hover": { "value": "{Colors.Dark/Neutral/70}" }, + "text/secondary/press": { "value": "{Colors.Dark/Neutral/80}" }, + "text/tertiary/default": { "value": "{Colors.Dark/Neutral/40}" }, + "text/tertiary/hover": { "value": "{Colors.Dark/Neutral/60}" }, + "text/tertiary/press": { "value": "{Colors.Dark/Neutral/70}" }, + "text/placeholder/default": { "value": "{Colors.Dark/Neutral/30}" }, + "text/placeholder/hover": { "value": "{Colors.Dark/Neutral/40}" }, + "text/placeholder/press": { "value": "{Colors.Dark/Neutral/50}" }, + "text/negative/default": { "value": "{Colors.Dark/Red/60}" }, + "text/negative/hover": { "value": "{Colors.Dark/Red/80}" }, + "text/negative/press": { "value": "{Colors.Dark/Red/90}" }, + "text/positive/default": { "value": "{Colors.Dark/Green/60}" }, + "text/positive/hover": { "value": "{Colors.Dark/Green/80}" }, + "text/positive/press": { "value": "{Colors.Dark/Green/90}" }, + "text/notice/default": { "value": "{Colors.Dark/Yellow/60}" }, + "text/notice/hover": { "value": "{Colors.Dark/Yellow/80}" }, + "text/notice/press": { "value": "{Colors.Dark/Yellow/90}" }, + "text/info/default": { "value": "{Colors.Dark/Blue/60}" }, + "text/info/hover": { "value": "{Colors.Dark/Blue/80}" }, + "text/info/press": { "value": "{Colors.Dark/Blue/90}" }, + "text/visited/default": { "value": "{Colors.Dark/Purple/60}" }, + "text/visited/hover": { "value": "{Colors.Dark/Purple/80}" }, + "text/visited/press": { "value": "{Colors.Dark/Purple/90}" }, + "text/on-primary/default": { "value": "{Colors.Dark/Neutral/90}" }, + "text/on-on-img/default": { "value": "{Colors.Dark/Neutral/90}" }, + "text/on-on-img/hover": { "value": "{Colors.Dark/Neutral/90}" }, + "text/on-on-img/press": { "value": "{Colors.Dark/Neutral/90}" }, + "text/on-primary/hover": { "value": "{Colors.Dark/Neutral/90}" }, + "text/on-primary/press": { "value": "{Colors.Dark/Neutral/90}" }, + "text/on-negative/default": { "value": "{Colors.Dark/Neutral/90}" }, + "text/on-negative/hover": { "value": "{Colors.Dark/Neutral/90}" }, + "text/on-negative/press": { "value": "{Colors.Dark/Neutral/90}" }, + "text/on-positive/default": { "value": "{Colors.Dark/Neutral/90}" }, + "text/on-positive/hover": { "value": "{Colors.Dark/Neutral/90}" }, + "text/on-positive/press": { "value": "{Colors.Dark/Neutral/90}" }, + "text/on-notice/default": { "value": "{Colors.Dark/Neutral/5}" }, + "text/on-notice/hover": { "value": "{Colors.Dark/Neutral/5}" }, + "text/on-notice/press": { "value": "{Colors.Dark/Neutral/5}" }, + "text/on-discovery/default": { "value": "{Colors.Dark/Neutral/90}" }, + "text/on-discovery/hover": { "value": "{Colors.Dark/Neutral/90}" }, + "text/on-discovery/press": { "value": "{Colors.Dark/Neutral/90}" }, + "text/on-HUD/default": { "value": "{Colors.Light/Neutral/90}" }, + "text/on-HUD/hover": { "value": "{Colors.Light/Neutral/90}" }, + "text/on-HUD/press": { "value": "{Colors.Light/Neutral/90}" }, + "text/brand-premium/default": { "value": "{Brand color.premium}" }, + "text/brand-premium/hover": { "value": "rgba(243, 152, 21, 1)" }, + "text/brand-premium/press": { "value": "rgba(213, 133, 18, 1)" }, + "icon/default": { "value": "{Color.text/default}" }, + "icon/hover": { "value": "{Color.text/hover}" }, + "icon/press": { "value": "{Color.text/press}" }, + "icon/disable": { "value": "{Color.text/disable}" }, + "icon/on-primary/default": { "value": "{Color.text/on-primary/default}" }, + "icon/on-primary/hover": { "value": "{Color.text/on-primary/hover}" }, + "icon/on-primary/press": { "value": "{Color.text/on-primary/press}" }, + "icon/on-on-img/default": { "value": "{Color.text/on-on-img/default}" }, + "icon/on-on-img/hover": { "value": "{Color.text/on-on-img/hover}" }, + "icon/on-on-img/press": { "value": "{Color.text/on-on-img/press}" }, + "icon/on-neutral/default": { "value": "{Colors.Dark/Neutral/90}" }, + "icon/on-neutral/hover": { "value": "{Colors.Dark/Neutral/90}" }, + "icon/on-neutral/press": { "value": "{Colors.Dark/Neutral/90}" }, + "border/default": { "value": "{Colors.Dark/Neutral/30}" }, + "border/secondary": { "value": "{Colors.Dark/NeutralA/10}" }, + "border/disable": { "value": "{Colors.Dark/NeutralA/5}" }, + "border/focus": { "value": "{Colors.Dark/Blue/20}" }, + "border/negative": { "value": "{Colors.Dark/Red/20}" }, + "icon/on-negative/default": { + "value": "{Color.text/on-negative/default}" + }, + "icon/on-negative/hover": { "value": "{Color.text/on-negative/hover}" }, + "icon/on-negative/press": { "value": "{Color.text/on-negative/press}" }, + "icon/on-positive/default": { + "value": "{Color.text/on-positive/default}" + }, + "icon/on-notice/default": { "value": "{Color.text/on-notice/default}" }, + "icon/on-notice/hover": { "value": "{Color.text/on-notice/hover}" }, + "icon/on-notice/press": { "value": "{Color.text/on-notice/press}" }, + "icon/on-positive/hover": { "value": "{Color.text/on-positive/hover}" }, + "icon/on-positive/press": { "value": "{Color.text/on-positive/press}" } + } + }, + "Space": { + "target-size/compact": { "value": "24" }, + "target-size/default": { "value": "32" }, + "target-size/cozy": { "value": "48" }, + "component/0": { "value": "{Spacings.space/0}" }, + "component/1": { "value": "{Spacings.space/1}" }, + "component/10": { "value": "{Spacings.space/10}" }, + "component/15": { "value": "{Spacings.space/15}" }, + "component/20": { "value": "{Spacings.space/20}" }, + "component/25": { "value": "{Spacings.space/25}" }, + "component/30": { "value": "{Spacings.space/30}" }, + "component/35": { "value": "{Spacings.space/35}" }, + "component/40": { "value": "{Spacings.space/40}" }, + "component/43": { "value": "{Spacings.space/43}" }, + "component/46": { "value": "{Spacings.space/46}" }, + "component/50": { "value": "{Spacings.space/50}" }, + "component/55": { "value": "{Spacings.space/55}" }, + "component/60": { "value": "{Spacings.space/60}" }, + "component/63": { "value": "{Spacings.space/63}" }, + "component/66": { "value": "{Spacings.space/66}" }, + "layout/0": { "value": "{Spacings.space/0}" }, + "layout/10": { "value": "{Spacings.space/10}" }, + "layout/20": { "value": "{Spacings.space/20}" }, + "layout/30": { "value": "{Spacings.space/30}" }, + "layout/40": { "value": "{Spacings.space/40}" }, + "layout/50": { "value": "{Spacings.space/50}" }, + "layout/60": { "value": "{Spacings.space/60}" }, + "layout/70": { "value": "{Spacings.space/70}" }, + "layout/80": { "value": "{Spacings.space/80}" }, + "layout/90": { "value": "{Spacings.space/90}" }, + "layout/100": { "value": "{Spacings.space/100}" } + } +} diff --git a/packages/theme/src/json/pixiv-light.json b/packages/theme/src/json/pixiv-light.json index dc14c0c4c..b4895ebef 100644 --- a/packages/theme/src/json/pixiv-light.json +++ b/packages/theme/src/json/pixiv-light.json @@ -1 +1,175 @@ -{"Color":{"background/default":{"value":"{Colors.Light/Neutral/0}"},"background/secondary":{"value":"{Colors.Light/Neutral/5}"},"background/tertiary":{"value":"{Colors.Light/Neutral/10}"},"container/default":{"value":"{Colors.Light/Neutral/0}"},"container/hover":{"value":"{Colors.Light/Neutral/5}"},"container/press":{"value":"{Colors.Light/Neutral/10}"},"container/disable":{"value":"{Colors.Light/Neutral/10}"},"container/secondary/default":{"value":"{Colors.Light/Neutral/5}"},"container/tertiary/default":{"value":"{Colors.Light/Neutral/10}"},"container/tertiary/hover":{"value":"{Colors.Light/Neutral/20}"},"container/tertiary/press":{"value":"{Colors.Light/Neutral/30}"},"container/tertiary/defaultA":{"value":"{Colors.Light/NeutralA/10}"},"container/tertiary/hoverA":{"value":"{Colors.Light/NeutralA/20}"},"container/tertiary/pressA":{"value":"{Colors.Light/NeutralA/30}"},"container/primary/default":{"value":"{Colors.Light/Blue/50}"},"container/primary/hover":{"value":"{Colors.Light/Blue/60}"},"container/primary/press":{"value":"{Colors.Light/Blue/70}"},"container/secondary/hover":{"value":"{Colors.Light/Neutral/10}"},"container/secondary/press":{"value":"{Colors.Light/Neutral/20}"},"container/secondary/defaultA":{"value":"{Colors.Light/NeutralA/5}"},"container/secondary/hoverA":{"value":"{Colors.Light/NeutralA/10}"},"container/secondary/pressA":{"value":"{Colors.Light/NeutralA/20}"},"container/on-img/default":{"value":"{Colors.Light/NeutralA/40}"},"container/on-img/hover":{"value":"{Colors.Light/NeutralA/50}"},"container/on-img/press":{"value":"{Colors.Light/NeutralA/60}"},"container/negative/default":{"value":"{Colors.Light/Red/50}"},"container/negative/hover":{"value":"{Colors.Light/Red/60}"},"container/negative/press":{"value":"{Colors.Light/Red/70}"},"container/positive/default":{"value":"{Colors.Light/Green/50}"},"container/positive/hover":{"value":"{Colors.Light/Green/60}"},"container/positive/press":{"value":"{Colors.Light/Green/70}"},"container/notice/default":{"value":"{Colors.Light/Yellow/20}"},"container/notice/hover":{"value":"{Colors.Light/Yellow/30}"},"container/notice/press":{"value":"{Colors.Light/Yellow/40}"},"container/neutral/default":{"value":"{Colors.Light/Neutral/50}"},"container/discovery/default":{"value":"{Colors.Light/Red/50}"},"container/discovery/hover":{"value":"{Colors.Light/Red/60}"},"container/discovery/press":{"value":"{Colors.Light/Red/70}"},"container/neutral/hover":{"value":"{Colors.Light/Neutral/60}"},"container/neutral/press":{"value":"{Colors.Light/Neutral/70}"},"container/HUD/default":{"value":"{Colors.Light/Neutral/80}"},"container/HUD/hover":{"value":"{Colors.Light/Neutral/70}"},"container/HUD/press":{"value":"{Colors.Light/Neutral/60}"},"container/skeleton":{"value":"{Colors.Light/NeutralA/5}"},"container/subtle":{"value":"rgba(31, 31, 31, 0.02)"},"icon/secondary/default":{"value":"{Color.text/secondary/default}"},"icon/tertiary/default":{"value":"{Color.text/tertiary/default}"},"icon/negative/default":{"value":"{Color.text/negative/default}"},"icon/negative/hover":{"value":"{Color.text/negative/hover}"},"icon/negative/press":{"value":"{Color.text/negative/press}"},"icon/positive/default":{"value":"{Color.text/positive/default}"},"icon/positive/hover":{"value":"{Color.text/positive/hover}"},"icon/positive/press":{"value":"{Color.text/positive/hover}"},"icon/notice/default":{"value":"{Color.text/notice/default}"},"icon/notice/hover":{"value":"{Color.text/notice/hover}"},"icon/notice/press":{"value":"{Color.text/notice/press}"},"icon/tertiary/hover":{"value":"{Color.text/tertiary/hover}"},"icon/tertiary/press":{"value":"{Color.text/tertiary/press}"},"icon/secondary/hover":{"value":"{Color.text/secondary/hover}"},"icon/secondary/press":{"value":"{Color.text/secondary/press}"},"text/default":{"value":"{Colors.Light/Neutral/90}"},"text/hover":{"value":"{Colors.Light/Neutral/80}"},"text/press":{"value":"{Colors.Light/Neutral/70}"},"text/disable":{"value":"{Colors.Light/Neutral/30}"},"text/secondary/default":{"value":"{Colors.Light/Neutral/70}"},"text/secondary/hover":{"value":"{Colors.Light/Neutral/80}"},"text/secondary/press":{"value":"{Colors.Light/Neutral/90}"},"text/tertiary/default":{"value":"{Colors.Light/Neutral/60}"},"text/tertiary/hover":{"value":"{Colors.Light/Neutral/70}"},"text/tertiary/press":{"value":"{Colors.Light/Neutral/80}"},"text/placeholder/default":{"value":"{Colors.Light/Neutral/50}"},"text/placeholder/hover":{"value":"{Colors.Light/Neutral/60}"},"text/placeholder/press":{"value":"{Colors.Light/Neutral/70}"},"text/negative/default":{"value":"{Colors.Light/Red/60}"},"text/negative/hover":{"value":"{Colors.Light/Red/70}"},"text/negative/press":{"value":"{Colors.Light/Red/80}"},"text/positive/default":{"value":"{Colors.Light/Green/60}"},"text/positive/hover":{"value":"{Colors.Light/Green/70}"},"text/positive/press":{"value":"{Colors.Light/Green/80}"},"text/notice/default":{"value":"{Colors.Light/Yellow/60}"},"text/notice/hover":{"value":"{Colors.Light/Yellow/70}"},"text/notice/press":{"value":"{Colors.Light/Yellow/80}"},"text/info/default":{"value":"{Colors.Light/Blue/60}"},"text/info/hover":{"value":"{Colors.Light/Blue/70}"},"text/info/press":{"value":"{Colors.Light/Blue/80}"},"text/visited/default":{"value":"{Colors.Light/Purple/70}"},"text/visited/hover":{"value":"{Colors.Light/Purple/80}"},"text/visited/press":{"value":"{Colors.Light/Purple/90}"},"text/on-primary/default":{"value":"{Colors.Light/Neutral/0}"},"text/on-on-img/default":{"value":"{Colors.Light/Neutral/0}"},"text/on-on-img/hover":{"value":"{Colors.Light/Neutral/0}"},"text/on-on-img/press":{"value":"{Colors.Light/Neutral/0}"},"text/on-primary/hover":{"value":"{Colors.Light/Neutral/0}"},"text/on-primary/press":{"value":"{Colors.Light/Neutral/0}"},"text/on-negative/default":{"value":"{Colors.Light/Neutral/0}"},"text/on-negative/hover":{"value":"{Colors.Light/Neutral/0}"},"text/on-negative/press":{"value":"{Colors.Light/Neutral/0}"},"text/on-positive/default":{"value":"{Colors.Light/Neutral/0}"},"text/on-positive/hover":{"value":"{Colors.Light/Neutral/0}"},"text/on-positive/press":{"value":"{Colors.Light/Neutral/0}"},"text/on-notice/default":{"value":"{Colors.Light/Neutral/90}"},"text/on-notice/hover":{"value":"{Colors.Light/Neutral/90}"},"text/on-notice/press":{"value":"{Colors.Light/Neutral/90}"},"text/on-discovery/default":{"value":"{Colors.Light/Neutral/0}"},"text/on-discovery/hover":{"value":"{Colors.Light/Neutral/0}"},"text/on-discovery/press":{"value":"{Colors.Light/Neutral/0}"},"text/on-HUD/default":{"value":"{Colors.Dark/Neutral/90}"},"text/on-HUD/hover":{"value":"{Colors.Dark/Neutral/90}"},"text/on-HUD/press":{"value":"{Colors.Dark/Neutral/90}"},"text/brand-premium/default":{"value":"{Brand color.premium}"},"text/brand-premium/hover":{"value":"rgba(243, 152, 21, 1)"},"text/brand-premium/press":{"value":"rgba(213, 133, 18, 1)"},"icon/default":{"value":"{Color.text/default}"},"icon/hover":{"value":"{Color.text/hover}"},"icon/press":{"value":"{Color.text/press}"},"icon/disable":{"value":"{Color.text/disable}"},"icon/on-primary/default":{"value":"{Color.text/on-primary/default}"},"icon/on-primary/hover":{"value":"{Color.text/on-primary/hover}"},"icon/on-primary/press":{"value":"{Color.text/on-primary/press}"},"icon/on-on-img/default":{"value":"{Color.text/on-on-img/default}"},"icon/on-on-img/hover":{"value":"{Color.text/on-on-img/hover}"},"icon/on-on-img/press":{"value":"{Color.text/on-on-img/press}"},"icon/on-neutral/default":{"value":"{Colors.Light/Neutral/0}"},"icon/on-neutral/hover":{"value":"{Colors.Light/Neutral/5}"},"icon/on-neutral/press":{"value":"{Colors.Light/Neutral/10}"},"border/default":{"value":"{Colors.Light/NeutralA/50}"},"border/secondary":{"value":"{Colors.Light/NeutralA/10}"},"border/disable":{"value":"{Colors.Light/NeutralA/10}"},"border/focus":{"value":"{Colors.Light/Blue/20}"},"border/negative":{"value":"{Colors.Light/Red/20}"},"icon/on-negative/default":{"value":"{Color.text/on-negative/default}"},"icon/on-negative/hover":{"value":"{Color.text/on-negative/hover}"},"icon/on-negative/press":{"value":"{Color.text/on-negative/press}"},"icon/on-positive/default":{"value":"{Color.text/on-positive/default}"},"icon/on-notice/default":{"value":"{Color.text/on-notice/default}"},"icon/on-notice/hover":{"value":"{Color.text/on-notice/hover}"},"icon/on-notice/press":{"value":"{Color.text/on-notice/press}"},"icon/on-positive/hover":{"value":"{Color.text/on-positive/hover}"},"icon/on-positive/press":{"value":"{Color.text/on-positive/press}"}},"Space":{"target-size/compact":{"value":"24"},"target-size/default":{"value":"32"},"target-size/cozy":{"value":"48"},"component/0":{"value":"{Spacings.space/0}"},"component/1":{"value":"{Spacings.space/1}"},"component/10":{"value":"{Spacings.space/10}"},"component/15":{"value":"{Spacings.space/15}"},"component/20":{"value":"{Spacings.space/20}"},"component/25":{"value":"{Spacings.space/25}"},"component/30":{"value":"{Spacings.space/30}"},"component/35":{"value":"{Spacings.space/35}"},"component/40":{"value":"{Spacings.space/40}"},"component/43":{"value":"{Spacings.space/43}"},"component/46":{"value":"{Spacings.space/46}"},"component/50":{"value":"{Spacings.space/50}"},"component/55":{"value":"{Spacings.space/55}"},"component/60":{"value":"{Spacings.space/60}"},"component/63":{"value":"{Spacings.space/63}"},"component/66":{"value":"{Spacings.space/66}"},"layout/0":{"value":"{Spacings.space/0}"},"layout/10":{"value":"{Spacings.space/10}"},"layout/20":{"value":"{Spacings.space/20}"},"layout/30":{"value":"{Spacings.space/30}"},"layout/40":{"value":"{Spacings.space/40}"},"layout/50":{"value":"{Spacings.space/50}"},"layout/60":{"value":"{Spacings.space/60}"},"layout/70":{"value":"{Spacings.space/70}"},"layout/80":{"value":"{Spacings.space/80}"},"layout/90":{"value":"{Spacings.space/90}"},"layout/100":{"value":"{Spacings.space/100}"}}} \ No newline at end of file +{ + "Color": { + "background/default": { "value": "{Colors.Light/Neutral/0}" }, + "background/secondary": { "value": "{Colors.Light/Neutral/5}" }, + "background/tertiary": { "value": "{Colors.Light/Neutral/10}" }, + "container/default": { "value": "{Colors.Light/Neutral/0}" }, + "container/hover": { "value": "{Colors.Light/Neutral/5}" }, + "container/press": { "value": "{Colors.Light/Neutral/10}" }, + "container/disable": { "value": "{Colors.Light/Neutral/10}" }, + "container/secondary/default": { "value": "{Colors.Light/Neutral/5}" }, + "container/tertiary/default": { "value": "{Colors.Light/Neutral/10}" }, + "container/tertiary/hover": { "value": "{Colors.Light/Neutral/20}" }, + "container/tertiary/press": { "value": "{Colors.Light/Neutral/30}" }, + "container/tertiary/defaultA": { "value": "{Colors.Light/NeutralA/10}" }, + "container/tertiary/hoverA": { "value": "{Colors.Light/NeutralA/20}" }, + "container/tertiary/pressA": { "value": "{Colors.Light/NeutralA/30}" }, + "container/primary/default": { "value": "{Colors.Light/Blue/50}" }, + "container/primary/hover": { "value": "{Colors.Light/Blue/60}" }, + "container/primary/press": { "value": "{Colors.Light/Blue/70}" }, + "container/secondary/hover": { "value": "{Colors.Light/Neutral/10}" }, + "container/secondary/press": { "value": "{Colors.Light/Neutral/20}" }, + "container/secondary/defaultA": { "value": "{Colors.Light/NeutralA/5}" }, + "container/secondary/hoverA": { "value": "{Colors.Light/NeutralA/10}" }, + "container/secondary/pressA": { "value": "{Colors.Light/NeutralA/20}" }, + "container/on-img/default": { "value": "{Colors.Light/NeutralA/40}" }, + "container/on-img/hover": { "value": "{Colors.Light/NeutralA/50}" }, + "container/on-img/press": { "value": "{Colors.Light/NeutralA/60}" }, + "container/negative/default": { "value": "{Colors.Light/Red/50}" }, + "container/negative/hover": { "value": "{Colors.Light/Red/60}" }, + "container/negative/press": { "value": "{Colors.Light/Red/70}" }, + "container/positive/default": { "value": "{Colors.Light/Green/50}" }, + "container/positive/hover": { "value": "{Colors.Light/Green/60}" }, + "container/positive/press": { "value": "{Colors.Light/Green/70}" }, + "container/notice/default": { "value": "{Colors.Light/Yellow/20}" }, + "container/notice/hover": { "value": "{Colors.Light/Yellow/30}" }, + "container/notice/press": { "value": "{Colors.Light/Yellow/40}" }, + "container/neutral/default": { "value": "{Colors.Light/Neutral/50}" }, + "container/discovery/default": { "value": "{Colors.Light/Red/50}" }, + "container/discovery/hover": { "value": "{Colors.Light/Red/60}" }, + "container/discovery/press": { "value": "{Colors.Light/Red/70}" }, + "container/neutral/hover": { "value": "{Colors.Light/Neutral/60}" }, + "container/neutral/press": { "value": "{Colors.Light/Neutral/70}" }, + "container/HUD/default": { "value": "{Colors.Light/Neutral/80}" }, + "container/HUD/hover": { "value": "{Colors.Light/Neutral/70}" }, + "container/HUD/press": { "value": "{Colors.Light/Neutral/60}" }, + "container/skeleton": { "value": "{Colors.Light/NeutralA/5}" }, + "container/subtle": { "value": "rgba(31, 31, 31, 0.02)" }, + "icon/secondary/default": { "value": "{Color.text/secondary/default}" }, + "icon/tertiary/default": { "value": "{Color.text/tertiary/default}" }, + "icon/negative/default": { "value": "{Color.text/negative/default}" }, + "icon/negative/hover": { "value": "{Color.text/negative/hover}" }, + "icon/negative/press": { "value": "{Color.text/negative/press}" }, + "icon/positive/default": { "value": "{Color.text/positive/default}" }, + "icon/positive/hover": { "value": "{Color.text/positive/hover}" }, + "icon/positive/press": { "value": "{Color.text/positive/hover}" }, + "icon/notice/default": { "value": "{Color.text/notice/default}" }, + "icon/notice/hover": { "value": "{Color.text/notice/hover}" }, + "icon/notice/press": { "value": "{Color.text/notice/press}" }, + "icon/tertiary/hover": { "value": "{Color.text/tertiary/hover}" }, + "icon/tertiary/press": { "value": "{Color.text/tertiary/press}" }, + "icon/secondary/hover": { "value": "{Color.text/secondary/hover}" }, + "icon/secondary/press": { "value": "{Color.text/secondary/press}" }, + "text/default": { "value": "{Colors.Light/Neutral/90}" }, + "text/hover": { "value": "{Colors.Light/Neutral/80}" }, + "text/press": { "value": "{Colors.Light/Neutral/70}" }, + "text/disable": { "value": "{Colors.Light/Neutral/30}" }, + "text/secondary/default": { "value": "{Colors.Light/Neutral/70}" }, + "text/secondary/hover": { "value": "{Colors.Light/Neutral/80}" }, + "text/secondary/press": { "value": "{Colors.Light/Neutral/90}" }, + "text/tertiary/default": { "value": "{Colors.Light/Neutral/60}" }, + "text/tertiary/hover": { "value": "{Colors.Light/Neutral/70}" }, + "text/tertiary/press": { "value": "{Colors.Light/Neutral/80}" }, + "text/placeholder/default": { "value": "{Colors.Light/Neutral/50}" }, + "text/placeholder/hover": { "value": "{Colors.Light/Neutral/60}" }, + "text/placeholder/press": { "value": "{Colors.Light/Neutral/70}" }, + "text/negative/default": { "value": "{Colors.Light/Red/60}" }, + "text/negative/hover": { "value": "{Colors.Light/Red/70}" }, + "text/negative/press": { "value": "{Colors.Light/Red/80}" }, + "text/positive/default": { "value": "{Colors.Light/Green/60}" }, + "text/positive/hover": { "value": "{Colors.Light/Green/70}" }, + "text/positive/press": { "value": "{Colors.Light/Green/80}" }, + "text/notice/default": { "value": "{Colors.Light/Yellow/60}" }, + "text/notice/hover": { "value": "{Colors.Light/Yellow/70}" }, + "text/notice/press": { "value": "{Colors.Light/Yellow/80}" }, + "text/info/default": { "value": "{Colors.Light/Blue/60}" }, + "text/info/hover": { "value": "{Colors.Light/Blue/70}" }, + "text/info/press": { "value": "{Colors.Light/Blue/80}" }, + "text/visited/default": { "value": "{Colors.Light/Purple/70}" }, + "text/visited/hover": { "value": "{Colors.Light/Purple/80}" }, + "text/visited/press": { "value": "{Colors.Light/Purple/90}" }, + "text/on-primary/default": { "value": "{Colors.Light/Neutral/0}" }, + "text/on-on-img/default": { "value": "{Colors.Light/Neutral/0}" }, + "text/on-on-img/hover": { "value": "{Colors.Light/Neutral/0}" }, + "text/on-on-img/press": { "value": "{Colors.Light/Neutral/0}" }, + "text/on-primary/hover": { "value": "{Colors.Light/Neutral/0}" }, + "text/on-primary/press": { "value": "{Colors.Light/Neutral/0}" }, + "text/on-negative/default": { "value": "{Colors.Light/Neutral/0}" }, + "text/on-negative/hover": { "value": "{Colors.Light/Neutral/0}" }, + "text/on-negative/press": { "value": "{Colors.Light/Neutral/0}" }, + "text/on-positive/default": { "value": "{Colors.Light/Neutral/0}" }, + "text/on-positive/hover": { "value": "{Colors.Light/Neutral/0}" }, + "text/on-positive/press": { "value": "{Colors.Light/Neutral/0}" }, + "text/on-notice/default": { "value": "{Colors.Light/Neutral/90}" }, + "text/on-notice/hover": { "value": "{Colors.Light/Neutral/90}" }, + "text/on-notice/press": { "value": "{Colors.Light/Neutral/90}" }, + "text/on-discovery/default": { "value": "{Colors.Light/Neutral/0}" }, + "text/on-discovery/hover": { "value": "{Colors.Light/Neutral/0}" }, + "text/on-discovery/press": { "value": "{Colors.Light/Neutral/0}" }, + "text/on-HUD/default": { "value": "{Colors.Dark/Neutral/90}" }, + "text/on-HUD/hover": { "value": "{Colors.Dark/Neutral/90}" }, + "text/on-HUD/press": { "value": "{Colors.Dark/Neutral/90}" }, + "text/brand-premium/default": { "value": "{Brand color.premium}" }, + "text/brand-premium/hover": { "value": "rgba(243, 152, 21, 1)" }, + "text/brand-premium/press": { "value": "rgba(213, 133, 18, 1)" }, + "icon/default": { "value": "{Color.text/default}" }, + "icon/hover": { "value": "{Color.text/hover}" }, + "icon/press": { "value": "{Color.text/press}" }, + "icon/disable": { "value": "{Color.text/disable}" }, + "icon/on-primary/default": { "value": "{Color.text/on-primary/default}" }, + "icon/on-primary/hover": { "value": "{Color.text/on-primary/hover}" }, + "icon/on-primary/press": { "value": "{Color.text/on-primary/press}" }, + "icon/on-on-img/default": { "value": "{Color.text/on-on-img/default}" }, + "icon/on-on-img/hover": { "value": "{Color.text/on-on-img/hover}" }, + "icon/on-on-img/press": { "value": "{Color.text/on-on-img/press}" }, + "icon/on-neutral/default": { "value": "{Colors.Light/Neutral/0}" }, + "icon/on-neutral/hover": { "value": "{Colors.Light/Neutral/5}" }, + "icon/on-neutral/press": { "value": "{Colors.Light/Neutral/10}" }, + "border/default": { "value": "{Colors.Light/NeutralA/50}" }, + "border/secondary": { "value": "{Colors.Light/NeutralA/10}" }, + "border/disable": { "value": "{Colors.Light/NeutralA/10}" }, + "border/focus": { "value": "{Colors.Light/Blue/20}" }, + "border/negative": { "value": "{Colors.Light/Red/20}" }, + "icon/on-negative/default": { "value": "{Color.text/on-negative/default}" }, + "icon/on-negative/hover": { "value": "{Color.text/on-negative/hover}" }, + "icon/on-negative/press": { "value": "{Color.text/on-negative/press}" }, + "icon/on-positive/default": { "value": "{Color.text/on-positive/default}" }, + "icon/on-notice/default": { "value": "{Color.text/on-notice/default}" }, + "icon/on-notice/hover": { "value": "{Color.text/on-notice/hover}" }, + "icon/on-notice/press": { "value": "{Color.text/on-notice/press}" }, + "icon/on-positive/hover": { "value": "{Color.text/on-positive/hover}" }, + "icon/on-positive/press": { "value": "{Color.text/on-positive/press}" } + }, + "Space": { + "target-size/compact": { "value": "24" }, + "target-size/default": { "value": "32" }, + "target-size/cozy": { "value": "48" }, + "component/0": { "value": "{Spacings.space/0}" }, + "component/1": { "value": "{Spacings.space/1}" }, + "component/10": { "value": "{Spacings.space/10}" }, + "component/15": { "value": "{Spacings.space/15}" }, + "component/20": { "value": "{Spacings.space/20}" }, + "component/25": { "value": "{Spacings.space/25}" }, + "component/30": { "value": "{Spacings.space/30}" }, + "component/35": { "value": "{Spacings.space/35}" }, + "component/40": { "value": "{Spacings.space/40}" }, + "component/43": { "value": "{Spacings.space/43}" }, + "component/46": { "value": "{Spacings.space/46}" }, + "component/50": { "value": "{Spacings.space/50}" }, + "component/55": { "value": "{Spacings.space/55}" }, + "component/60": { "value": "{Spacings.space/60}" }, + "component/63": { "value": "{Spacings.space/63}" }, + "component/66": { "value": "{Spacings.space/66}" }, + "layout/0": { "value": "{Spacings.space/0}" }, + "layout/10": { "value": "{Spacings.space/10}" }, + "layout/20": { "value": "{Spacings.space/20}" }, + "layout/30": { "value": "{Spacings.space/30}" }, + "layout/40": { "value": "{Spacings.space/40}" }, + "layout/50": { "value": "{Spacings.space/50}" }, + "layout/60": { "value": "{Spacings.space/60}" }, + "layout/70": { "value": "{Spacings.space/70}" }, + "layout/80": { "value": "{Spacings.space/80}" }, + "layout/90": { "value": "{Spacings.space/90}" }, + "layout/100": { "value": "{Spacings.space/100}" } + } +} diff --git a/packages/token-cli/pixiv-dark.config.js b/packages/token-cli/pixiv-dark.config.js index d3d33c8fc..2ecab5547 100644 --- a/packages/token-cli/pixiv-dark.config.js +++ b/packages/token-cli/pixiv-dark.config.js @@ -1,29 +1,30 @@ // eslint-disable-next-line @typescript-eslint/no-var-requires -const { transformer } = require('./src/transformer') +const { nameTransformer } = require('./src/transformer') -/** @type { import('style-dictionary') } */ +/** @type { import('style-dictionary').Config } */ module.exports = { source: ['tokens/base.json', 'tokens/pixiv-dark.json'], transform: { - 'name/cti/kebab': { + 'charcoal/kebab': { type: 'name', - transformer: transformer, + transformer: nameTransformer, }, }, platforms: { css: { + transforms: ['charcoal/kebab'], transformGroup: 'css', buildPath: 'build/css/', - prefix: 'charcoal', files: [ { destination: '_variables_dark.css', format: 'css/variables', + options: { + selector: ":root[data-color-scheme='dark']", + outputReferences: true, + }, }, ], - options: { - outputReferences: true, - }, }, }, } diff --git a/packages/token-cli/pixiv-light.config.js b/packages/token-cli/pixiv-light.config.js index 821335bd8..f68b6e826 100644 --- a/packages/token-cli/pixiv-light.config.js +++ b/packages/token-cli/pixiv-light.config.js @@ -1,29 +1,31 @@ // eslint-disable-next-line @typescript-eslint/no-var-requires -const { transformer } = require('./src/transformer') +const { nameTransformer } = require('./src/transformer') -/** @type { import('style-dictionary') } */ +/** @type { import('style-dictionary').Config } */ module.exports = { source: ['tokens/base.json', 'tokens/pixiv-light.json'], transform: { - 'name/cti/kebab': { + 'charcoal/kebab': { type: 'name', - transformer: transformer, + transformer: nameTransformer, }, }, platforms: { css: { + transforms: ['charcoal/kebab'], transformGroup: 'css', buildPath: 'build/css/', - prefix: 'charcoal', files: [ { destination: '_variables_light.css', format: 'css/variables', + options: { + selector: + ":root[data-color-scheme='light'], :root:not([data-color-scheme])", + outputReferences: true, + }, }, ], - options: { - outputReferences: true, - }, }, }, } diff --git a/packages/token-cli/src/transformer/index.js b/packages/token-cli/src/transformer/index.js index 9296cc2f1..c9ad88748 100644 --- a/packages/token-cli/src/transformer/index.js +++ b/packages/token-cli/src/transformer/index.js @@ -2,8 +2,8 @@ * @param {import('style-dictionary').TransformedToken} token * @return {string} */ -const transformer = (token) => { - return token.path +const nameTransformer = (token) => { + const name = token.path .join('-') .replace(/(.)([A-Z])/g, '$1-$2') .replace(/([A-Z])([A-Z])/g, '$1-$2') @@ -11,8 +11,10 @@ const transformer = (token) => { .replaceAll('/', '-') .replaceAll(' ', '-') .replace(/(--)(\D)/g, '-$2') + + return `charcoal-${name}` } module.exports = { - transformer, + nameTransformer, } diff --git a/packages/token-cli/src/transformer/index.test.js b/packages/token-cli/src/transformer/index.test.js index ce9270c9c..603beb93e 100644 --- a/packages/token-cli/src/transformer/index.test.js +++ b/packages/token-cli/src/transformer/index.test.js @@ -1,22 +1,22 @@ // eslint-disable-next-line @typescript-eslint/no-var-requires -const { transformer } = require('.') +const { nameTransformer } = require('.') test('tests transformer real case', () => { - expect(transformer({ path: ['Color', 'container/secondary/defaultA'] })).toBe( - 'color-container-secondary-default-a' - ) + expect( + nameTransformer({ path: ['Color', 'container/secondary/defaultA'] }) + ).toBe('charcoal-color-container-secondary-default-a') }) test('tests transformer negative primitive value case', () => { - expect(transformer({ path: ['Colors', 'Dark/Neutral/-10'] })).toBe( - 'colors-dark-neutral--10' + expect(nameTransformer({ path: ['Colors', 'Dark/Neutral/-10'] })).toBe( + 'charcoal-colors-dark-neutral--10' ) }) test('tests transformer negative primitive value unreal case', () => { - expect(transformer({ path: ['Colors', 'dark/neutralABCDEF/-10'] })).toBe( - 'colors-dark-neutral-a-b-c-d-e-f--10' + expect(nameTransformer({ path: ['Colors', 'dark/neutralABCDEF/-10'] })).toBe( + 'charcoal-colors-dark-neutral-a-b-c-d-e-f--10' ) }) test('tests transformer unreal case', () => { expect( - transformer({ path: ['Color', 'Container/Secondary/DefaultABCDEF'] }) - ).toBe('color-container-secondary-default-a-b-c-d-e-f') + nameTransformer({ path: ['Color', 'Container/Secondary/DefaultABCDEF'] }) + ).toBe('charcoal-color-container-secondary-default-a-b-c-d-e-f') })