侧边栏顶栏无法显示为圆角

[ilyydy]

Please follow this Issue template to provide relevant information, such as source code repository, website URL and screenshots, which will help us investigate.
请按照此 Issue 模版提供相关信息，例如源码仓库、网站链接和屏幕截图，这将有助于我们进行调查。

Issue Checklist

• I am using the latest version of NexT.
• I have already read the Troubleshooting page of Hexo & Troubleshooting page of NexT.
• I have already searched for current issues, which does not help me.

---

Expected behavior

配置如下variables.styl，侧边栏顶栏应显示为圆角

source/_data/variables.styl

$border-radius-inner     = 20px 20px 20px 20px;
$border-radius           = 20px;

使用 next v7.8.0 能正常显示为圆角

Actual behavior

• Links to demo site with this issue: https://ilyydy.github.io/
• Links to repository or source code of the blog:
• Screenshots:

Steps to reproduce the behavior

Environment Information

Node.js and NPM Information

v10.20.1
6.14.4

Package dependencies Information

hexo-site@0.0.0 /home/zc/repo/zc/ilyydy.github.io
├── hexo@4.2.1
├── hexo-cake-moon-menu@2.1.2
├── hexo-deployer-git@2.1.0
├── hexo-filter-nofollow@2.0.2
├── hexo-generator-archive@1.0.0
├── hexo-generator-category@1.0.0
├── hexo-generator-feed@2.2.0
├── hexo-generator-index@1.0.0
├── hexo-generator-searchdb@1.3.0
├── hexo-generator-sitemap@2.0.0
├── hexo-generator-tag@1.0.0
├── hexo-renderer-ejs@1.0.0
├── hexo-renderer-marked@2.0.0
├── hexo-renderer-stylus@1.1.0
├── hexo-server@1.0.0
└── hexo-word-counter@0.0.1

Hexo Configuration

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

# Site
title: 野草
subtitle: ''
description: 目的虽有，道路却无；我们所称之为路的，无非是踌躇
keywords:
author: 张生
language: zh-CN
timezone: Asia/Shanghai

# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: https://ilyydy.github.io/
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
auto_spacing: false
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

# 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
## Use post's date for updated date unless set in front-matter
use_date_for_updated: false

# 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: git
  #对应仓库的SSH地址（可以在GitHub对应的仓库中复制）
  repo: git@github.com:ilyydy/ilyydy.github.io.git
  #（分支：User Pages为master，Project Pages为gh-pages）
  branch: master 

feed:
  type: atom
  path: atom.xml
  limit: 20
  hub:
  content:
  content_limit: 140
  content_limit_delim: ' '
  order_by: -date
  icon: icon.png
  autodiscovery: true
  template:

nofollow:
  enable: true
  field: site
  exclude:
    - 'exclude1.com'
    - 'exclude2.com'

search:
  path: search.xml
  field: post
  format: html
  limit: 100

moon_menu:
  back2top:
    enable: true
    icon: fa fa-chevron-up
    func: back2top
    order: -1
  back2bottom:
    enable: true
    icon: fa fa-chevron-down
    func: back2bottom
    order: -2

sitemap:
  path: sitemap.xml

NexT Configuration

scheme: Gemini

custom_file_path:
   #head: source/_data/head.njk
   #header: source/_data/header.njk
   #sidebar: source/_data/sidebar.njk
   #postMeta: source/_data/post-meta.njk
   #postBodyEnd: source/_data/post-body-end.njk
   #footer: source/_data/footer.njk
   #bodyEnd: source/_data/body-end.njk
   variable: source/_data/variables.styl
   #mixin: source/_data/mixins.styl
   style: source/_data/styles.styl

Other Information

[welcome]

Thanks for opening this issue, maintainers will get back to you as soon as possible!

[issue-label-bot]

Issue-Label Bot is automatically applying the label Bug to this issue, with a confidence of 0.53. Please mark this comment with 👍 or 👎 to give our bot feedback!

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

[stevenjoezhang]

谢谢反馈。暂时的解决方案是给 .site-brand-container 元素加上 border-radius，因为有黑色的背景「覆盖」了圆角。

这可能是一个历史遗留问题。我需要确认一下这是否是设计美观性上有意而为的。

可以追溯到 iissnan/hexo-theme-next#1311

[stevenjoezhang]

调查显示这应该是预期行为。见 iissnan/hexo-theme-next#1311 中对于 $border-radius-inner 的描述。
不过这两个变量确实有些不太直观，未来可能会优化相关代码。

[Early0v0]

可以在配置里面加一个选项？

像我就认为顶栏无圆角比较好看

[stevenjoezhang]

暂时改成这样了： 19160b8
在 Gemini/index.styl 中 $border-radius-inner 和 $border-radius 都只使用了一次，因此样式比较容易控制

[hansonwu99]

.site-brand-container

.site-brand-container 在哪里啊

[stevenjoezhang]

这一问题难以使用语言回答，可以用浏览器的检查元素寻找 .site-brand-container

[github-actions]

This thread has been automatically locked since there has not been any recent activity after it was closed. It is possible issue was solved or at least outdated. Feel free to open new for related bugs.