mirrors/signal-desktop
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages 2 Wiki Activity Actions

Update username onboarding tooltip styles

Browse source
This commit is contained in:
trevor-signal 2024-02-12 11:22:38 -05:00 • committed by GitHub
parent cf9a376df8
commit d1e38d2796
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 109 additions and 31 deletions
Download patch file Download diff file Expand all files Collapse all files

43
stylesheets/components/ProfileEditor.scss
View file

@ -205,13 +205,50 @@
&__username-link {
&__tooltip {
padding: 12px;
padding: 0;
background-color: unset;
--container-padding: 12px;
&__container {
display: flex;
flex-direction: row;
padding: var(--container-padding);
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.12);
border: 1px solid $color-gray-20;
border-radius: inherit;
background-color: $color-gray-02;
transform-origin: 0 0; // needed for react-spring scale animation
@include dark-theme {
background-color: $color-gray-75;
border-color: $color-gray-60;
}
}
--direction-multiplier: 1;
&:dir(rtl) {
--direction-multiplier: -1;
}
&__arrow {
position: absolute;
// stylelint-disable-next-line declaration-property-value-disallowed-list
transform: translateY(calc(-50% - var(--container-padding)))
translateX(
calc(
var(--direction-multiplier) * (20px - var(--container-padding))
)
)
rotate(45deg);
width: 14px;
height: 14px;
clip-path: polygon(0 100%, 0 0, 100% 0);
border: inherit;
background: inherit;
}
&__icon {
width: 20px;
height: 20px;
@ -241,6 +278,7 @@
}
p {
@include font-subtitle;
max-width: 240px;
margin: 0;
}
@ -256,6 +294,9 @@
margin: 0;
@include color-svg('../images/icons/v3/x/x.svg', $color-gray-45);
@include dark-theme {
@include color-svg('../images/icons/v3/x/x.svg', $color-gray-25);
}
}
}
}