Update to v4.1.0rc3
This commit is contained in:
commit
822569fedc
907 changed files with 51658 additions and 18972 deletions
|
|
@ -12,6 +12,14 @@ html {
|
|||
&.button-alternative-2 {
|
||||
color: $white;
|
||||
}
|
||||
|
||||
&.button-tertiary {
|
||||
color: $highlight-text-color;
|
||||
}
|
||||
}
|
||||
|
||||
.simple_form .button.button-tertiary {
|
||||
color: $highlight-text-color;
|
||||
}
|
||||
|
||||
.status-card__actions button,
|
||||
|
|
@ -285,22 +293,8 @@ html {
|
|||
.dropdown-menu {
|
||||
background: $white;
|
||||
|
||||
&__arrow {
|
||||
&.left {
|
||||
border-left-color: $white;
|
||||
}
|
||||
|
||||
&.top {
|
||||
border-top-color: $white;
|
||||
}
|
||||
|
||||
&.bottom {
|
||||
border-bottom-color: $white;
|
||||
}
|
||||
|
||||
&.right {
|
||||
border-right-color: $white;
|
||||
}
|
||||
&__arrow::before {
|
||||
background-color: $white;
|
||||
}
|
||||
|
||||
&__item {
|
||||
|
|
@ -557,25 +551,6 @@ html {
|
|||
}
|
||||
}
|
||||
|
||||
.directory__tag.active > a,
|
||||
.directory__tag.active > div {
|
||||
border-color: $ui-highlight-color;
|
||||
|
||||
&,
|
||||
h4,
|
||||
h4 small,
|
||||
.fa,
|
||||
.trends__item__current {
|
||||
color: $white;
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:active,
|
||||
&:focus {
|
||||
background: $ui-highlight-color;
|
||||
}
|
||||
}
|
||||
|
||||
.batch-table {
|
||||
&__toolbar,
|
||||
&__row,
|
||||
|
|
|
|||
|
|
@ -254,10 +254,8 @@ $content-width: 840px;
|
|||
|
||||
&__actions {
|
||||
display: inline-flex;
|
||||
|
||||
& > :not(:first-child) {
|
||||
margin-left: 5px;
|
||||
}
|
||||
flex-flow: wrap;
|
||||
gap: 5px;
|
||||
}
|
||||
|
||||
h2 small {
|
||||
|
|
@ -1202,7 +1200,7 @@ a.name-tag,
|
|||
|
||||
path:first-child {
|
||||
fill: rgba($highlight-text-color, 0.25) !important;
|
||||
fill-opacity: 100% !important;
|
||||
fill-opacity: 1 !important;
|
||||
}
|
||||
|
||||
path:last-child {
|
||||
|
|
@ -1574,6 +1572,15 @@ a.sparkline {
|
|||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
color: $highlight-text-color;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__actions {
|
||||
|
|
@ -1665,6 +1672,15 @@ a.sparkline {
|
|||
box-sizing: border-box;
|
||||
min-height: 100%;
|
||||
|
||||
a {
|
||||
color: $highlight-text-color;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
p {
|
||||
margin-bottom: 20px;
|
||||
unicode-bidi: plaintext;
|
||||
|
|
|
|||
|
|
@ -166,6 +166,30 @@
|
|||
&:disabled {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
&.button--confirmation {
|
||||
color: $valid-value-color;
|
||||
border-color: $valid-value-color;
|
||||
|
||||
&:active,
|
||||
&:focus,
|
||||
&:hover {
|
||||
background: $valid-value-color;
|
||||
color: $primary-text-color;
|
||||
}
|
||||
}
|
||||
|
||||
&.button--destructive {
|
||||
color: $error-value-color;
|
||||
border-color: $error-value-color;
|
||||
|
||||
&:active,
|
||||
&:focus,
|
||||
&:hover {
|
||||
background: $error-value-color;
|
||||
color: $primary-text-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.button--block {
|
||||
|
|
@ -339,8 +363,8 @@
|
|||
}
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
position: absolute;
|
||||
body > [data-popper-placement] {
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.invisible {
|
||||
|
|
@ -399,7 +423,7 @@
|
|||
|
||||
&.active {
|
||||
border-color: $highlight-text-color;
|
||||
background: $highlight-text-color;
|
||||
background: $highlight-text-color url("data:image/svg+xml;utf8,<svg width='18' height='18' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M4.5 8.5L8 12l6-6' stroke='white' stroke-width='1.5'/></svg>") center center no-repeat;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1908,6 +1932,42 @@ a.account__display-name {
|
|||
text-decoration: none;
|
||||
}
|
||||
|
||||
.dropdown-animation {
|
||||
animation: dropdown 300ms cubic-bezier(0.1, 0.7, 0.1, 1);
|
||||
|
||||
@keyframes dropdown {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: scaleX(0.85) scaleY(0.75);
|
||||
}
|
||||
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: scaleX(1) scaleY(1);
|
||||
}
|
||||
}
|
||||
|
||||
&.top {
|
||||
transform-origin: bottom;
|
||||
}
|
||||
|
||||
&.right {
|
||||
transform-origin: left;
|
||||
}
|
||||
|
||||
&.bottom {
|
||||
transform-origin: top;
|
||||
}
|
||||
|
||||
&.left {
|
||||
transform-origin: right;
|
||||
}
|
||||
|
||||
.reduce-motion & {
|
||||
animation: none;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown {
|
||||
display: inline-block;
|
||||
}
|
||||
|
|
@ -1992,36 +2052,42 @@ a.account__display-name {
|
|||
|
||||
.dropdown-menu__arrow {
|
||||
position: absolute;
|
||||
width: 0;
|
||||
height: 0;
|
||||
border: 0 solid transparent;
|
||||
|
||||
&.left {
|
||||
right: -5px;
|
||||
margin-top: -5px;
|
||||
border-width: 5px 0 5px 5px;
|
||||
border-left-color: $ui-secondary-color;
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
width: 14px;
|
||||
height: 5px;
|
||||
background-color: $ui-secondary-color;
|
||||
mask-image: url("data:image/svg+xml;utf8,<svg width='14' height='5' xmlns='http://www.w3.org/2000/svg'><path d='M7 0L0 5h14L7 0z' fill='white'/></svg>");
|
||||
}
|
||||
|
||||
&.top {
|
||||
bottom: -5px;
|
||||
margin-left: -7px;
|
||||
border-width: 5px 7px 0;
|
||||
border-top-color: $ui-secondary-color;
|
||||
|
||||
&::before {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
}
|
||||
|
||||
&.right {
|
||||
left: -9px;
|
||||
|
||||
&::before {
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
}
|
||||
|
||||
&.bottom {
|
||||
top: -5px;
|
||||
margin-left: -7px;
|
||||
border-width: 0 7px 5px;
|
||||
border-bottom-color: $ui-secondary-color;
|
||||
}
|
||||
|
||||
&.right {
|
||||
left: -5px;
|
||||
margin-top: -5px;
|
||||
border-width: 5px 5px 5px 0;
|
||||
border-right-color: $ui-secondary-color;
|
||||
&.left {
|
||||
right: -9px;
|
||||
|
||||
&::before {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -2217,6 +2283,7 @@ $ui-header-height: 55px;
|
|||
z-index: 2;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
overflow: hidden;
|
||||
|
||||
&__logo {
|
||||
display: inline-flex;
|
||||
|
|
@ -2233,10 +2300,15 @@ $ui-header-height: 55px;
|
|||
align-items: center;
|
||||
gap: 10px;
|
||||
padding: 0 10px;
|
||||
overflow: hidden;
|
||||
|
||||
.button {
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
|
||||
.button-tertiary {
|
||||
flex-shrink: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -2468,8 +2540,7 @@ $ui-header-height: 55px;
|
|||
height: calc(100% - 10px) !important;
|
||||
}
|
||||
|
||||
.getting-started__wrapper,
|
||||
.search {
|
||||
.getting-started__wrapper {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
|
|
@ -2522,7 +2593,7 @@ $ui-header-height: 55px;
|
|||
}
|
||||
}
|
||||
|
||||
.ui__header {
|
||||
.layout-single-column .ui__header {
|
||||
display: flex;
|
||||
background: $ui-base-color;
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
|
|
@ -3139,12 +3210,16 @@ $ui-header-height: 55px;
|
|||
margin-top: 10px;
|
||||
|
||||
h4 {
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
padding: 10px;
|
||||
font-size: 12px;
|
||||
text-transform: uppercase;
|
||||
color: $darker-text-color;
|
||||
padding: 10px;
|
||||
font-weight: 500;
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
|
||||
a {
|
||||
color: $darker-text-color;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-height: 810px) {
|
||||
|
|
@ -4235,7 +4310,7 @@ a.status-card.compact:hover {
|
|||
}
|
||||
|
||||
@keyframes heartbeat {
|
||||
from {
|
||||
0% {
|
||||
transform: scale(1);
|
||||
animation-timing-function: ease-out;
|
||||
}
|
||||
|
|
@ -4305,7 +4380,7 @@ a.status-card.compact:hover {
|
|||
|
||||
.emoji-picker-dropdown__menu {
|
||||
background: $simple-background-color;
|
||||
position: absolute;
|
||||
position: relative;
|
||||
box-shadow: 4px 4px 6px rgba($base-shadow-color, 0.4);
|
||||
border-radius: 4px;
|
||||
margin-top: 5px;
|
||||
|
|
@ -4366,14 +4441,14 @@ a.status-card.compact:hover {
|
|||
align-items: center;
|
||||
background: rgba($base-overlay-background, 0.8);
|
||||
display: flex;
|
||||
height: 100%;
|
||||
height: 100vh;
|
||||
justify-content: center;
|
||||
left: 0;
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
visibility: hidden;
|
||||
width: 100%;
|
||||
width: 100vw;
|
||||
z-index: 2000;
|
||||
|
||||
* {
|
||||
|
|
@ -4491,7 +4566,6 @@ a.status-card.compact:hover {
|
|||
}
|
||||
|
||||
.privacy-dropdown__dropdown {
|
||||
position: absolute;
|
||||
background: $simple-background-color;
|
||||
box-shadow: 2px 4px 15px rgba($base-shadow-color, 0.4);
|
||||
border-radius: 4px;
|
||||
|
|
@ -4597,7 +4671,6 @@ a.status-card.compact:hover {
|
|||
|
||||
.language-dropdown {
|
||||
&__dropdown {
|
||||
position: absolute;
|
||||
background: $simple-background-color;
|
||||
box-shadow: 2px 4px 15px rgba($base-shadow-color, 0.4);
|
||||
border-radius: 4px;
|
||||
|
|
@ -4661,6 +4734,7 @@ a.status-card.compact:hover {
|
|||
}
|
||||
|
||||
.search {
|
||||
margin-bottom: 10px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
|
|
@ -4843,7 +4917,6 @@ a.status-card.compact:hover {
|
|||
.modal-root__modal {
|
||||
pointer-events: auto;
|
||||
display: flex;
|
||||
z-index: 9999;
|
||||
}
|
||||
|
||||
.video-modal__container {
|
||||
|
|
@ -6712,7 +6785,8 @@ noscript {
|
|||
}
|
||||
}
|
||||
|
||||
.moved-account-banner {
|
||||
.moved-account-banner,
|
||||
.follow-request-banner {
|
||||
padding: 20px;
|
||||
background: lighten($ui-base-color, 4%);
|
||||
display: flex;
|
||||
|
|
@ -6735,6 +6809,7 @@ noscript {
|
|||
justify-content: space-between;
|
||||
align-items: center;
|
||||
gap: 15px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.detailed-status__display-name {
|
||||
|
|
@ -6742,6 +6817,10 @@ noscript {
|
|||
}
|
||||
}
|
||||
|
||||
.follow-request-banner .button {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.column-inline-form {
|
||||
padding: 15px;
|
||||
display: flex;
|
||||
|
|
@ -7011,7 +7090,6 @@ noscript {
|
|||
display: block;
|
||||
flex: 0 0 auto;
|
||||
width: 94px;
|
||||
/*margin-left: -2px;*/
|
||||
|
||||
.account__avatar {
|
||||
background: darken($ui-base-color, 8%);
|
||||
|
|
@ -7028,6 +7106,7 @@ noscript {
|
|||
padding-top: 10px;
|
||||
gap: 8px;
|
||||
overflow: hidden;
|
||||
margin-left: -2px; // aligns the pfp with content below
|
||||
|
||||
&__buttons {
|
||||
display: flex;
|
||||
|
|
@ -7082,6 +7161,10 @@ noscript {
|
|||
font-weight: 400;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
span {
|
||||
user-select: all;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -7134,10 +7217,12 @@ noscript {
|
|||
|
||||
.verified {
|
||||
border: 1px solid rgba($valid-value-color, 0.5);
|
||||
margin-top: -1px;
|
||||
|
||||
&:first-child {
|
||||
border-top-left-radius: 4px;
|
||||
border-top-right-radius: 4px;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
|
|
@ -7297,7 +7382,7 @@ noscript {
|
|||
|
||||
path:first-child {
|
||||
fill: rgba($highlight-text-color, 0.25) !important;
|
||||
fill-opacity: 100% !important;
|
||||
fill-opacity: 1 !important;
|
||||
}
|
||||
|
||||
path:last-child {
|
||||
|
|
@ -7650,7 +7735,7 @@ noscript {
|
|||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-left: 2px solid $highlight-text-color;
|
||||
border-left: 4px solid $highlight-text-color;
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
|
|
@ -7969,7 +8054,8 @@ noscript {
|
|||
width: 600px;
|
||||
background: $ui-base-color;
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
position: relative;
|
||||
display: block;
|
||||
padding: 20px;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
.modal-layout {
|
||||
background: $ui-base-color url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 234.80078 31.757813" width="234.80078" height="31.757812"><path d="M19.599609 0c-1.05 0-2.10039.375-2.90039 1.125L0 16.925781v14.832031h234.80078V17.025391l-16.5-15.900391c-1.6-1.5-4.20078-1.5-5.80078 0l-13.80078 13.099609c-1.6 1.5-4.19883 1.5-5.79883 0L179.09961 1.125c-1.6-1.5-4.19883-1.5-5.79883 0L159.5 14.224609c-1.6 1.5-4.20078 1.5-5.80078 0L139.90039 1.125c-1.6-1.5-4.20078-1.5-5.80078 0l-13.79883 13.099609c-1.6 1.5-4.20078 1.5-5.80078 0L100.69922 1.125c-1.600001-1.5-4.198829-1.5-5.798829 0l-13.59961 13.099609c-1.6 1.5-4.200781 1.5-5.800781 0L61.699219 1.125c-1.6-1.5-4.198828-1.5-5.798828 0L42.099609 14.224609c-1.6 1.5-4.198828 1.5-5.798828 0L22.5 1.125C21.7.375 20.649609 0 19.599609 0z" fill="#{hex-color($ui-base-lighter-color)}"/></svg>') repeat-x bottom fixed;
|
||||
background: $ui-base-color url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 234.80078 31.757813" width="234.80078" height="31.757812"><path d="M19.599609 0c-1.05 0-2.10039.375-2.90039 1.125L0 16.925781v14.832031h234.80078V17.025391l-16.5-15.900391c-1.6-1.5-4.20078-1.5-5.80078 0l-13.80078 13.099609c-1.6 1.5-4.19883 1.5-5.79883 0L179.09961 1.125c-1.6-1.5-4.19883-1.5-5.79883 0L159.5 14.224609c-1.6 1.5-4.20078 1.5-5.80078 0L139.90039 1.125c-1.6-1.5-4.20078-1.5-5.80078 0l-13.79883 13.099609c-1.6 1.5-4.20078 1.5-5.80078 0L100.69922 1.125c-1.600001-1.5-4.198829-1.5-5.798829 0l-13.59961 13.099609c-1.6 1.5-4.200781 1.5-5.800781 0L61.699219 1.125c-1.6-1.5-4.198828-1.5-5.798828 0L42.099609 14.224609c-1.6 1.5-4.198828 1.5-5.798828 0L22.5 1.125C21.7.375 20.649609 0 19.599609 0z" fill="#{hex-color($ui-base-lighter-color)}33"/></svg>') repeat-x bottom fixed;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100vh;
|
||||
|
|
|
|||
|
|
@ -109,7 +109,7 @@
|
|||
box-sizing: border-box;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin-right: 10px;
|
||||
margin-inline-end: 10px;
|
||||
top: -1px;
|
||||
border-radius: 50%;
|
||||
vertical-align: middle;
|
||||
|
|
@ -204,7 +204,7 @@
|
|||
.button {
|
||||
height: 36px;
|
||||
padding: 0 16px;
|
||||
margin-right: 10px;
|
||||
margin-inline-end: 10px;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
|
@ -240,7 +240,7 @@
|
|||
line-height: inherit;
|
||||
color: $action-button-color;
|
||||
border-color: $action-button-color;
|
||||
margin-right: 5px;
|
||||
margin-inline-end: 5px;
|
||||
}
|
||||
|
||||
li {
|
||||
|
|
@ -250,7 +250,7 @@
|
|||
.poll__option {
|
||||
flex: 0 0 auto;
|
||||
width: calc(100% - (23px + 6px));
|
||||
margin-right: 6px;
|
||||
margin-inline-end: 6px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -279,10 +279,10 @@
|
|||
color: $dark-text-color;
|
||||
|
||||
&__chart {
|
||||
background: rgba(darken($ui-primary-color, 14%), 0.2);
|
||||
background: rgba(darken($ui-primary-color, 14%), 0.7);
|
||||
|
||||
&.leading {
|
||||
background: rgba($ui-highlight-color, 0.2);
|
||||
background: rgba($ui-highlight-color, 0.5);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -132,43 +132,6 @@ body.rtl {
|
|||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.status__avatar {
|
||||
left: auto;
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
.status,
|
||||
.activity-stream .status.light {
|
||||
padding-left: 10px;
|
||||
padding-right: 68px;
|
||||
}
|
||||
|
||||
.status__info .status__display-name,
|
||||
.activity-stream .status.light .status__display-name {
|
||||
padding-left: 25px;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.activity-stream .pre-header {
|
||||
padding-right: 68px;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.status__prepend {
|
||||
margin-left: 0;
|
||||
margin-right: 68px;
|
||||
}
|
||||
|
||||
.status__prepend-icon-wrapper {
|
||||
left: auto;
|
||||
right: -26px;
|
||||
}
|
||||
|
||||
.activity-stream .pre-header .pre-header__icon {
|
||||
left: auto;
|
||||
right: 42px;
|
||||
}
|
||||
|
||||
.account__header__tabs__buttons > .icon-button {
|
||||
margin-right: 0;
|
||||
margin-left: 8px;
|
||||
|
|
@ -184,12 +147,6 @@ body.rtl {
|
|||
left: 0;
|
||||
}
|
||||
|
||||
.status__relative-time,
|
||||
.status__visibility-icon,
|
||||
.activity-stream .status.light .status__header .status__meta {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.status__action-bar {
|
||||
&__counter {
|
||||
margin-right: 0;
|
||||
|
|
@ -202,16 +159,6 @@ body.rtl {
|
|||
}
|
||||
}
|
||||
|
||||
.status__action-bar-button {
|
||||
float: right;
|
||||
margin-right: 0;
|
||||
margin-left: 18px;
|
||||
}
|
||||
|
||||
.status__action-bar-dropdown {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.privacy-dropdown__dropdown {
|
||||
margin-left: 0;
|
||||
margin-right: 40px;
|
||||
|
|
@ -230,7 +177,6 @@ body.rtl {
|
|||
.detailed-status__display-avatar {
|
||||
margin-right: 0;
|
||||
margin-left: 10px;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.picture-in-picture__header__account .account__avatar {
|
||||
|
|
|
|||
|
|
@ -39,6 +39,8 @@
|
|||
width: 20px;
|
||||
height: 20px;
|
||||
margin: -3px 0 0;
|
||||
margin-left: 0.075em;
|
||||
margin-right: 0.075em;
|
||||
}
|
||||
|
||||
p {
|
||||
|
|
|
|||
Reference in a new issue