1
0
mirror of https://github.com/nileane/TangerineUI-for-Mastodon synced 2024-11-27 14:28:14 +09:00

Refined the appearance of thread lines

This commit is contained in:
Niléane 2023-12-08 04:19:18 +01:00
parent 8a258268cb
commit 483e3b2643
No known key found for this signature in database
3 changed files with 30 additions and 3 deletions

View File

@ -1267,6 +1267,9 @@ body.app-body {
.app-body .status__avatar {
margin-bottom: -10px;
z-index: 2;
border-radius: 50%;
box-shadow: 0 0 0 7px var(--color-content-bg);
transition: box-shadow .3s;
}
.app-body .reply-indicator__content,
.app-body .status__content {
@ -1378,7 +1381,7 @@ body.app-body {
}
/* Threaded line, actually */
.app-body .status__line {
margin-inline-start: 5px;
margin-inline-start: 6px;
border-inline-start: 2px solid var(--color-accent);
-webkit-border-start: 2px solid var(--color-accent);
opacity: .6;
@ -1413,6 +1416,12 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
.app-body .notification__message:has(+ div > .status__wrapper .status__content:hover) {
background: var(--color-content-bg-focus);
}
.app-body .status__wrapper:has(.status__content:hover) .status__avatar {
box-shadow: 0 0 0 7px var(--color-content-bg-focus);
}
}
.app-body :is(.status__wrapper.focusable, .detailed-status__wrapper.focusable):focus .status__avatar {
box-shadow: 0 0 0 7px var(--color-content-bg-focus);
}
/* 👁️ Post detailed view */

View File

@ -1266,6 +1266,9 @@ body.app-body {
.app-body .status__avatar {
margin-bottom: -10px;
z-index: 2;
border-radius: 50%;
box-shadow: 0 0 0 7px var(--color-content-bg);
transition: box-shadow .3s;
}
.app-body .reply-indicator__content,
.app-body .status__content {
@ -1377,7 +1380,7 @@ body.app-body {
}
/* Threaded line, actually */
.app-body .status__line {
margin-inline-start: 5px;
margin-inline-start: 6px;
border-inline-start: 2px solid var(--color-accent);
-webkit-border-start: 2px solid var(--color-accent);
opacity: .6;
@ -1412,6 +1415,12 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
.app-body .notification__message:has(+ div > .status__wrapper .status__content:hover) {
background: var(--color-content-bg-focus);
}
.app-body .status__wrapper:has(.status__content:hover) .status__avatar {
box-shadow: 0 0 0 7px var(--color-content-bg-focus);
}
}
.app-body :is(.status__wrapper.focusable, .detailed-status__wrapper.focusable):focus .status__avatar {
box-shadow: 0 0 0 7px var(--color-content-bg-focus);
}
/* 👁️ Post detailed view */

View File

@ -1266,6 +1266,9 @@ body.app-body {
.app-body .status__avatar {
margin-bottom: -10px;
z-index: 2;
border-radius: 50%;
box-shadow: 0 0 0 7px var(--color-content-bg);
transition: box-shadow .3s;
}
.app-body .reply-indicator__content,
.app-body .status__content {
@ -1377,7 +1380,7 @@ body.app-body {
}
/* Threaded line, actually */
.app-body .status__line {
margin-inline-start: 5px;
margin-inline-start: 6px;
border-inline-start: 2px solid var(--color-accent);
-webkit-border-start: 2px solid var(--color-accent);
opacity: .6;
@ -1412,6 +1415,12 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
.app-body .notification__message:has(+ div > .status__wrapper .status__content:hover) {
background: var(--color-content-bg-focus);
}
.app-body .status__wrapper:has(.status__content:hover) .status__avatar {
box-shadow: 0 0 0 7px var(--color-content-bg-focus);
}
}
.app-body :is(.status__wrapper.focusable, .detailed-status__wrapper.focusable):focus .status__avatar {
box-shadow: 0 0 0 7px var(--color-content-bg-focus);
}
/* 👁️ Post detailed view */