最新版でのバグ修正

影の修正
UI密度の変更
その他たくさんの修正など

app/javascript/styles/dark-gplus-theme-for-mastodon-dev/_variables.scss

@@ -46,6 +46,7 @@ $account-foreground-color: $base-darker1-color;
 $card-color: $base-lighter1-color;
 $card-hover-color: $column-header-hover-color;
 $card-image-color: $base-color;
+$warning-card-color: #26a69a;
 
 $form-color: rgba(0, 0, 0, 0.1);
 $form-focused-color: lighten($form-color, 20%);

app/javascript/styles/dark-gplus-theme-for-mastodon-dev/accounts.scss

@@ -74,7 +74,10 @@
 						}
 
 						&__buttons {
-							.icon-button { border: 0 }
+							.icon-button { 
+								border: 0;
+								border-radius: 50%;
+							}
 						}
 
 						&__name {

app/javascript/styles/dark-gplus-theme-for-mastodon-dev/columns.scss

@@ -9,7 +9,6 @@
 	margin: 0;
 	background: $column-header-color;
 	position: relative;
-	z-index: 2;
 
 	.tabs-bar {
 		&__link {
@@ -81,8 +80,11 @@
 			}
 		}
 
+		&__warning {
+			background-color: $warning-card-color;
+		}
+
 		&__publish { border-top: 1px solid $base-separation-color }
-		&__publish-button-wrapper { @include button-shadow }
 		&__modifiers { background-color: $base-lighter1-color }
 	}
 
@@ -100,7 +102,6 @@
 	.column-header {
 		@include column-shadow;
 		background: $column-header-color;
-		z-index: 1;
 
 		&.active {
 			.column-header__icon {
@@ -151,6 +152,9 @@
 	}
 
 	.column-back-button {
+		background-color: $column-header-color;
+		color: $secondary-text-color;
+
 		&__icon {
 			@include material-icon-large;
 			vertical-align: bottom;
@@ -228,11 +232,10 @@
 	}
 }
 
-// v2.9.0以降
+// v2.9.0以降に対応
 .column-header {
 	@include column-shadow;
 	background: $column-header-color;
-	z-index: 1;
 
 	&.active {
 		.column-header__icon {
@@ -281,6 +284,16 @@
 		&-inner { background: $column-header-color }
 	}
 }
+.column-back-button {
+	background-color: $column-header-color;
+	color: $secondary-text-color;
+
+	&__icon {
+		@include material-icon-large;
+		vertical-align: bottom;
+		margin-right: 8px;
+	}
+}
 
 .getting-started {
 	&__wrapper,

app/javascript/styles/dark-gplus-theme-for-mastodon-dev/components-button.scss

@@ -29,14 +29,32 @@
 		color: $primary-lighter1-text-color;
 		border-radius: 50%;
 	}
+
+	.button--block { @include button-shadow }
+
+	.button-secondary {
+		background-color: $primary-lighter1-text-color;
+		border: 0px;
+	}
 }
 
 .modal-root {
 	&__modal {
 		.media-modal {
 			&__close.icon-button {
-				font-size: 40px !important;
+				font-size: 40px;
+				width: 40px;
+				height: 40px;
+
+				&:hover {
+					background-color: darken($base-lighter1-color, 40%);
+				}
 			}
 		}
 	}
 }
+
+// DOM操作によりpaddingが調整できないもの
+.privacy-dropdown__value-icon.icon-button.inverted,
+.compose-form__poll-button-icon.icon-button.inverted,
+.compose-form__upload-button-icon.icon-button.inverted { padding: 4px }

app/javascript/styles/dark-gplus-theme-for-mastodon-dev/components-dropdown.scss

@@ -6,6 +6,13 @@
 
 .dropdown-menu {
 	background-color: $column-header-color;
+
+		&__arrow {
+			&.top { border-top-color: $column-header-color }
+			&.bottom { border-bottom-color: $column-header-color }
+		}
+
+		&__separator { margin: 4px 0 }
 }
 
 .dropdown-menu,
@@ -16,11 +23,6 @@
 		background: $base-lighter1-color;
 
 		.dropdown-menu {
-			&__arrow {
-				&.top { border-top-color: $column-header-color }
-				&.bottom { border-bottom-color: $column-header-color }
-			}
-
 			&__item {
 				a {
 					color: $primary-lighter2-text-color;

app/javascript/styles/dark-gplus-theme-for-mastodon-dev/icons.scss

@@ -25,9 +25,12 @@
 .icon-button {
 	color: $icon-color;
 	border-radius: 50%;
+	width: 28px !important; // UIの密度が下がる代わりに、ホバー時に正常に表示
+	height: 28px !important; // !importantを付けないと動作しない…?
 
 	&:active,
-	&:focus,
+	&:focus { background-color: transparent }
+
 	&:hover {
 		color: lighten($icon-color, 7%);
 		background-color: $column-header-hover-color;
@@ -43,9 +46,9 @@
 		.fa.fa-star { vertical-align: top }
 	}
 
-	&.inverted {
+	&.inverted { color: $icon-color }
-		color: $icon-color;
+
-	}
+	&.overlayed { border-radius: 50% }
 
 	&.disabled {
 		color: lighten($icon-color, 13%);
@@ -175,7 +178,7 @@
 	&.fa-bars::before { content: "menu" } //ハンバーガーボタン
 	&.fa-navicon::before { content: "menu" } //ハンバーガーボタン
 	&.fa-reorder::before { content: "menu" } //ハンバーガーボタン
-	&.fa-desktop::before { content: "desktop-windows" } //外観設定のアイコン
+	&.fa-desktop::before { content: "desktop_windows" } //外観設定のアイコン
 	&.fa-code::before { content: "code" } //開発アイコン
 	&.fa-list::before { content: "list" } //リストアイコン
 	&.fa-paperclip::before { content: "attach_file" } //メディアを追加のアイコン
@@ -186,8 +189,17 @@
 .fa {
 	&.fa-chevron-left,
 	&.fa-chevron-right,
-	&.fa.fa-times {
+	&.fa-plus {
 		@include material-icon-large;
 		vertical-align: bottom;
 	}
+
+	&.fa-times {
+		@include material-icon-large;
+		vertical-align: top;
+		&.fa-fw {
+			font-size: 24px;
+			vertical-align: 8px;
+		}
+	}
 }

app/javascript/styles/dark-gplus-theme-for-mastodon-dev/settings.scss

@@ -149,6 +149,7 @@ body.admin {
 
 	button {
 		@include button-shadow;
+		background-color: $active-button-color;
 	}
 }
 

app/javascript/styles/dark-gplus-theme-for-mastodon-dev/statuses.scss

@@ -23,6 +23,8 @@
 
 			&__content { color: $primary-text-color }
 		}
+
+		.display-name strong { color: $primary-text-color }
 	}
 
 	&.status-direct {

app/javascript/styles/gplus-theme-for-mastodon-dev/_variables.scss

@@ -46,6 +46,7 @@ $account-foreground-color: $base-darker1-color;
 $card-color: $base-lighter1-color;
 $card-hover-color: $column-header-hover-color;
 $card-image-color: $base-color;
+$warning-card-color: #26a69a;
 
 $form-color: rgba(0, 0, 0, 0.1);
 $form-focused-color: lighten($form-color, 20%);

app/javascript/styles/gplus-theme-for-mastodon-dev/accounts.scss

@@ -74,7 +74,10 @@
 						}
 
 						&__buttons {
-							.icon-button { border: 0 }
+							.icon-button { 
+								border: 0;
+								border-radius: 50%;
+							}
 						}
 
 						&__name {

app/javascript/styles/gplus-theme-for-mastodon-dev/columns.scss

@@ -9,7 +9,6 @@
 	margin: 0;
 	background: $column-header-color;
 	position: relative;
-	z-index: 2;
 
 	.tabs-bar {
 		&__link {
@@ -81,8 +80,11 @@
 			}
 		}
 
+		&__warning {
+			background-color: $warning-card-color;
+		}
+
 		&__publish { border-top: 1px solid $base-separation-color }
-		&__publish-button-wrapper { @include button-shadow }
 		&__modifiers { background-color: $base-lighter1-color }
 	}
 
@@ -100,7 +102,6 @@
 	.column-header {
 		@include column-shadow;
 		background: $column-header-color;
-		z-index: 1;
 
 		&.active {
 			.column-header__icon {
@@ -151,6 +152,9 @@
 	}
 
 	.column-back-button {
+		background-color: $column-header-color;
+		color: $secondary-text-color;
+
 		&__icon {
 			@include material-icon-large;
 			vertical-align: bottom;
@@ -228,11 +232,10 @@
 	}
 }
 
-// v2.9.0以降
+// v2.9.0以降に対応
 .column-header {
 	@include column-shadow;
 	background: $column-header-color;
-	z-index: 1;
 
 	&.active {
 		.column-header__icon {
@@ -281,6 +284,16 @@
 		&-inner { background: $column-header-color }
 	}
 }
+.column-back-button {
+	background-color: $column-header-color;
+	color: $secondary-text-color;
+
+	&__icon {
+		@include material-icon-large;
+		vertical-align: bottom;
+		margin-right: 8px;
+	}
+}
 
 .getting-started {
 	&__wrapper,

app/javascript/styles/gplus-theme-for-mastodon-dev/components-button.scss

@@ -29,14 +29,32 @@
 		color: $primary-lighter1-text-color;
 		border-radius: 50%;
 	}
+
+	.button--block { @include button-shadow }
+
+	.button-secondary {
+		background-color: $primary-lighter1-text-color;
+		border: 0px;
+	}
 }
 
 .modal-root {
 	&__modal {
 		.media-modal {
 			&__close.icon-button {
-				font-size: 40px !important;
+				font-size: 40px;
+				width: 40px;
+				height: 40px;
+
+				&:hover {
+					background-color: darken($base-lighter1-color, 40%);
+				}
 			}
 		}
 	}
 }
+
+// DOM操作によりpaddingが調整できないもの
+.privacy-dropdown__value-icon.icon-button.inverted,
+.compose-form__poll-button-icon.icon-button.inverted,
+.compose-form__upload-button-icon.icon-button.inverted { padding: 4px }

app/javascript/styles/gplus-theme-for-mastodon-dev/components-dropdown.scss

@@ -6,6 +6,13 @@
 
 .dropdown-menu {
 	background-color: $column-header-color;
+
+		&__arrow {
+			&.top { border-top-color: $column-header-color }
+			&.bottom { border-bottom-color: $column-header-color }
+		}
+
+		&__separator { margin: 4px 0 }
 }
 
 .dropdown-menu,
@@ -16,11 +23,6 @@
 		background: $base-lighter1-color;
 
 		.dropdown-menu {
-			&__arrow {
-				&.top { border-top-color: $column-header-color }
-				&.bottom { border-bottom-color: $column-header-color }
-			}
-
 			&__item {
 				a {
 					color: $primary-lighter2-text-color;

app/javascript/styles/gplus-theme-for-mastodon-dev/icons.scss

@@ -25,9 +25,12 @@
 .icon-button {
 	color: $icon-color;
 	border-radius: 50%;
+	width: 28px !important; // UIの密度が下がる代わりに、ホバー時に正常に表示
+	height: 28px !important; // !importantを付けないと動作しない…?
 
 	&:active,
-	&:focus,
+	&:focus { background-color: transparent }
+
 	&:hover {
 		color: lighten($icon-color, 7%);
 		background-color: $column-header-hover-color;
@@ -43,9 +46,9 @@
 		.fa.fa-star { vertical-align: top }
 	}
 
-	&.inverted {
+	&.inverted { color: $icon-color }
-		color: $icon-color;
+
-	}
+	&.overlayed { border-radius: 50% }
 
 	&.disabled {
 		color: lighten($icon-color, 13%);
@@ -175,7 +178,7 @@
 	&.fa-bars::before { content: "menu" } //ハンバーガーボタン
 	&.fa-navicon::before { content: "menu" } //ハンバーガーボタン
 	&.fa-reorder::before { content: "menu" } //ハンバーガーボタン
-	&.fa-desktop::before { content: "desktop-windows" } //外観設定のアイコン
+	&.fa-desktop::before { content: "desktop_windows" } //外観設定のアイコン
 	&.fa-code::before { content: "code" } //開発アイコン
 	&.fa-list::before { content: "list" } //リストアイコン
 	&.fa-paperclip::before { content: "attach_file" } //メディアを追加のアイコン
@@ -186,8 +189,17 @@
 .fa {
 	&.fa-chevron-left,
 	&.fa-chevron-right,
-	&.fa.fa-times {
+	&.fa-plus {
 		@include material-icon-large;
 		vertical-align: bottom;
 	}
+
+	&.fa-times {
+		@include material-icon-large;
+		vertical-align: top;
+		&.fa-fw {
+			font-size: 24px;
+			vertical-align: 8px;
+		}
+	}
 }

app/javascript/styles/gplus-theme-for-mastodon-dev/settings.scss

@@ -149,6 +149,7 @@ body.admin {
 
 	button {
 		@include button-shadow;
+		background-color: $active-button-color;
 	}
 }
 

app/javascript/styles/gplus-theme-for-mastodon-dev/statuses.scss

@@ -23,6 +23,8 @@
 
 			&__content { color: $primary-text-color }
 		}
+
+		.display-name strong { color: $primary-text-color }
 	}
 
 	&.status-direct {