Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
虎纹鲨鱼
avatar
提交
c7254cbd
A
avatar
项目概览
虎纹鲨鱼
/
avatar
通知
4
Star
255
Fork
105
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
A
avatar
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
c7254cbd
编写于
10月 19, 2021
作者:
L
LeoKu
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
style: improve and fix
上级
11412141
变更
5
隐藏空白更改
内联
并排
Showing
5 changed file
with
62 addition
and
44 deletion
+62
-44
src/App.vue
src/App.vue
+35
-32
src/assets/preview/glasses/round.svg
src/assets/preview/glasses/round.svg
+5
-9
src/components/CodeModal.vue
src/components/CodeModal.vue
+20
-2
src/components/Configurator.vue
src/components/Configurator.vue
+1
-1
src/styles/variables.scss
src/styles/variables.scss
+1
-0
未找到文件。
src/App.vue
浏览文件 @
c7254cbd
...
...
@@ -279,42 +279,45 @@ function handleAction(actionType: ActionType) {
}
}
.
gradient
-
bg
{
position
:
fixed
;
top
:
0
;
left
:
0
;
width
:
100
%
;
height
:
100
%
;
overflow
:
hidden
;
@
mixin
gradient
-
style
(
$color
)
{
position
:
absolute
;
width
:
100
vh
;
height
:
100
vh
;
background
-
image
:
radial
-
gradient
(
rgba
(
$color
,
0.8
)
20
%
,
rgba
(
$color
,
0.6
)
40
%
,
rgba
(
$color
,
0.4
)
60
%
,
rgba
(
$color
,
0.2
)
80
%
,
transparent
100
%
);
border
-
radius
:
50
%
;
opacity
:
0.2
;
filter
:
blur
(
4
rem
);
}
@
supports
(
filter
:
blur
(
4
rem
))
or
(
-
webkit
-
filter
:
blur
(
4
rem
))
or
(
-
moz
-
filter
:
blur
(
4
rem
))
{
.
gradient
-
bg
{
position
:
fixed
;
top
:
0
;
left
:
0
;
width
:
100
%
;
height
:
100
%
;
overflow
:
hidden
;
@
mixin
gradient
-
style
(
$color
)
{
position
:
absolute
;
width
:
100
vh
;
height
:
100
vh
;
background
-
image
:
radial
-
gradient
(
rgba
(
$color
,
0.8
)
20
%
,
rgba
(
$color
,
0.6
)
40
%
,
rgba
(
$color
,
0.4
)
60
%
,
rgba
(
$color
,
0.2
)
80
%
,
transparent
100
%
);
border
-
radius
:
50
%
;
opacity
:
0.2
;
filter
:
blur
(
4
rem
);
}
.
gradient
-
top
{
@
include
gradient
-
style
(
$color
-
secondary
);
.
gradient
-
top
{
@
include
gradient
-
style
(
$color
-
secondary
);
top
:
-
50
%
;
right
:
-
20
%
;
}
top
:
-
50
%
;
right
:
-
20
%
;
}
.
gradient
-
bottom
{
@
include
gradient
-
style
(
$color
-
accent
);
.
gradient
-
bottom
{
@
include
gradient
-
style
(
$color
-
accent
);
bottom
:
-
50
%
;
left
:
-
20
%
;
bottom
:
-
50
%
;
left
:
-
20
%
;
}
}
}
<
/style
>
src/assets/preview/glasses/round.svg
浏览文件 @
c7254cbd
...
...
@@ -11,25 +11,21 @@
cx=
"123.5"
cy=
"28"
r=
"26"
stroke=
"
#aaa
"
stroke=
"
hsl(211, 19%, 70%)
"
stroke-width=
"4"
/>
<circle
cx=
"56.5"
cy=
"37"
r=
"26"
stroke=
"
#aaa
"
stroke=
"
hsl(211, 19%, 70%)
"
stroke-width=
"4"
/>
<path
d=
"M98.5 35C98.5 32.8783 97.6571 30.8434 96.1569 29.3431C94.6566 27.8429 92.6217 27 90.5 27C88.3783 27 86.3434 27.8429 84.8431 29.3431C83.3429 30.8434 82.5 32.8783 82.5 35"
stroke=
"#aaa"
stroke-width=
"4"
/>
<path
d=
"M31 39L1 44.5"
stroke=
"#aaa"
stroke=
"hsl(211, 19%, 70%)"
stroke-width=
"4"
/>
<path
d=
"M31 39L1 44.5"
stroke=
"hsl(211, 19%, 70%)"
stroke-width=
"4"
/>
</g>
</svg>
\ No newline at end of file
</svg>
src/components/CodeModal.vue
浏览文件 @
c7254cbd
...
...
@@ -96,16 +96,23 @@ onUnmounted(() => {
padding
:
2rem
0
;
overflow
:
hidden
;
transform
:
translate
(
-50%
,
0
);
@supports
(
backdrop-filter
:
blur
(
0
.1rem
))
{
backdrop-filter
:
blur
(
0
.1rem
);
}
}
.code-box
{
$code-header-height
:
4rem
;
$code-box-side-padding-normal
:
2rem
;
$code-box-side-padding-small
:
1rem
;
position
:
relative
;
width
:
75%
;
max-width
:
800px
;
height
:
100%
;
margin
:
0
auto
;
padding
:
$code-header-height
2rem
2
.5rem
2rem
;
padding
:
$code-header-height
$code-box-side-padding-normal
2
.5rem
$code-box-side-padding-normal
;
background-color
:
lighten
(
$color-dark
,
3
);
border-radius
:
1rem
;
transition
:
width
0
.2s
;
...
...
@@ -120,6 +127,12 @@ onUnmounted(() => {
@media
screen
and
(
max-width
:
$screen-sm
)
{
width
:
90%
;
padding
:
$code-header-height
$code-box-side-padding-small
2
.5rem
$code-box-side-padding-small
;
.code-header
{
padding
:
0
$code-box-side-padding-small
;
}
}
.code-header
{
...
...
@@ -130,7 +143,7 @@ onUnmounted(() => {
align-items
:
center
;
width
:
100%
;
height
:
$code-header-height
;
padding
:
0
2rem
;
padding
:
0
$code-box-side-padding-normal
;
.title
{
font-weight
:
bold
;
...
...
@@ -219,6 +232,11 @@ onUnmounted(() => {
font-family
:
'Ubuntu Mono'
,
Fallback
;
line-height
:
1
.4
;
@media
screen
and
(
max-width
:
$screen-sm
)
{
padding
:
0
1rem
;
font-size
:
1rem
;
}
&
>
.token
{
&
.key
{
color
:
#ffcb6b
;
...
...
src/components/Configurator.vue
浏览文件 @
c7254cbd
...
...
@@ -290,7 +290,7 @@ function switchWidget(widgetType: WidgetType, widgetShape: WidgetShape) {
}
&
:deep
(
path
)
{
stroke
:
#aaa
!
important
;
stroke
:
$color-stroke
!
important
;
}
}
}
...
...
src/styles/variables.scss
浏览文件 @
c7254cbd
...
...
@@ -6,6 +6,7 @@ $color-dark: hsl(216, 14%, 14%);
$color-gray
:
lighten
(
$color-dark
,
5
);
$color-page-bg
:
darken
(
$color-dark
,
5
);
$color-configurator
:
$color-dark
;
$color-stroke
:
$color-text
;
$layout-header-height
:
6rem
;
$layout-sider-width
:
20rem
;
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录