asandikci.com/web
1
0
Fork 0
Code Issues 11 Pull requests Projects Releases Packages Wiki Activity Actions

refactor(ui): standardize the border radius (#1920)

Browse source 
Impact:
- Increase the border radius of inline code and `<kbd>` tags
- Variable `$base-radius` renamed to `$radius-lg`
This commit is contained in:
Cotes Chung 2024-08-25 18:17:38 +08:00 committed by GitHub
parent 5f4dab1745
commit 31e19c6d0f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
7 changed files with 12 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
_sass/addon/commons.scss
View file

@ -134,7 +134,7 @@ kbd {
padding-top: 0.1rem; padding-top: 0.1rem;
color: var(--kbd-text-color); color: var(--kbd-text-color);
background-color: var(--kbd-bg-color); background-color: var(--kbd-bg-color);
border-radius: 0.25rem; border-radius: $radius-sm;
border: solid 1px var(--kbd-wrap-color); border: solid 1px var(--kbd-wrap-color);
box-shadow: inset 0 -2px 0 var(--kbd-wrap-color); box-shadow: inset 0 -2px 0 var(--kbd-wrap-color);
} }

2
_sass/addon/module.scss
View file

@ -81,7 +81,7 @@
} }
%rounded { %rounded {
border-radius: $base-radius; border-radius: $radius-lg;
} }
%img-caption { %img-caption {

6
_sass/addon/syntax.scss
View file

@ -102,9 +102,9 @@ code {
&.highlighter-rouge { &.highlighter-rouge {
font-size: $code-font-size; font-size: $code-font-size;
padding: 3px 6px; padding: 3px 5px;
word-break: break-word; word-break: break-word;
border-radius: 4px; border-radius: $radius-sm;
background-color: var(--inline-code-bg); background-color: var(--inline-code-bg);
} }
@ -261,7 +261,7 @@ div {
.content > & { .content > & {
@include ml-mr(0); @include ml-mr(0);
border-radius: $base-radius; border-radius: $radius-lg;
} }
.code-header { .code-header {

3
_sass/addon/variables.scss
View file

@ -16,7 +16,8 @@ $search-max-width: 200px !default;
$footer-height: 5rem !default; $footer-height: 5rem !default;
$footer-height-large: 6rem !default; /* screen width: < 850px */ $footer-height-large: 6rem !default; /* screen width: < 850px */
$main-content-max-width: 1250px !default; $main-content-max-width: 1250px !default;
$base-radius: 0.625rem !default; $radius-sm: 6px !default;
$radius-lg: 10px !default;
$back2top-size: 2.75rem !default; $back2top-size: 2.75rem !default;
/* syntax highlight */ /* syntax highlight */

2
_sass/layout/categories.scss
View file

@ -16,7 +16,7 @@
} }
.card-header { .card-header {
$radius: calc($base-radius - 1px); $radius: calc($radius-lg - 1px);
padding: 0.75rem; padding: 0.75rem;
border-radius: $radius; border-radius: $radius;

4
_sass/layout/home.scss
View file

@ -20,7 +20,7 @@
background: none; background: none;
%img-radius { %img-radius {
border-radius: $base-radius $base-radius 0 0; border-radius: $radius-lg $radius-lg 0 0;
} }
.preview-img { .preview-img {
@ -131,7 +131,7 @@
/* Tablet */ /* Tablet */
@media all and (min-width: 768px) { @media all and (min-width: 768px) {
%img-radius { %img-radius {
border-radius: 0 $base-radius $base-radius 0; border-radius: 0 $radius-lg $radius-lg 0;
} }
#post-list { #post-list {

4
_sass/layout/post.scss
View file

@ -173,12 +173,12 @@ header {
} }
&:first-child { &:first-child {
border-radius: $base-radius 0 0 $base-radius; border-radius: $radius-lg 0 0 $radius-lg;
left: 0.5px; left: 0.5px;
} }
&:last-child { &:last-child {
border-radius: 0 $base-radius $base-radius 0; border-radius: 0 $radius-lg $radius-lg 0;
right: 0.5px; right: 0.5px;
} }
} }