
// Fonts
@import url("https://fonts.googleapis.com/css?family=Lato:300,400,700");

// Variables
@import "variables";

@import "node_modules/bulma/bulma.sass";

.container.dashboard {
  .channel {
    border: 1px $panel-default-border solid;
    border-radius: 4px;
    padding: 8px;
    margin-top: 1em;

    h2 {
      font-size: 1.4em;
    }

    .channel-stats {
      color: $text-color-light;
      font-size: 0.8em;
    }
  }
}

.container.channel {
  .source {
    border: 1px $panel-default-border solid;
    border-radius: 4px;
    padding: 8px;
    margin-top: 1em;

    h2 {
      font-size: 1.4em;
      word-wrap: break-word;
    }

    .source-stats {
      color: $text-color-light;
      font-size: 0.8em;
    }
  }
}

#new-source-modal {
  ul {
    li {
      margin-top: 12px;
      padding: 8px;
      border: 1px $panel-default-border solid;
      border-radius: 4px;

      h3 {
        font-weight: bold;
      }

      .url {
        font-size: 0.9em;
        margin-bottom: 4px;
      }
    }
  }

}

.container.dashboard, .container.channel {
  .buttons.is-right {
    float: right;
  }

  @media(max-width: 600px) {
    .buttons.is-right {
      float: none;
    }
  }
}

.hidden {
  display: none;
}

.hidden-secret {
  color: whitesmoke;
}
.hidden-secret::before {
  content: "Click to show";
  color: #777;
}
.hidden-secret.reveal {
  color: #777;
}
.hidden-secret.reveal::before {
  content: "";
}

/* Sticky Footer */
html {
  min-height: 100%;
  position: relative;
}

body {
  margin-bottom: 14rem;
}

footer.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
}

