Merge pull request #12 from MikuKaneko/master

fix: .side-block.sns

package.json

@@ -16,15 +16,15 @@
 		"@csstools/postcss-global-data": "^2.0.0",
 		"autoprefixer": "^10.4.13",
 		"eslint": "^8.34.0",
-		"eslint-config-prettier": "^8.6.0",
+		"eslint-config-prettier": "^9.0.0",
 		"eslint-plugin-prettier": "^5.0.0",
 		"lightningcss": "^1.19.0",
 		"node": "^20.0.0",
 		"postcss": "^8.4.21",
 		"postcss-cli": "^10.1.0",
 		"postcss-csso": "^6.0.1",
 		"postcss-import": "^15.1.0",
-		"postcss-lightningcss": "^0.9.0",
+		"postcss-lightningcss": "^1.0.0",
 		"postcss-mixins": "^9.0.4",
 		"postcss-preset-env": "^9.0.0",
 		"postcss-reporter": "^7.0.5",

src/css/parts/elements.css

@@ -1159,33 +1159,46 @@ div.heritage-rating-module {
 		margin: auto;
 		min-width: inherit;
 		top: 0;
-		transform: unset;
+		translate: unset;
 		width: -webkit-fit-content;
 		width: -moz-fit-content;
 		width: fit-content;
 	}
 
 	& div.modalbox {
-		aspect-ratio: 16 / 9;
-		max-width: 25rem !important;
-		min-height: inherit;
+		max-width: 30rem!important;
+		min-height: -webkit-fit-content;
+		min-height: -moz-fit-content;
+		min-height: fit-content;
 
 		& .modalbox-title {
 			border-radius: 0;
 		}
 
 		& .credit {
-			margin: 0 1rem;
-
 			&.otherwise {
+				height: -webkit-max-content;
+				height: -moz-max-content;
 				height: max-content;
 				overflow-y: auto;
 			}
 		}
 	}
 
-	& div.credit-back::before {
-		content: "クレジット";
+	& div.credit-back {
+		margin: .25em auto;
+		width: -webkit-fit-content;
+		width: -moz-fit-content;
+		width: fit-content;
+
+		& iframe {
+			opacity: 0;
+		}
+
+		&::before {
+			content: "クレジット";
+			position: static;
+		}
 	}
 
 	& div.creditBottomRate {
@@ -1199,6 +1212,15 @@ div.heritage-rating-module {
 	}
 }
 
+/* Award Modal For JP */
+div[class*="award"]~#u-credit-otherwise {
+	& .modalbox {
+		background: radial-gradient(rgba(255, 219, 90, .95) 0, rgb(255, 255, 255) 100%) !important;
+		-webkit-box-shadow: none;
+		box-shadow: none;
+	}
+}
+
 /* Heritage Rating Module For JP */
 :is(.creditRate.creditModule, [id*="u-credit"] .Dendo) {
 

src/css/parts/header.css

@@ -516,7 +516,7 @@ div#container-wrap {
 		position: absolute;
 		z-index: 12;
 		inset: 1.5rem 0 auto auto;
-		width: 10em;
+		width: 12em;
 		margin: 0.25em 0 0;
 		padding: 0;
 		overflow: hidden;

src/css/parts/sidebar.css

@@ -1005,7 +1005,7 @@
 			> div {
 					display: contents !important;
 
-				& > div {
+				&.menu-item > div {
 					border-left: none;
 				}
 			}
@@ -1045,12 +1045,12 @@
 					opacity: 0;
 				}
 
-				&*[href*="discord"] {
+				&[href*="discord"] {
 					--social-logo-mask: var(--discord-mask);
 					--social-color: var(--discord-icon-color);
 				}
 
-				&*[href*="twitter"] {
+				&[href*="twitter"] {
 					--social-logo-mask: var(--twitter-mask);
 					--social-color: var(--twitter-icon-color);
 				}

src/css/parts/structure.css

@@ -44,12 +44,33 @@
 	font-weight: var(--wght, revert);
 
 	@supports (font-variation-settings: inherit) {
-		font-variation-settings: "ital" var(--ital, 0), "slnt" var(--slnt, 0), "CASL" var(--CASL, 0), "CRSV" var(--CRSV, 0), "MONO" var(--MONO, 0), "FLAR" var(--FLAR, 0);
+		font-variation-settings:
+			"ital" var(--ital, 0),
+			"slnt" var(--slnt, 0),
+			"CASL" var(--CASL, 0),
+			"CRSV" var(--CRSV, 0),
+			"MONO" var(--MONO, 0),
+			"FLAR" var(--FLAR, 0);
 	}
 
 	@supports (font-feature-settings: inherit) {
-		font-feature-settings: "lnum" var(--lnum, 1), "pnum" var(--pnum, 1), "kern" var(--kern, 1), "cpsp" var(--cpsp, 1), "liga" var(--liga, 1), "case" var(--case, 1), "clig" var(--clig, 1), "dlig" var(--dlig, 0), "calt" var(--calt, 1),
-			"aalt" var(--aalt, 0), "ss01" var(--ss01, 1), "ss02" var(--ss02, 0), "ss03" var(--ss03, 1), "ss04" var(--ss04, 1), "zero" var(--zero, 1), "cv11" var(--cv11, 0);
+		font-feature-settings:
+			"lnum" var(--lnum, 1),
+			"pnum" var(--pnum, 1),
+			"kern" var(--kern, 1),
+			"cpsp" var(--cpsp, 1),
+			"liga" var(--liga, 1),
+			"case" var(--case, 1),
+			"clig" var(--clig, 1),
+			"dlig" var(--dlig, 0),
+			"calt" var(--calt, 1),
+			"aalt" var(--aalt, 0),
+			"ss01" var(--ss01, 1),
+			"ss02" var(--ss02, 0),
+			"ss03" var(--ss03, 1),
+			"ss04" var(--ss04, 1),
+			"zero" var(--zero, 1),
+			"cv11" var(--cv11, 0);
 	}
 }
 
@@ -113,6 +134,7 @@ body {
 	line-height: var(--base-line-height);
 	word-break: normal;
 	hyphens: manual;
+	font-optical-sizing: auto;
 
 	/* line behavior */
 	orphans: 2;
@@ -438,9 +460,9 @@ input[type="checkbox"] {
 
 		&::before {
 			transition:
-			background-color 0.05s var(--ease-in-out) 0.2s,
-			box-shadow 0.15s var(--ease-in-out) 0.15s,
-			clip-path 0.15s var(--ease-in-out) 0.15s;
+				background-color 0.05s var(--ease-in-out) 0.2s,
+				box-shadow 0.15s var(--ease-in-out) 0.15s,
+				clip-path 0.15s var(--ease-in-out) 0.15s;
 		}
 
 		&::after {
@@ -611,13 +633,7 @@ input[type="radio"] {
 						background-color 0.2s var(--ease-in-out),
 						background-image 0.05s var(--ease-in-out);
 					background-color: rgb(var(--swatch-background));
-					background-image:
-						linear-gradient(
-							to bottom,
-							rgb(var(--background-gradient-color)),
-							rgba(var(--background-gradient-color), 0) var(--background-gradient-distance),
-							rgba(var(--background-gradient-color), 0) 100%
-						);
+					background-image: linear-gradient(to bottom, rgb(var(--background-gradient-color)), rgba(var(--background-gradient-color), 0) var(--background-gradient-distance), rgba(var(--background-gradient-color), 0) 100%);
 					pointer-events: none;
 					background-position-y: top;
 				}
@@ -638,20 +654,11 @@ input[type="radio"] {
 					padding-left: 0.5rem;
 					outline: 0 solid rgb(var(--swatch-primary));
 					color: rgb(var(--swatch-background));
-					clip-path: polygon(
-						0 0,
-						calc(100% + 0.125rem) 0,
-						calc(100% + 0.125rem) calc(100% + 0.125rem),
-						0 calc(100% + 0.125rem)
-					);
+					clip-path: polygon(0 0, calc(100% + 0.125rem) 0, calc(100% + 0.125rem) calc(100% + 0.125rem), 0 calc(100% + 0.125rem));
 
 					&::before {
 						background-color: rgb(var(--swatch-primary));
-						background-image: linear-gradient(
-							to bottom,
-							rgba(var(--background-gradient-color), 0) 0,
-							rgba(var(--background-gradient-color), 0) var(--background-gradient-distance)
-						);
+						background-image: linear-gradient(to bottom, rgba(var(--background-gradient-color), 0) 0, rgba(var(--background-gradient-color), 0) var(--background-gradient-distance));
 						clip-path: unset;
 					}
 				}
@@ -777,8 +784,7 @@ input[type="radio"] {
 
 				#edit-page-form.data-form .form-row span.field-checkbox input:checked + &,
 				#new-post-form.data-form .form-row span.field-checkbox input:checked + &,
-				#new-thread-form.data-form .form-row span.field-checkbox input:checked + &
-				 {
+				#new-thread-form.data-form .form-row span.field-checkbox input:checked + & {
 					translate: 0.25em;
 
 					@supports not (translate: 0.25em) {
@@ -1093,7 +1099,11 @@ pre {
 		max-width: 90vw;
 		font-family: var(--mono-font);
 		white-space: pre;
-		font-variation-settings: "wght" var(--mono-wght), "CASL" var(--CASL), "CRSV" var(--CRSV), "MONO" var(--MONO);
+		font-variation-settings:
+			"wght" var(--mono-wght),
+			"CASL" var(--CASL),
+			"CRSV" var(--CRSV),
+			"MONO" var(--MONO);
 	}
 
 	& i,
@@ -1111,7 +1121,7 @@ pre {
 /* Unsetting Footnoteref styling on Common Theme */
 .footnoteref {
 	position: unset;
-	top: -.5em;
+	top: -0.5em;
 	vertical-align: unset;
 }
 
@@ -1121,7 +1131,7 @@ sup {
 	#main-content & {
 		position: relative;
 		font-size: 0.75em;
-		top: -.5em;
+		top: -0.5em;
 	}
 }
 
@@ -1151,7 +1161,11 @@ tt {
 		--MONO: 1;
 
 		font-family: var(--mono-font);
-		font-variation-settings: "wght" var(--mono-wght), "CASL" var(--CASL), "CRSV" var(--CRSV), "MONO" var(--MONO);
+		font-variation-settings:
+			"wght" var(--mono-wght),
+			"CASL" var(--CASL),
+			"CRSV" var(--CRSV),
+			"MONO" var(--MONO);
 	}
 
 	& i,
@@ -1296,14 +1310,14 @@ h6 {
 	/* Definition Lists */
 	& dl {
 		padding: 1.5ex 2ch;
-		border: .0625rem solid rgb(var(--dl-content-border-color));
+		border: 0.0625rem solid rgb(var(--dl-content-border-color));
 		background-color: rgb(var(--dl-content-bg-color));
 
 		& dt {
 			--wght: 700;
 			width: fit-content;
 			margin: 0;
-			padding: 0 .5em;
+			padding: 0 0.5em;
 			background-color: rgb(var(--dt-bg-color));
 			color: rgb(var(--dt-text-color));
 			font-weight: var(--wght);
@@ -1411,7 +1425,12 @@ a {
 		--MONO: 1;
 
 		font-family: var(--mono-font);
-		font-variation-settings: "wght" var(--mono-wght), "slnt" var(--slnt), "CASL" var(--CASL), "CRSV" var(--CRSV), "MONO" var(--MONO);
+		font-variation-settings:
+			"wght" var(--mono-wght),
+			"slnt" var(--slnt),
+			"CASL" var(--CASL),
+			"CRSV" var(--CRSV),
+			"MONO" var(--MONO);
 	}
 
 	& * {