~cytrogen/masto-fe

45848d654709678ba35d9e97e0b3df3e3916cd75 — Claire 3 years ago ec0c104
Fix styling regressions from RTL layout refactor (#24415)

M app/javascript/styles/mastodon/accounts.scss => app/javascript/styles/mastodon/accounts.scss +2 -2
@@ 138,7 138,7 @@
  }

  .older {
    float: inline-start;
    float: left;
    padding-inline-start: 0;

    .fa {


@@ 148,7 148,7 @@
  }

  .newer {
    float: inline-end;
    float: right;
    padding-inline-end: 0;

    .fa {

M app/javascript/styles/mastodon/admin.scss => app/javascript/styles/mastodon/admin.scss +3 -3
@@ 635,7 635,7 @@ body,
    .button {
      overflow: visible;
      margin: 0 0 5px 5px;
      float: inline-end;
      float: right;
    }
  }
}


@@ 783,7 783,7 @@ a.name-tag,

.speech-bubble {
  margin-bottom: 20px;
  border-inset-inline-start: 4px solid $ui-highlight-color;
  border-inline-start: 4px solid $ui-highlight-color;

  &.positive {
    border-left-color: $success-green;


@@ 1662,7 1662,7 @@ a.sparkline {
}

.section-skip-link {
  float: inline-end;
  float: right;

  a {
    color: $ui-highlight-color;

M app/javascript/styles/mastodon/components.scss => app/javascript/styles/mastodon/components.scss +12 -12
@@ 826,7 826,7 @@ body > [data-popper-placement] {
}

.reply-indicator__cancel {
  float: inline-end;
  float: right;
  line-height: 24px;
}



@@ 841,7 841,7 @@ body > [data-popper-placement] {
}

.reply-indicator__display-avatar {
  float: inline-start;
  float: left;
  margin-inline-end: 5px;
}



@@ 1159,7 1159,7 @@ body > [data-popper-placement] {

.notification__relative_time {
  color: $dark-text-color;
  float: inline-end;
  float: right;
  font-size: 14px;
  padding-bottom: 1px;
}


@@ 1507,7 1507,7 @@ body > [data-popper-placement] {
    position: relative;

    & > div {
      float: inline-start;
      float: left;
      position: relative;
      box-sizing: border-box;
    }


@@ 1622,7 1622,7 @@ a .account__avatar {
  text-decoration: none;
  overflow: hidden;
  flex: 0 1 100%;
  border-inset-inline-end: 1px solid lighten($ui-base-color, 8%);
  border-inline-end: 1px solid lighten($ui-base-color, 8%);
  padding: 10px 0;
  border-bottom: 4px solid transparent;



@@ 1662,7 1662,7 @@ a .account__avatar {
}

.account-authorize__avatar {
  float: inline-start;
  float: left;
  margin-inline-end: 10px;
}



@@ 2642,7 2642,7 @@ $ui-header-height: 55px;
    .navigation-panel {
      margin: 0;
      background: $ui-base-color;
      border-inset-inline-start: 1px solid lighten($ui-base-color, 8%);
      border-inline-start: 1px solid lighten($ui-base-color, 8%);
      height: 100vh;
    }



@@ 3879,7 3879,7 @@ a.status-card.compact:hover {
}

.column-header__setting-arrows {
  float: inline-end;
  float: right;

  .column-header__setting-btn {
    padding: 5px;


@@ 5753,7 5753,7 @@ a.status-card.compact:hover {

.report-modal__comment {
  padding: 20px;
  border-inset-inline-end: 1px solid $ui-secondary-color;
  border-inline-end: 1px solid $ui-secondary-color;
  max-width: 320px;

  p {


@@ 6044,7 6044,7 @@ a.status-card.compact:hover {
    color: $dark-text-color;
    padding: 8px 18px;
    cursor: default;
    border-inset-inline-end: 1px solid lighten($ui-base-color, 8%);
    border-inline-end: 1px solid lighten($ui-base-color, 8%);
    display: flex;
    flex-direction: column;
    align-items: center;


@@ 6109,7 6109,7 @@ a.status-card.compact:hover {
  border: 0;
  box-sizing: border-box;
  display: block;
  float: inline-start;
  float: left;
  position: relative;
  border-radius: 4px;
  overflow: hidden;


@@ 7930,7 7930,7 @@ noscript {
      inset-inline-start: 0;
      width: 100%;
      height: 100%;
      border-inset-inline-start: 4px solid $highlight-text-color;
      border-inline-start: 4px solid $highlight-text-color;
      pointer-events: none;
    }
  }

M app/javascript/styles/mastodon/rich_text.scss => app/javascript/styles/mastodon/rich_text.scss +1 -1
@@ 14,7 14,7 @@

  blockquote {
    padding-inline-start: 10px;
    border-inset-inline-start: 3px solid $darker-text-color;
    border-inline-start: 3px solid $darker-text-color;
    color: $darker-text-color;
    white-space: normal;


M app/javascript/styles/mastodon/rtl.scss => app/javascript/styles/mastodon/rtl.scss +12 -0
@@ 19,10 19,22 @@ body.rtl {
    direction: rtl;
  }

  .account__avatar-wrapper {
    float: right;
  }

  .column-header__setting-arrows {
    float: left;
  }

  .admin-wrapper {
    direction: rtl;
  }

  .react-swipeable-view-container > * {
    direction: rtl;
  }

  .simple_form .label_input__append {
    &::after {
      background-image: linear-gradient(

M app/javascript/styles/mastodon/tables.scss => app/javascript/styles/mastodon/tables.scss +2 -2
@@ 91,12 91,12 @@

      &:first-child {
        border-radius: 4px 0 0;
        border-inset-inline-start: 1px solid darken($ui-base-color, 8%);
        border-inline-start: 1px solid darken($ui-base-color, 8%);
      }

      &:last-child {
        border-radius: 0 4px 0 0;
        border-inset-inline-end: 1px solid darken($ui-base-color, 8%);
        border-inline-end: 1px solid darken($ui-base-color, 8%);
      }
    }
  }