iframe-proxy | Sunbelt Computer Software

290 lines (255 loc) · 6.08 KB
@import "variables";
@import (less) "../node_modules/react-select/dist/react-select.css";
.github-CommitView {
  padding: @component-padding;
  flex: 0 0 auto;
  &-editor {
    position: relative;
    border: 1px solid @input-border-color;
    border-radius: @component-border-radius;
    padding: @component-padding / 2;
    font-size: @font-size;
    background-color: @syntax-background-color;
    .github-CommitView-hardwrap {
      position: absolute;
      right: 20px;
      bottom: 0;
      padding: (@component-padding / 5) (@component-padding / 2);
      line-height: 1;
      border: none;
      background-color: @syntax-background-color;
      cursor: default;
      opacity: .3;
      &:hover {
        opacity: 1;
      &:active {
        opacity: .5;
  &-editor.hidden {
    display: none;
  &-editor atom-text-editor {
    height: 100px;
    .cursor-line.cursor-line.cursor-line {
      background-color: transparent;
  &-coAuthorToggle {
    position: absolute;
    left: 0;
    bottom: 0;
    padding: @component-padding / 2;
    line-height: 1;
    border: none;
    background-color: @syntax-background-color;
    cursor: default;
    opacity: .3;
    // in expanded editor view, make this button sit on top of
    // the editor toggle button so the co author toggle is still clickable.
    z-index: 1;
    &:hover {
      opacity: 1;
      cursor: pointer;
    &:active {
      opacity: .5;
    &.focused {
      opacity: 1;
    &Icon {
      width: 12px;
      height: 7px;
      fill: @text-color;
      &.focused {
        fill: @button-background-color-selected;
  &-buttonWrapper {
    align-items: center;
    display: flex;
    margin: 0 -@component-padding @component-padding -@component-padding;
    padding: @component-padding;
    padding-top: 0;
    border-bottom: 1px solid @base-border-color;
  &-coAuthorEditor {
    position: relative;
    margin-top: @component-padding / 2;
    padding: (@component-padding / 4) (@component-padding / 2);
    border: 1px solid @base-border-color;
    color: @syntax-text-color;
    border-radius: @component-border-radius;
    background-color: @syntax-background-color;
    cursor: text;
    &&, &.is-open, &.is-focused, &.is-searchable, &.is-searchable.is-open, &.is-searchable.is-focused:not(.is-open) {
      & > .Select-control {
        background-color: inherit;
        border: none;
        border-radius: 0;
        color: inherit;
        cursor: inherit;
        height: @component-line-height;
        box-shadow: none;
    .Select-placeholder {
      line-height: @component-line-height;
      padding: 0;
      color: @text-color-subtle;
    .Select-input {
      line-height: @component-line-height;
      padding: 0;
      margin: 0;
      height: auto;
      & > input {
        padding: 0;
        line-height: inherit;
    // Token
    .Select-value {
      margin: 0;
      margin-right: .5em;
      vertical-align: middle;
      line-height: 1.1;
      color: mix(@text-color-highlight, @text-color-info, 70%);
      border-color: fade(@background-color-info, 15%);
      background-color: fade(@background-color-info, 10%);
      &-icon {
        border-color: inherit;
    // Popup
    .Select-menu-outer {
      top: auto;
      left: -1px;
      right: -1px;
      width: auto;
      bottom: calc(100% ~'+' 2px);
      border-radius: @component-border-radius;
      border: 1px solid @overlay-border-color;
      background-color: @overlay-background-color;
      box-shadow: 0 2px 4px hsla(0,0%,0%,.15);
      overflow: hidden;
    .Select-option {
      display: inline-block;
      margin: 0;
      border-radius: 0;
      border: 0;
      background-color: transparent;
      width: 100%;
      padding: @component-padding / 2;
      padding-right: 10px; // space for scrollbar
      border-top: 1px solid @overlay-border-color;
      white-space: nowrap;
      &:first-child {
        border-top: none;
      &.is-focused {
        color: white;
        background-color: @background-color-info;
        .github-CommitView-coAuthorEditor-selectListItem > span {
          color: inherit;
    &-selectListItem {
      text-overflow: ellipsis;
      white-space: nowrap;
      overflow: hidden;
      &> span:first-child {
        font-weight: 600;
        color: @text-color-highlight;
      &> span {
        color: @text-color-subtle;
        margin-right: .75em;
      &> span:last-child {
        margin-right: 0;
    .new-author {
      font-style: italic;
  &-expandButton {
    position: absolute;
    right: 0;
    bottom: 0;
    padding: @component-padding / 2;
    line-height: 1;
    border: none;
    background-color: @syntax-background-color;
    cursor: default;
    opacity: .3;
    &:hover {
      opacity: 1;
    &:active {
      opacity: .5;
    &:before {
      margin: 0;
    display: flex;
    align-items: center;
    margin-top: @component-padding;
  &-label {
    margin-right: @component-padding;
  &-button {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: default;
    &.is-secondary {
      flex: 0 1 auto;
      margin-right: @component-padding;
  &-remaining-characters {
    width: 1.25em;
    text-align: right;
    margin-left: @component-padding;
    color: @text-color-subtle;
    &.is-warning { color: @text-color-warning; }
    &.is-error   { color: @text-color-error; }
  // States ---------------------------------------------------
  &-editor.is-expanded {
    background-color: transparent;
    atom-text-editor {
      display: none;
    .github-CommitView-expandButton {
      position: relative;
      width: 100%;
      line-height: inherit;
      background-color: transparent;
      opacity: .5;
      &::before {
        margin-right: @component-padding / 2;
      &::after {
        content: "Toggle expanded commit message";
      &:active {
        opacity: .3;
  .hard-wrap-icons {
    fill: @text-color
Sunbelt Computer Software

PL/B Language Development and Support

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Sunbelt Computer Software

PL/B Language Development and Support

Uh oh!

FilesExpand file tree

commit-view.less

Latest commit

History

commit-view.less

File metadata and controls
