How to Change SideMenu Background?

[ghost1372]

• [x] I am using the latest version of NexT.
• [x] I have read the relevant documents of Hexo and NexT.
• [x] I have reviewed the latest Roadmap on GitHub and searched for current issues, which does not help me.

---

hi I want to change the background color (black) of this part. How can I do this?

Expected behavior

Change Background to Orange

Actual behavior

Background is Black

• Links to demo site with this issue: N/A
• Links to repository or source code of the blog: N/A

Steps to reproduce the behavior

1. N/A
2. N/A
3. N/A

Environment Information

Node.js and NPM Information

v14.8.0
6.14.7

Package dependencies Information

`-- (empty)

Hexo Configuration

# Hexo Configuration
## Docs: https://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/

# Site
title: test
subtitle: test
description: test
keywords:
author: test
language: en
timezone:

# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://yoursite.com
root: /
permalink: :year/:month/:day/:title/
permalink_defaults:
pretty_urls:
  trailing_index: true # Set to false to remove trailing 'index.html' from permalinks
  trailing_html: true # Set to false to remove trailing '.html' from permalinks

# Directory
source_dir: source
public_dir: public
tag_dir: tags
archive_dir: archives
category_dir: categories
code_dir: downloads/code
i18n_dir: :lang
skip_render:

# Writing
new_post_name: :title.md # File name of new posts
default_layout: post
titlecase: false # Transform title into titlecase
external_link:
  enable: true # Open external links in new tab
  field: site # Apply to the whole site
  exclude: ''
filename_case: 0
render_drafts: false
post_asset_folder: false
relative_link: false
future: true
highlight:
  enable: true
  line_number: true
  auto_detect: false
  tab_replace: ''
  wrap: true
  hljs: false
prismjs:
  enable: false
  preprocess: true
  line_number: true
  tab_replace: ''

# Home page setting
# path: Root path for your blogs index page. (default = '')
# per_page: Posts displayed per page. (0 = disable pagination)
# order_by: Posts order. (Order by date descending by default)
index_generator:
  path: ''
  per_page: 10
  order_by: -date

# Category & Tag
default_category: uncategorized
category_map:
tag_map:

# Metadata elements
## https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta
meta_generator: true

# Date / Time format
## Hexo uses Moment.js to parse and display date
## You can customize the date format as defined in
## http://momentjs.com/docs/#/displaying/format/
date_format: YYYY-MM-DD
time_format: HH:mm:ss
## updated_option supports 'mtime', 'date', 'empty'
updated_option: 'mtime'

# Pagination
## Set per_page to 0 to disable pagination
per_page: 10
pagination_dir: page

# Include / Exclude file(s)
## include:/exclude: options only apply to the 'source/' folder
include:
exclude:
ignore:

# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: next

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type: ''

search:
  path: search.xml
  field: page
  format: html
  limit: 10000

NexT Configuration

Other Information

also Previously, I wrote the following code into a custom style in older version (\next\source\css_custom\custom.styl) But now I can not find that file. Where should I write the related code?

// Custom styles.

.header-inner {
  box-shadow: 0 4px 8px 1.5px rgba(0,0,0,0.15);
  border-radius: 0 0 10px 10px;
}

.sub-menu {
  box-shadow: 0 4px 8px 1.5px rgba(0,0,0,0.15);
  border-radius: 0 0 10px 10px;
}

#sub-menu-2 {
  margin-top: -10px;
}

.post-block, .sidebar-inner {
  box-shadow: 0 4px 8px 1.5px rgba(0,0,0,0.15) !important;
  border-radius:10px;
}

.back-to-top {
  border-radius: 0 0 10px 10px;
}

.container {
  min-height: 100%;
}

.container:before {
  content: "";
  opacity: 0.1;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -1;
  background: url(https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Resources/cloud.png);
}

.posts-expand .post-body img {
  margin: 3px;
  display: inline;
  padding: 3px !important;
  border: 0;
}

.post-body h2 {
    font-size: 1.45em;
    border-bottom: 0px solid #eee;
}

a, span.exturl {
    overflow-wrap: break-word;
    word-wrap: break-word;
    background-color: transparent;
    color: #555;
    text-decoration: none;
    outline: none;
    border-bottom: 0px solid #999;
    cursor: pointer;
}

[close-issue-app[bot]]

This issue has been closed because it does not meet our Issue template. Please read our guidelines for contributing.

[issue-label-bot[bot]]

Issue-Label Bot is automatically applying the label Question to this issue, with a confidence of 0.85. Please mark this comment with :thumbsup: or :thumbsdown: to give our bot feedback!

Links: app homepage, dashboard and code for this bot.