hexo-theme-amazing/include/style/mystyle/night.styl

A simple, delicate, and modern theme for Hexo

/* ---------------------------------
 *    Night
 * --------------------------------- */

// night Mode
// author by removef
// https://removeif.github.io/
night-color = #151313
night-color-hover = #7a7a7a
night-link = #3273dc

.night {

  color: silver !important;
  background-color black;

  .aplayer .aplayer-miniswitcher {
    background: #c0c0c0 !important;
  }

  .navbar-highlight {
    background-color night-color !important;
  }
  .content blockquote {
    background-color: night-color
  }
  .button.is-light {
    background-color: night-color;
  }
  .tag:not(body) {
    background-color: night-color;
  }

  strong {
    color: white;
  }

  .time-axis-main .time-axis-achievement, .time-axis-main .time-axis-title {
    background-color: night-color;
    color: white
  }
  
  .pagination .pagination-link:not(.is-current), .pagination .pagination-previous, .pagination .pagination-next {
    background-color: night-color;
  }

  .button.is-white {
    color: white;
  }

  .button.is-light {
    color silver
  }

  a:hover {
    //background-color night-color-hover
    color white
  }

  hr {
    background-color: night-color;
  }

  .menu-list a:hover {
    background-color: night-color-hover;
    color night-link
  }
  .menu-list a {
    color silver
  }

  .level a:hover {
    //background-color: night-color-hover;
    color night-link !important
  }

  .level .is-rounded:hover {
    color white !important
  }

  .level .level-item.is-marginless:hover {
    background-color: night-color;
    color night-link
  }

  .level .level-item.is-link:hover {
    color white
  }

  //.level .level-item .is-size-7:hover {
  //  background-color: black;
  //  color white
  //}

  .navbar-menu a:hover {
    color: night-link
  }

  .post-copyright {
    background-color: night-color;
  }

  #back-to-top:hover {
    color night-link
  }

  .tags.has-addons .tag:hover {
    color night-link
  }

  input {
    background-color black
    color white
  }

  .card {
    color silver
  }

  .has-text-grey {
    color silver !important
  }
  .has-link-black-ter {
    color night-link !important
  }
  .has-link-grey.-link {
    color silver
  }
  .has-link-grey, .has-link-black-ter {
    color silver !important;
  }

  .menu-label {
    color silver !important;
  }

  .tag:not(body) {
    color silver
  }

  #body_hot_comment .comment-content .item {
    color silver
  }

  .has-text-black-ter {
    color silver !important;
  }

  .has-text-black-ter:hover {
    color night-link !important
  }

  .navbar-item, .navbar-link {
    color silver
  }

  .title {
    color silver
  }

  .level-item.tag.is-danger {
    background-color night-link !important
    color silver
  }

  .friend-title-item {
    color silver
  }

  .music-container #musiclist {
    background night-color
  }

  .meplayer-container {
    background-color night-color
  }

  // --removeif
  .navbar {
    background-color night-color
  }
  .card {
    background-color night-color
  }
  .footer {
    background-color night-color
  }
  .button.is-white {
    background-color night-color
  }
  .cardm {
    background-color night-color
  }
  .waifu-tips {
    background-color night-color
    color silver
  }
  // --

  .has-link-grey.-link:hover {
    color night-link !important
  }
  .has-link-black-ter:hover {
    color night-link !important
  }

  .timeline .media:last-child:after {
    background-color night-color
  }

  .level-item.tag.is-danger,
  .button:not(.is-white), #index_hot_div,
  #post-calendar canvas,
  .waifu canvas,
  .is-current,
  .button.is-marginless .fab, .fas,
  .button.is-large,
  .gt-btn,
  .gt-comment-body pre,
  .time-axis-main,
  .meplayer-control-play,
  .social-share,
  .widget .tags .tag:first-child,
  .g-emoji,
  .fa-envelope
  input,
  img {
    filter: brightness(.6) !important
  }

  figure {
    filter: brightness(.7) !important
  }

  strong {
    filter: brightness(.8) !important;
  }

  .content blockquote {
    border-left: 3px solid #1e4584;
  }

  .timeline {
    border-left: 1px solid #dbdbdb70;
    .media:before {
      background: #dbdbdb70;
    }
  }

  .post-copyright {
    border-left: 3px solid #ff170070;
  }

  .button.is-light {
    filter: brightness(1) !important;
  }

  .breadcrumb li.is-active a {
    color silver
  }

  .menu-list li ul {
    border-left: 1px solid #dbdbdb70;
  }

  // comment start

  .markdown-body blockquote {
    border-left: 0.25em solid #dfe2e590;
  }

  .gt-container .gt-comment-content {
    background-color black !important
    color silver !important
  }

  .gt-container .gt-comment-body {
    color silver !important
  }

  .gt-container .gt-comment-content:hover {
    -webkit-box-shadow: 0 0.625em 3.75em 0 #f4f4f4;
    box-shadow: 0 0.625em 3.75em 0 black;
  }

  textarea {
    background-color night-color;
    color white;
  }

  .gt-container .gt-header-textarea:hover {
    background-color: black;
  }

  .gt-container .gt-header-textarea {
    background-color: black;
  }
  .ins-section-container {
    background-color: night-color;
    color: silver;
  }
  .searchbox .searchbox-input-wrapper .searchbox-input {
    background-color: night-color;
  }
  .cardm {
    color: unset;
  }
  .g-ads-x {
    filter: brightness(0.6) !important;
  }
  .g-ads-y {
    filter: brightness(0.6) !important;
  }
  .google-auto-placed {
    filter: brightness(0.6) !important;
  }

  .pagination-previous, .pagination-next, .pagination-link {
    color: silver;
  }
  .pagination .pagination-link a, .pagination .pagination-ellipsis a, .pagination .pagination-previous a, .pagination .pagination-next a {
    color: silver;
  }

  .content .gt-container .gt-comment-header {
    background-color: #151313;
  }
  .content .gt-container .gt-comment-admin .gt-comment-content {
    border: 2px solid #151313;
  }

  #post-calendar {
    background-color: #626161;
    //border-radius: 20rem;
  }
  .button.is-white, .button.is-transparent {
    color: silver;
  }

  hr, .index-category-tag hr {
    background-color: #989898;
  }

  .navbar-menu {
    background-color: unset;
  }
  #index_hot_div {
    color: silver;
  }
  #index_hot_div {
    filter: unset !important;
    .item {
      filter: brightness(0.6) !important;
    }
  }
  .gt-container .gt-meta {
    border-bottom: 2px solid #989898;
  }

  figure.highlight figcaption * {
    color: unset;
  }

  figure.highlight figcaption.level .level-right a {
    color: silver;
  }

  .menu-list .is-current {
    color: #3273dc;
    background: #7a7a7a;
    filter: unset !important;
  }

  .friend-card-item {
    color: unset;
  }

  .g-ads-x, .g-ads-y, .google-auto-placed {
    filter: brightness(0.6) !important;
  }
  .index-category-tag {
    .button.is-small {
      color: silver;
      filter: unset !important;
    }
    .article-more:hover {
      background-color: unset !important;
    }
  }

  a.navbar-item:focus, .navbar-link:focus, a.navbar-item:focus-within, .navbar-link:focus-within, a.navbar-item:hover, .navbar-link:hover, a.navbar-item.is-active, .navbar-link.is-active {
    background-color: unset;
    color: #3273dc;
  }

  .menu-list a.is-active {
    background-color: #7a7a7a;
    color: #3273dc;
  }

  .recommend-area, .article-licensing {
    background: #000;
  }

  .article-licensing .licensing-title a {
    color: #3273dc !important;
  }
  
  .content h1, .content h2, .content h3, .content h4, .content h5, .content h6 {
    color: silver;
    font-weight: 800;
  }

  .navbar, footer.footer, .card {
    background-color: rgba(21, 19, 19, 0.678);
  }

}