/* user: profile repositories / main */

.user {
  .container {
    .grid {
      .five.column {
        .card {
          background: $bg50;
          box-shadow: none;
          color: $white;
          position: sticky;
          top: 20px;
          .content {
            .header {
              color: $white;
            }
          }
          .extra.content {
            ul.text.black {
              color: $white;
              li {
                @if $nojavascript == true {
                  padding: 10px 20px;
                }
                &:not(:last-child) {
                  border-bottom: 1px solid $bg60;
                }
                svg {
                  @if $nojavascript == true {
                    display: none;
                  }
                }
              }
              a {
                color: $white-light;
                &:hover {
                  color: $red;
                }
              }
            }
          }
        }
      }
      .eleven.column {
        .secondary.pointing.menu {
          background: $bg70;
          border: 0;
          border-radius: 5px 5px 0 0;
          margin-top: -15px;
          overflow-x: auto;
          overflow-y: hidden;
          padding: 0 20px;
          scrollbar-color: $white-dark $bg70;
          top: 0;
          transform: rotateX(180deg);
          z-index: 100;
          .item {
            border-bottom: 2px solid transparent;
            border-radius: 5px 5px 0 0;
            color: $white;
            font-family: $font-family;
            margin-bottom: 10px;
            transform: rotateX(180deg);
            transition: background .2s, color .2s;
            &:hover {
              background: $bg60;
              color: $white-light;
            }
            &.active {
              border-bottom: 2px solid $white;
              color: $white;
              &:hover {
                color: $white-light;
              }
            }
            @if $nojavascript == true {
              svg {
                display: none;
              }
            }
            .label {
              background: $white;
              color: $bg70;
            }
            @if $singleuser == true {
              &[href*="stars"], 
              &[href*="following"], 
              &[href*="followers"] {
                display: none;
              }
            }
          }
        }
        @if $nojavascript == true {
          .filter.menu {
            display: none;
          }
        }
        form.form {
          .input {
            input {
              background: $bg40;
              border: 2px solid $bg60;
              color: $white;
              &:focus {
                background: $bg50;
                border: 2px solid $bg60;
                color: $white-light;
              }
            }
            .button {
              background: $bg60;
              border: 0;
              &:hover {
                background: $bg50;
              }
            }
          }
        }
        .divider {
          border-bottom: 1px solid $bg60;
        }
        .repository.list {
          .item {
            &:not(:first-child) {
              border-top: 1px solid $bg60;
            }
            .header {
              a.name {
                font-family: $font-family;
                i.archive.icon {
                  color: $white-dark !important;
                }
              }
              .metas {
                @if $singleuser == true {
                  display: none;
                }
                span {
                  color: $white-dark !important;
                }
              }
            }
            .description {
              p {
                color: $white;
                &.time {
                  color: $white-dark;
                }
              }
              .tags {
                a .label {
                  background: $bg60;
                  color: $white;
                  &:hover {
                    background: $bg70;
                    color: $white-light;
                  }
                }
              }
            }
          }
        }
      }
    }
  }
}

/* user: profile public activity */

.user.profile {
  .container {
    .grid {
      .eleven.column {
        @if $nojavascript == true {
          #user-heatmap {
            display: none;
          }
        }
        @if $nojavascript == false {
          @include contribution-heatmap;
        }
        .feeds {
          .news {
            .content {
              span {
                color: $white-dark !important;
              }
            }
            p.grey {
              span {
                color: $white-dark;
              }
            }
            .svg {
              fill: $white-dark;
            }
          }
        }
      }
    }
  }
}

/* user: signin */

.user.signin {
  .container {
    .header { 
      background: $bg60;
      border: 0;
      color: $white;
    }
    .segment {
      background: $bg50;
      border: 0;
      color: $white;
      .form {
        .field {
          label {
            color: $white;
            &::after {
              color: $red;
            }
          }
          input {
            background: $bg40;
          }
          .green.button {
            background: $bg80;
            box-shadow: none;
            color: $white;
            &:hover {
              background: $bg70;
            }
          }
        }
      }
    }
  }
}


/* user: notification */

.user.notification {
  .container {
    h1.dividing.header {
      border: 0;
      color: $white;
    }
    .top.attached.tabular.menu {
      border: 0;
      .item {
        border: 0;
        color: $white-light;
        &.active {
          background: $bg50;
          color: $white-light;
        }
        .label {
          background: $white;
          color: $bg60;
        }
      }
    }
    .bottom.attached.tab.segment {
      background: $bg50;
      border: 0;
      table#notification_table {
        background: $bg50;
        tbody {
          tr {
            transition: background .2s;
            &:hover {
              background: $bg40;
            }
            td { // 1st row
              span {
                &.blue {
                  svg.octicon-pin {
                    fill: $white;
                  }
                }
                &.green {
                  svg.octicon-issue-opened {
                    fill: $green;
                  }
                }
                &.red {
                  svg.octicon-issue-closed {
                    fill: $red;
                  }
                }
              }
            }
            td { // 4th row
              form {
                button.mini.button {
                  background: $bg70;
                  transition: background .2s;
                  &:hover {
                    background: $bg60;
                  }
                  svg {
                    fill: $white-light;
                  }
                }
              }
            }
          }
        }
      }
    }
    .page.buttons {
      .pagination.menu {
        background: $bg60;
        border: 0;
        .item {
          color: $white;
          transition: background .2s;
          &:hover {
            background: $bg50;
          }
          &.active {
            background: $bg50;
            color: $white-light;
          }
          &.disabled {
            color: $white-disabled;
          }
        }
      }
    }
  }
}