diff --git a/src/renderer/components/TimelineSpace/Contents/SideBar/AccountProfile.vue b/src/renderer/components/TimelineSpace/Contents/SideBar/AccountProfile.vue index 32e94a31..3d36e150 100644 --- a/src/renderer/components/TimelineSpace/Contents/SideBar/AccountProfile.vue +++ b/src/renderer/components/TimelineSpace/Contents/SideBar/AccountProfile.vue @@ -10,8 +10,8 @@
- {{ $t('side_bar.account_profile.follows_you') }} - {{ $t('side_bar.account_profile.doesnt_follow_you') }} + {{ $t('side_bar.account_profile.follows_you') }} + {{ $t('side_bar.account_profile.doesnt_follow_you') }}
@@ -254,9 +254,9 @@ export default { .follower-status { .status { - border-radius: 4px; + color: #fff; background-color: rgba(0, 0, 0, 0.3); - padding: 4px 8px; + font-size: 1rem; } } } diff --git a/src/renderer/components/molecules/Notification/Favourite.vue b/src/renderer/components/molecules/Notification/Favourite.vue index 21e965eb..fb8b533b 100644 --- a/src/renderer/components/molecules/Notification/Favourite.vue +++ b/src/renderer/components/molecules/Notification/Favourite.vue @@ -42,10 +42,10 @@
- + {{ $t('cards.toot.show_more') }} - + {{ $t('cards.toot.hide')}}
@@ -61,6 +61,8 @@
+ GIF + VIDEO
@@ -248,6 +250,14 @@ export default { .favourite { padding: 8px 0 0 16px; + .fa-icon { + font-size: 0.9em; + width: auto; + height: 1em; + max-width: 100%; + max-height: 100%; + } + .action { margin-right: 8px; @@ -341,8 +351,19 @@ export default { } } + .spoiler { + margin: 8px 0; + + .spoil-button { + background-color: var(--theme-selected-background-color); + border-color: var(--theme-border-color); + padding: 2px 4px; + } + } + .attachments { position: relative; + margin: 4px 0 8px; .show-sensitive { padding: 20px 32px; @@ -364,12 +385,26 @@ export default { .media { float: left; margin-right: 8px; + width: 200px; + height: 200px; img { + cursor: zoom-in; + object-fit: cover; max-width: 200px; max-height: 200px; + width: 100%; + height: 100%; border-radius: 8px; } + + .media-label { + position: absolute; + bottom: 6px; + left: 4px; + color: #fff; + background: rgba(0, 0, 0, 0.5); + } } } } diff --git a/src/renderer/components/molecules/Notification/Reblog.vue b/src/renderer/components/molecules/Notification/Reblog.vue index 8be4593e..ff73cec3 100644 --- a/src/renderer/components/molecules/Notification/Reblog.vue +++ b/src/renderer/components/molecules/Notification/Reblog.vue @@ -42,10 +42,10 @@
- + {{ $t('cards.toot.show_more') }} - + {{ $t('cards.toot.hide')}}
@@ -61,6 +61,8 @@
+ GIF + VIDEO
@@ -246,6 +248,14 @@ export default { .reblog { padding: 8px 0 0 16px; + .fa-icon { + font-size: 0.9em; + width: auto; + height: 1em; + max-width: 100%; + max-height: 100%; + } + .action { margin-right: 8px; @@ -338,8 +348,19 @@ export default { } } + .spoiler { + margin: 8px 0; + + .spoil-button { + background-color: var(--theme-selected-background-color); + border-color: var(--theme-border-color); + padding: 2px 4px; + } + } + .attachments { position: relative; + margin: 4px 0 8px; .show-sensitive { padding: 20px 32px; @@ -361,12 +382,26 @@ export default { .media { float: left; margin-right: 8px; + width: 200px; + height: 200px; img { + cursor: zoom-in; + object-fit: cover; max-width: 200px; max-height: 200px; + width: 100%; + height: 100%; border-radius: 8px; } + + .media-label { + position: absolute; + bottom: 6px; + left: 4px; + color: #fff; + background: rgba(0, 0, 0, 0.5); + } } } } diff --git a/src/renderer/components/molecules/Toot.vue b/src/renderer/components/molecules/Toot.vue index 1b0fc0e1..0e77a04f 100644 --- a/src/renderer/components/molecules/Toot.vue +++ b/src/renderer/components/molecules/Toot.vue @@ -34,10 +34,10 @@
- + {{ $t('cards.toot.show_more') }} - + {{ $t('cards.toot.hide')}}
@@ -53,8 +53,8 @@
- GIF - VIDEO + GIF + VIDEO
@@ -482,6 +482,14 @@ export default { .toot { padding: 8px 0 0 16px; + .fa-icon { + font-size: 0.9em; + width: auto; + height: 1em; + max-width: 100%; + max-height: 100%; + } + .icon { float: left; @@ -547,8 +555,19 @@ export default { } } + .spoiler { + margin: 8px 0; + + .spoil-button { + background-color: var(--theme-selected-background-color); + border-color: var(--theme-border-color); + padding: 2px 4px; + } + } + .attachments { position: relative; + margin: 4px 0 8px; .show-sensitive { padding: 20px 32px; @@ -570,22 +589,25 @@ export default { .media { float: left; margin-right: 8px; + width: 200px; + height: 200px; img { cursor: zoom-in; + object-fit: cover; max-width: 200px; max-height: 200px; + width: 100%; + height: 100%; border-radius: 8px; } .media-label { position: absolute; - bottom: 8px; - left: 8px; + bottom: 6px; + left: 4px; color: #fff; - background: rgba(0, 0, 0, 0.5); - font-size: 0.8rem; - border-radius: 2px; + background-color: rgba(0, 0, 0, 0.3); } } } @@ -616,6 +638,10 @@ export default { .tool-box { float: left; + .fa-icon { + vertical-align: bottom; + } + button { margin: 0 8px; padding: 0;