Skip to content

Commit

Permalink
update DMs screen with updated channel layout
Browse files Browse the repository at this point in the history
  • Loading branch information
@accrazed
accrazed committed Aug 15, 2024
1 parent 025637e commit 9082957
Show file tree
Hide file tree
Showing 2 changed files with 277 additions and 84 deletions.
173 changes: 129 additions & 44 deletions NieR-Import.theme.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2513,71 +2513,155 @@ strong {
background: transparent;
}

.theme-dark .channel_c91bad {
.container_d91ad9,
.layout_ec8679 {
border-radius: 0;
}

.container_d91ad9 {
padding: 0;
}

.interactive_f5eb4b {
padding: 0;
margin-left: 0px;
}
.interactive_f5eb4b .overflow_a82120,
.interactive_f5eb4b .name_ec8679,
.interactive_f5eb4b .subText_ec8679 {
-webkit-transition: color 0.2s;
transition: color 0.2s;
}
.interactive_f5eb4b.muted_f5eb4b {
opacity: 50%;
}
.interactive_f5eb4b .wrapper_c51b4e {
border-radius: 0;
margin: 2px 0 2px 0;
}
.interactive_f5eb4b .wrapper_c51b4e foreignObject {
-webkit-mask: none;
mask: none;
}
.interactive_f5eb4b .closeButton_c91bad {
position: absolute;
z-index: 3;
right: 0;
color: var(--color-alert);
}
.interactive_f5eb4b .linkButtonIcon_c91bad,
.interactive_f5eb4b .content_ec8679,
.interactive_f5eb4b .subtext_c91bad {
position: relative;
}
.theme-dark .channel_c91bad .layout_ec8679 {
background-color: transparent !important;
.interactive_f5eb4b .link_c91bad {
margin: 4px 0px;
padding: 0;
}
.theme-dark .channel_c91bad .layout_ec8679::before {
content: "";
.interactive_f5eb4b .channel_c91bad,
.interactive_f5eb4b .interactive_f5eb4b,
.interactive_f5eb4b .layout_ec8679 {
height: 36px;
}
.interactive_f5eb4b .link_c91bad {
height: 36px;
padding: 0px 0px;
background-color: var(--color-high-mid);
}
.interactive_f5eb4b .link_c91bad::before {
position: absolute;
left: 0;
top: 2px;
bottom: 2px;
content: "";
width: 100%;
height: 36px;
-webkit-animation: pulsingBackground 2.5s infinite;
animation: pulsingBackground 2.5s infinite;
z-index: 0;
-webkit-box-shadow: 0 0 3px var(--color-low);
box-shadow: 0 0 3px var(--color-low);
-webkit-transition: -webkit-transform 0.4s;
transition: -webkit-transform 0.4s;
transition: transform 0.4s;
transition: transform 0.4s, -webkit-transform 0.4s;
-webkit-animation-name: pulsingBackground;
animation-name: pulsingBackground;
-webkit-animation-duration: 1.5s;
animation-duration: 1.5s;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transform-origin: left;
transform-origin: left;
width: 100%;
-webkit-box-shadow: 0 0 2px var(--color-low);
box-shadow: 0 0 2px var(--color-low);
}
.theme-dark .channel_c91bad:hover .interactive_f5eb4b,
.theme-dark .channel_c91bad .interactiveSelected_c91bad {
.interactive_f5eb4b .link_c91bad::after {
position: absolute;
content: "";
width: 100%;
height: 40px;
pointer-events: none;
-webkit-box-shadow: 0 1px var(--color-low), 0 -1px var(--color-low);
box-shadow: 0 1px var(--color-low), 0 -1px var(--color-low);
color: var(--color-high);
-webkit-transition: -webkit-transform 0.4s;
transition: -webkit-transform 0.4s;
transition: transform 0.4s;
transition: transform 0.4s, -webkit-transform 0.4s;
-webkit-transform: scale(0, 85%);
transform: scale(0, 85%);
-webkit-transform-origin: left;
transform-origin: left;
}
.theme-dark .channel_c91bad:hover .interactive_f5eb4b .layout_ec8679:before,
.theme-dark .channel_c91bad .interactiveSelected_c91bad .layout_ec8679:before {
-webkit-transform: scaleX(1);
transform: scaleX(1);
.interactive_f5eb4b.selected_f5eb4b .link_c91bad::before,
.interactive_f5eb4b.selected_f5eb4b .link_c91bad::after, .interactive_f5eb4b:hover .link_c91bad::before,
.interactive_f5eb4b:hover .link_c91bad::after {
-webkit-transform: scale(100%, 100%);
transform: scale(100%, 100%);
}
.theme-dark .channel_c91bad:hover .interactive_f5eb4b .subtext_c91bad,
.theme-dark .channel_c91bad:hover .interactive_f5eb4b .activityText_c91bad,
.theme-dark .channel_c91bad:hover .interactive_f5eb4b .icon_ad923e,
.theme-dark .channel_c91bad:hover .interactive_f5eb4b .overflow_a82120,
.theme-dark .channel_c91bad:hover .interactive_f5eb4b .highlighted_ec8679,
.theme-dark .channel_c91bad .interactiveSelected_c91bad .subtext_c91bad,
.theme-dark .channel_c91bad .interactiveSelected_c91bad .activityText_c91bad,
.theme-dark .channel_c91bad .interactiveSelected_c91bad .icon_ad923e,
.theme-dark .channel_c91bad .interactiveSelected_c91bad .overflow_a82120,
.theme-dark .channel_c91bad .interactiveSelected_c91bad .highlighted_ec8679 {
.interactive_f5eb4b.selected_f5eb4b .overflow_a82120,
.interactive_f5eb4b.selected_f5eb4b .linkButtonIcon_c91bad,
.interactive_f5eb4b.selected_f5eb4b .name_ec8679,
.interactive_f5eb4b.selected_f5eb4b .subText_ec8679, .interactive_f5eb4b:hover .overflow_a82120,
.interactive_f5eb4b:hover .linkButtonIcon_c91bad,
.interactive_f5eb4b:hover .name_ec8679,
.interactive_f5eb4b:hover .subText_ec8679 {
color: var(--color-high);
z-index: 1;
}
.theme-dark .channel_c91bad:hover .interactive_f5eb4b .avatar_ec8679,
.theme-dark .channel_c91bad:hover .interactive_f5eb4b .closeButton_c91bad,
.theme-dark .channel_c91bad:hover .interactive_f5eb4b .content_ec8679,
.theme-dark .channel_c91bad .interactiveSelected_c91bad .avatar_ec8679,
.theme-dark .channel_c91bad .interactiveSelected_c91bad .closeButton_c91bad,
.theme-dark .channel_c91bad .interactiveSelected_c91bad .content_ec8679 {
z-index: 1;
.interactive_f5eb4b.selected_f5eb4b .iconContainer_d8bfb3 .icon_d8bfb3, .interactive_f5eb4b:hover .iconContainer_d8bfb3 .icon_d8bfb3 {
background-color: var(--color-high);
color: var(--color-high);
}
.interactive_f5eb4b.selected_f5eb4b .actionIcon_f6f816 path, .interactive_f5eb4b:hover .actionIcon_f6f816 path {
-webkit-transition: opacity 0.5s;
transition: opacity 0.5s;
opacity: 1;
fill: var(--color-high);
}
.interactive_f5eb4b.selected_f5eb4b.modeLocked_d8bfb3 .icon_d8bfb3, .interactive_f5eb4b.selected_f5eb4b.typeVoice_d8bfb3 .icon_d8bfb3, .interactive_f5eb4b:hover.modeLocked_d8bfb3 .icon_d8bfb3, .interactive_f5eb4b:hover.typeVoice_d8bfb3 .icon_d8bfb3 {
color: var(--color-low);
}
.interactive_f5eb4b.selected_f5eb4b .link_c91bad::before {
-webkit-transform: scale(100%, 100%);
transform: scale(100%, 100%);
-webkit-transition: opacity 0.4s, -webkit-transform 0.4s;
transition: opacity 0.4s, -webkit-transform 0.4s;
transition: transform 0.4s, opacity 0.4s;
transition: transform 0.4s, opacity 0.4s, -webkit-transform 0.4s;
-webkit-animation: none;
animation: none;
background-color: var(--color-low);
opacity: 0.65;
height: 36px;
}
.interactive_f5eb4b.selected_f5eb4b .link_c91bad::after {
-webkit-transition: -webkit-transform 0.75s;
transition: -webkit-transform 0.75s;
transition: transform 0.75s;
transition: transform 0.75s, -webkit-transform 0.75s;
-webkit-transform: scale(0%, 100%);
transform: scale(0%, 100%);
-webkit-transform-origin: right;
transform-origin: right;
}
.interactive_f5eb4b .unread_d8bfb3.unreadImportant_d8bfb3 ~ div .icon_d8bfb3 {
color: var(--color-alert);
background-color: var(--color-alert);
}
.interactive_f5eb4b .unread_d8bfb3.unreadImportant_d8bfb3 ~ div .overflow_a82120,
.interactive_f5eb4b .unread_d8bfb3.unreadImportant_d8bfb3 ~ div .name_ec8679,
.interactive_f5eb4b .unread_d8bfb3.unreadImportant_d8bfb3 ~ div .subText_ec8679 {
color: var(--color-alert);
}

.theme-dark .scroller_c47fa9,
Expand Down Expand Up @@ -3010,7 +3094,8 @@ strong {

.background_a26d7b {
fill: var(--color-low);
clip-path: circle(37% at center);
-webkit-clip-path: circle(37% at center);
clip-path: circle(37% at center);
}

.svg_a26d7b {
Expand Down
Loading

0 comments on commit 9082957

Please sign in to comment.