wip
This commit is contained in:
		| @@ -61,6 +61,6 @@ svg | ||||
|  | ||||
| 		&.day | ||||
| 			&:hover | ||||
| 				fill rgba(0, 0, 0, 0.05) | ||||
| 				fill rgba(#000, 0.05) | ||||
|  | ||||
| </style> | ||||
|   | ||||
| @@ -136,7 +136,7 @@ export default Vue.extend({ | ||||
| root(isDark) | ||||
| 	color isDark ? #c5ced6 : #777 | ||||
| 	background isDark ? #282C37 : #fff | ||||
| 	border solid 1px rgba(0, 0, 0, 0.075) | ||||
| 	border solid 1px rgba(#000, 0.075) | ||||
| 	border-radius 6px | ||||
|  | ||||
| 	&[data-melt] | ||||
| @@ -152,7 +152,7 @@ root(isDark) | ||||
| 		font-size 0.9em | ||||
| 		font-weight bold | ||||
| 		color #888 | ||||
| 		box-shadow 0 1px rgba(0, 0, 0, 0.07) | ||||
| 		box-shadow 0 1px rgba(#000, 0.07) | ||||
|  | ||||
| 		> [data-fa] | ||||
| 			margin-right 4px | ||||
| @@ -214,10 +214,10 @@ root(isDark) | ||||
| 					border-radius 6px | ||||
|  | ||||
| 				&:hover > div | ||||
| 					background rgba(0, 0, 0, 0.025) | ||||
| 					background rgba(#000, 0.025) | ||||
|  | ||||
| 				&:active > div | ||||
| 					background rgba(0, 0, 0, 0.05) | ||||
| 					background rgba(#000, 0.05) | ||||
|  | ||||
| 				&[data-is-donichi] | ||||
| 					color #ef95a0 | ||||
| @@ -233,10 +233,10 @@ root(isDark) | ||||
| 					font-weight bold | ||||
|  | ||||
| 					> div | ||||
| 						background rgba(0, 0, 0, 0.025) | ||||
| 						background rgba(#000, 0.025) | ||||
|  | ||||
| 					&:active > div | ||||
| 						background rgba(0, 0, 0, 0.05) | ||||
| 						background rgba(#000, 0.05) | ||||
|  | ||||
| 				&[data-today] | ||||
| 					> div | ||||
|   | ||||
| @@ -106,7 +106,7 @@ root(isDark) | ||||
| 		width $width | ||||
| 		background isDark ? #282c37 :#fff | ||||
| 		border-radius 0 4px 4px 4px | ||||
| 		box-shadow 2px 2px 8px rgba(0, 0, 0, 0.2) | ||||
| 		box-shadow 2px 2px 8px rgba(#000, 0.2) | ||||
| 		transition visibility 0s linear 0.2s | ||||
|  | ||||
| .menu[data-darkmode] | ||||
|   | ||||
| @@ -68,7 +68,7 @@ root(isDark) | ||||
| 	font-size 0.8em | ||||
| 	background isDark ? #282c37 : #fff | ||||
| 	border-radius 0 4px 4px 4px | ||||
| 	box-shadow 2px 2px 8px rgba(0, 0, 0, 0.2) | ||||
| 	box-shadow 2px 2px 8px rgba(#000, 0.2) | ||||
| 	opacity 0 | ||||
|  | ||||
| .context-menu[data-darkmode] | ||||
|   | ||||
| @@ -102,7 +102,7 @@ export default Vue.extend({ | ||||
| 		left 0 | ||||
| 		width 100% | ||||
| 		height 100% | ||||
| 		background rgba(0, 0, 0, 0.7) | ||||
| 		background rgba(#000, 0.7) | ||||
| 		opacity 0 | ||||
| 		pointer-events none | ||||
|  | ||||
|   | ||||
| @@ -195,7 +195,7 @@ root(isDark) | ||||
| 		cursor pointer | ||||
|  | ||||
| 	&:hover | ||||
| 		background rgba(0, 0, 0, 0.05) | ||||
| 		background rgba(#000, 0.05) | ||||
|  | ||||
| 		> .label | ||||
| 			&:before | ||||
| @@ -203,7 +203,7 @@ root(isDark) | ||||
| 				background #0b65a5 | ||||
|  | ||||
| 	&:active | ||||
| 		background rgba(0, 0, 0, 0.1) | ||||
| 		background rgba(#000, 0.1) | ||||
|  | ||||
| 		> .label | ||||
| 			&:before | ||||
|   | ||||
| @@ -587,7 +587,7 @@ root(isDark) | ||||
| 		font-size 0.9em | ||||
| 		color isDark ? #d2d9dc : #555 | ||||
| 		background isDark ? #282c37 : #fff | ||||
| 		box-shadow 0 1px 0 rgba(0, 0, 0, 0.05) | ||||
| 		box-shadow 0 1px 0 rgba(#000, 0.05) | ||||
|  | ||||
| 		&, * | ||||
| 			user-select none | ||||
| @@ -733,7 +733,7 @@ root(isDark) | ||||
| 				display inline-block | ||||
| 				position absolute | ||||
| 				top 0 | ||||
| 				background-color rgba(0, 0, 0, 0.3) | ||||
| 				background-color rgba(#000, 0.3) | ||||
| 				border-radius 100% | ||||
|  | ||||
| 				animation sk-bounce 2.0s infinite ease-in-out | ||||
|   | ||||
| @@ -14,7 +14,7 @@ | ||||
| 		display inline-block | ||||
| 		width 18px | ||||
| 		height 18px | ||||
| 		background-color rgba(0, 0, 0, 0.3) | ||||
| 		background-color rgba(#000, 0.3) | ||||
| 		border-radius 100% | ||||
| 		animation bounce 1.4s infinite ease-in-out both | ||||
|  | ||||
|   | ||||
| @@ -251,7 +251,7 @@ root(isDark) | ||||
| 		height 48px | ||||
| 		color isDark ? #fff : #000 | ||||
| 		background isDark ? #313543 : #f7f7f7 | ||||
| 		box-shadow 0 1px 1px rgba(0, 0, 0, 0.075) | ||||
| 		box-shadow 0 1px 1px rgba(#000, 0.075) | ||||
|  | ||||
| 		> a | ||||
| 			display block | ||||
|   | ||||
| @@ -52,7 +52,7 @@ export default Vue.extend({ | ||||
| 		left 0 | ||||
| 		width 100% | ||||
| 		height 100% | ||||
| 		background rgba(0, 0, 0, 0.7) | ||||
| 		background rgba(#000, 0.7) | ||||
|  | ||||
| 	> img | ||||
| 		position fixed | ||||
|   | ||||
| @@ -54,7 +54,7 @@ export default Vue.extend({ | ||||
| 		left 0 | ||||
| 		width 100% | ||||
| 		height 100% | ||||
| 		background rgba(0, 0, 0, 0.7) | ||||
| 		background rgba(#000, 0.7) | ||||
|  | ||||
| 	> video | ||||
| 		position fixed | ||||
|   | ||||
| @@ -85,7 +85,7 @@ export default Vue.extend({ | ||||
|  | ||||
| .mk-mentions | ||||
| 	background #fff | ||||
| 	border solid 1px rgba(0, 0, 0, 0.075) | ||||
| 	border solid 1px rgba(#000, 0.075) | ||||
| 	border-radius 6px | ||||
|  | ||||
| 	> header | ||||
|   | ||||
| @@ -17,6 +17,7 @@ | ||||
| 		</header> | ||||
| 		<div class="body"> | ||||
| 			<div class="text"> | ||||
| 				<span v-if="note.isHidden" style="opacity: 0.5">(この投稿は非公開です)</span> | ||||
| 				<mk-note-html v-if="note.text" :text="note.text" :i="os.i"/> | ||||
| 			</div> | ||||
| 			<div class="media" v-if="note.mediaIds.length > 0"> | ||||
|   | ||||
| @@ -39,6 +39,7 @@ | ||||
| 		</header> | ||||
| 		<div class="body"> | ||||
| 			<div class="text"> | ||||
| 				<span v-if="p.isHidden" style="opacity: 0.5">(この投稿は非公開です)</span> | ||||
| 				<mk-note-html v-if="p.text" :text="p.text" :i="os.i"/> | ||||
| 			</div> | ||||
| 			<div class="media" v-if="p.media.length > 0"> | ||||
| @@ -222,7 +223,7 @@ root(isDark) | ||||
| 	overflow hidden | ||||
| 	text-align left | ||||
| 	background isDark ? #282C37 : #fff | ||||
| 	border solid 1px rgba(0, 0, 0, 0.1) | ||||
| 	border solid 1px rgba(#000, 0.1) | ||||
| 	border-radius 8px | ||||
|  | ||||
| 	> .read-more | ||||
|   | ||||
| @@ -607,7 +607,7 @@ root(isDark) | ||||
|  | ||||
| 	> .detail | ||||
| 		padding-top 4px | ||||
| 		background rgba(0, 0, 0, 0.0125) | ||||
| 		background rgba(#000, 0.0125) | ||||
|  | ||||
| .note[data-darkmode] | ||||
| 	root(true) | ||||
|   | ||||
| @@ -204,7 +204,7 @@ root(isDark) | ||||
| 				padding 16px | ||||
| 				overflow-wrap break-word | ||||
| 				font-size 0.9em | ||||
| 				border-bottom solid 1px isDark ? #1c2023 : rgba(0, 0, 0, 0.05) | ||||
| 				border-bottom solid 1px isDark ? #1c2023 : rgba(#000, 0.05) | ||||
|  | ||||
| 				&:last-child | ||||
| 					border-bottom none | ||||
| @@ -215,7 +215,7 @@ root(isDark) | ||||
| 					top 16px | ||||
| 					right 12px | ||||
| 					vertical-align top | ||||
| 					color isDark ? #606984 : rgba(0, 0, 0, 0.6) | ||||
| 					color isDark ? #606984 : rgba(#000, 0.6) | ||||
| 					font-size small | ||||
|  | ||||
| 				&:after | ||||
| @@ -250,10 +250,10 @@ root(isDark) | ||||
| 							margin-right 4px | ||||
|  | ||||
| 				.note-preview | ||||
| 					color isDark ? #c2cad4 : rgba(0, 0, 0, 0.7) | ||||
| 					color isDark ? #c2cad4 : rgba(#000, 0.7) | ||||
|  | ||||
| 				.note-ref | ||||
| 					color isDark ? #c2cad4 : rgba(0, 0, 0, 0.7) | ||||
| 					color isDark ? #c2cad4 : rgba(#000, 0.7) | ||||
|  | ||||
| 					[data-fa] | ||||
| 						font-size 1em | ||||
| @@ -282,7 +282,7 @@ root(isDark) | ||||
| 				font-size 0.8em | ||||
| 				color isDark ? #666b79 : #aaa | ||||
| 				background isDark ? #242731 : #fdfdfd | ||||
| 				border-bottom solid 1px isDark ? #1c2023 : rgba(0, 0, 0, 0.05) | ||||
| 				border-bottom solid 1px isDark ? #1c2023 : rgba(#000, 0.05) | ||||
|  | ||||
| 				span | ||||
| 					margin 0 16px | ||||
| @@ -295,13 +295,13 @@ root(isDark) | ||||
| 		width 100% | ||||
| 		padding 16px | ||||
| 		color #555 | ||||
| 		border-top solid 1px rgba(0, 0, 0, 0.05) | ||||
| 		border-top solid 1px rgba(#000, 0.05) | ||||
|  | ||||
| 		&:hover | ||||
| 			background rgba(0, 0, 0, 0.025) | ||||
| 			background rgba(#000, 0.025) | ||||
|  | ||||
| 		&:active | ||||
| 			background rgba(0, 0, 0, 0.05) | ||||
| 			background rgba(#000, 0.05) | ||||
|  | ||||
| 		&.fetching | ||||
| 			cursor wait | ||||
|   | ||||
| @@ -364,7 +364,6 @@ root(isDark) | ||||
| 		clear both | ||||
|  | ||||
| 	> .content | ||||
|  | ||||
| 		> input | ||||
| 		> textarea | ||||
| 			display block | ||||
| @@ -585,7 +584,7 @@ root(isDark) | ||||
| 			color rgba($theme-color, 0.6) | ||||
| 			background isDark ? transparent : linear-gradient(to bottom, lighten($theme-color, 80%) 0%, lighten($theme-color, 90%) 100%) | ||||
| 			border-color rgba($theme-color, 0.5) | ||||
| 			box-shadow 0 2px 4px rgba(0, 0, 0, 0.15) inset | ||||
| 			box-shadow 0 2px 4px rgba(#000, 0.15) inset | ||||
|  | ||||
| 		&:focus | ||||
| 			&:after | ||||
|   | ||||
| @@ -59,7 +59,7 @@ export default Vue.extend({ | ||||
|  | ||||
| root(isDark) | ||||
| 	background isDark ? #282C37 : #fff | ||||
| 	border solid 1px rgba(0, 0, 0, 0.075) | ||||
| 	border solid 1px rgba(#000, 0.075) | ||||
| 	border-radius 6px | ||||
|  | ||||
| 	> header | ||||
|   | ||||
| @@ -165,7 +165,7 @@ root(isDark) | ||||
| 		font-size 0.8em | ||||
| 		background $bgcolor | ||||
| 		border-radius 4px | ||||
| 		box-shadow 0 1px 4px rgba(0, 0, 0, 0.25) | ||||
| 		box-shadow 0 1px 4px rgba(#000, 0.25) | ||||
|  | ||||
| 		&:before | ||||
| 			content "" | ||||
| @@ -176,7 +176,7 @@ root(isDark) | ||||
| 			right 12px | ||||
| 			border-top solid 14px transparent | ||||
| 			border-right solid 14px transparent | ||||
| 			border-bottom solid 14px rgba(0, 0, 0, 0.1) | ||||
| 			border-bottom solid 14px rgba(#000, 0.1) | ||||
| 			border-left solid 14px transparent | ||||
|  | ||||
| 		&:after | ||||
|   | ||||
| @@ -125,7 +125,7 @@ root(isDark) | ||||
| 		width 300px | ||||
| 		background $bgcolor | ||||
| 		border-radius 4px | ||||
| 		box-shadow 0 1px 4px rgba(0, 0, 0, 0.25) | ||||
| 		box-shadow 0 1px 4px rgba(#000, 0.25) | ||||
|  | ||||
| 		&:before | ||||
| 			content "" | ||||
| @@ -136,7 +136,7 @@ root(isDark) | ||||
| 			right 74px | ||||
| 			border-top solid 14px transparent | ||||
| 			border-right solid 14px transparent | ||||
| 			border-bottom solid 14px rgba(0, 0, 0, 0.1) | ||||
| 			border-bottom solid 14px rgba(#000, 0.1) | ||||
| 			border-left solid 14px transparent | ||||
|  | ||||
| 		&:after | ||||
|   | ||||
| @@ -50,7 +50,7 @@ export default Vue.extend({ | ||||
| 		width 14em | ||||
| 		height 32px | ||||
| 		font-size 1em | ||||
| 		background rgba(0, 0, 0, 0.05) | ||||
| 		background rgba(#000, 0.05) | ||||
| 		outline none | ||||
| 		//border solid 1px #ddd | ||||
| 		border none | ||||
| @@ -62,7 +62,7 @@ export default Vue.extend({ | ||||
| 			color #9eaba8 | ||||
|  | ||||
| 		&:hover | ||||
| 			background rgba(0, 0, 0, 0.08) | ||||
| 			background rgba(#000, 0.08) | ||||
|  | ||||
| 		&:focus | ||||
| 			box-shadow 0 0 0 2px rgba($theme-color, 0.5) !important | ||||
|   | ||||
| @@ -103,7 +103,7 @@ root(isDark) | ||||
| 	top 0 | ||||
| 	z-index 1000 | ||||
| 	width 100% | ||||
| 	box-shadow 0 1px 1px rgba(0, 0, 0, 0.075) | ||||
| 	box-shadow 0 1px 1px rgba(#000, 0.075) | ||||
|  | ||||
| 	> .main | ||||
| 		height 48px | ||||
|   | ||||
| @@ -94,7 +94,7 @@ root(isDark) | ||||
| 	width 250px | ||||
| 	background isDark ? #282c37 : #fff | ||||
| 	background-clip content-box | ||||
| 	border solid 1px rgba(0, 0, 0, 0.1) | ||||
| 	border solid 1px rgba(#000, 0.1) | ||||
| 	border-radius 4px | ||||
| 	overflow hidden | ||||
| 	opacity 0 | ||||
|   | ||||
| @@ -119,7 +119,7 @@ export default Vue.extend({ | ||||
| 		overflow auto | ||||
|  | ||||
| 		> * | ||||
| 			border-bottom solid 1px rgba(0, 0, 0, 0.05) | ||||
| 			border-bottom solid 1px rgba(#000, 0.05) | ||||
|  | ||||
| 			> * | ||||
| 				max-width 600px | ||||
|   | ||||
| @@ -36,7 +36,7 @@ export default Vue.extend({ | ||||
| <style lang="stylus" scoped> | ||||
| root(isDark) | ||||
| 	background isDark ? #282C37 : #fff | ||||
| 	border solid 1px rgba(0, 0, 0, 0.075) | ||||
| 	border solid 1px rgba(#000, 0.075) | ||||
| 	border-radius 6px | ||||
| 	overflow hidden | ||||
|  | ||||
| @@ -55,7 +55,7 @@ root(isDark) | ||||
| 			font-size 0.9em | ||||
| 			font-weight bold | ||||
| 			color isDark ? #e3e5e8 : #888 | ||||
| 			box-shadow 0 1px rgba(0, 0, 0, 0.07) | ||||
| 			box-shadow 0 1px rgba(#000, 0.07) | ||||
|  | ||||
| 			> [data-fa] | ||||
| 				margin-right 6px | ||||
|   | ||||
| @@ -17,14 +17,16 @@ | ||||
| 				<slot></slot> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 		<div class="handle top" v-if="canResize" @mousedown.prevent="onTopHandleMousedown"></div> | ||||
| 		<div class="handle right" v-if="canResize" @mousedown.prevent="onRightHandleMousedown"></div> | ||||
| 		<div class="handle bottom" v-if="canResize" @mousedown.prevent="onBottomHandleMousedown"></div> | ||||
| 		<div class="handle left" v-if="canResize" @mousedown.prevent="onLeftHandleMousedown"></div> | ||||
| 		<div class="handle top-left" v-if="canResize" @mousedown.prevent="onTopLeftHandleMousedown"></div> | ||||
| 		<div class="handle top-right" v-if="canResize" @mousedown.prevent="onTopRightHandleMousedown"></div> | ||||
| 		<div class="handle bottom-right" v-if="canResize" @mousedown.prevent="onBottomRightHandleMousedown"></div> | ||||
| 		<div class="handle bottom-left" v-if="canResize" @mousedown.prevent="onBottomLeftHandleMousedown"></div> | ||||
| 		<template v-if="canResize"> | ||||
| 			<div class="handle top" @mousedown.prevent="onTopHandleMousedown"></div> | ||||
| 			<div class="handle right" @mousedown.prevent="onRightHandleMousedown"></div> | ||||
| 			<div class="handle bottom" @mousedown.prevent="onBottomHandleMousedown"></div> | ||||
| 			<div class="handle left" @mousedown.prevent="onLeftHandleMousedown"></div> | ||||
| 			<div class="handle top-left" @mousedown.prevent="onTopLeftHandleMousedown"></div> | ||||
| 			<div class="handle top-right" @mousedown.prevent="onTopRightHandleMousedown"></div> | ||||
| 			<div class="handle bottom-right" @mousedown.prevent="onBottomRightHandleMousedown"></div> | ||||
| 			<div class="handle bottom-left" @mousedown.prevent="onBottomLeftHandleMousedown"></div> | ||||
| 		</template> | ||||
| 	</div> | ||||
| </div> | ||||
| </template> | ||||
| @@ -85,7 +87,7 @@ export default Vue.extend({ | ||||
|  | ||||
| 	computed: { | ||||
| 		isFlexible(): boolean { | ||||
| 			return this.height == null; | ||||
| 			return this.height == 'auto'; | ||||
| 		}, | ||||
| 		canResize(): boolean { | ||||
| 			return !this.isFlexible; | ||||
| @@ -476,7 +478,7 @@ root(isDark) | ||||
| 		left 0 | ||||
| 		width 100% | ||||
| 		height 100% | ||||
| 		background rgba(0, 0, 0, 0.7) | ||||
| 		background rgba(#000, 0.7) | ||||
| 		opacity 0 | ||||
| 		pointer-events none | ||||
|  | ||||
| @@ -493,7 +495,7 @@ root(isDark) | ||||
| 		&:focus | ||||
| 			&:not([data-is-modal]) | ||||
| 				> .body | ||||
| 					box-shadow 0 0 0px 1px rgba($theme-color, 0.5), 0 2px 6px 0 rgba(0, 0, 0, 0.2) | ||||
| 					box-shadow 0 0 0px 1px rgba($theme-color, 0.5), 0 2px 6px 0 rgba(#000, 0.2) | ||||
|  | ||||
| 		> .handle | ||||
| 			$size = 8px | ||||
| @@ -561,7 +563,7 @@ root(isDark) | ||||
| 			overflow hidden | ||||
| 			background isDark ? #282C37 : #fff | ||||
| 			border-radius 6px | ||||
| 			box-shadow 0 2px 6px 0 rgba(0, 0, 0, 0.2) | ||||
| 			box-shadow 0 2px 6px 0 rgba(#000, 0.2) | ||||
|  | ||||
| 			> header | ||||
| 				$header-height = 40px | ||||
|   | ||||
		Reference in New Issue
	
	Block a user
	 syuilo
					syuilo