hexo-theme-shokax 0.0.2-alpha2 → 0.0.3

Sign up to get free protection for your applications and to get access to all the features.
Files changed (157) hide show
  1. package/CODE_OF_CONDUCT.md +128 -0
  2. package/CONTRIBUTING.md +56 -0
  3. package/LICENSE +28 -28
  4. package/LICENSE-shoka +21 -21
  5. package/README.md +46 -55
  6. package/README_en.MD +25 -0
  7. package/_config.yml +392 -355
  8. package/_images.yml +100 -100
  9. package/languages/README.md +19 -19
  10. package/languages/default.yml +1 -1
  11. package/languages/en.yml +151 -151
  12. package/languages/ja.yml +146 -146
  13. package/languages/zh-CN.yml +154 -154
  14. package/languages/zh-HK.yml +146 -146
  15. package/languages/zh-TW.yml +146 -146
  16. package/layout/_alternate/atom.ejs +30 -30
  17. package/layout/_alternate/json.ejs +16 -16
  18. package/layout/_alternate/rss.ejs +34 -34
  19. package/layout/_mixin/breadcrumb.pug +33 -33
  20. package/layout/_mixin/card.pug +37 -37
  21. package/layout/_mixin/comment.pug +66 -12
  22. package/layout/_mixin/postmeta.pug +30 -30
  23. package/layout/_mixin/segment.pug +32 -32
  24. package/layout/_mixin/sidebar.pug +36 -36
  25. package/layout/_mixin/widgets.pug +31 -29
  26. package/layout/_partials/footer.pug +40 -40
  27. package/layout/_partials/head/head.pug +56 -58
  28. package/layout/_partials/head/head_com.pug +17 -17
  29. package/layout/_partials/head/pwa.pug +18 -18
  30. package/layout/_partials/header.pug +18 -18
  31. package/layout/_partials/layout.pug +143 -153
  32. package/layout/_partials/loading.pug +13 -13
  33. package/layout/_partials/pagination.pug +4 -4
  34. package/layout/_partials/post/copyright.pug +20 -20
  35. package/layout/_partials/post/footer.pug +14 -14
  36. package/layout/_partials/post/nav.pug +13 -13
  37. package/layout/_partials/post/post.pug +28 -28
  38. package/layout/_partials/post/reward.pug +18 -18
  39. package/layout/_partials/sidebar/menu.pug +37 -37
  40. package/layout/_partials/sidebar/overview.pug +41 -42
  41. package/layout/_partials/third-party/baidu-analytics.pug +11 -11
  42. package/layout/_partials/third-party/clarity.pug +8 -8
  43. package/layout/archive.pug +118 -118
  44. package/layout/category.pug +63 -63
  45. package/layout/index.pug +33 -33
  46. package/layout/page.pug +56 -56
  47. package/layout/post.pug +35 -35
  48. package/layout/tag.pug +43 -43
  49. package/package.json +35 -35
  50. package/scripts/filters/locals.js +59 -59
  51. package/scripts/filters/post.js +23 -23
  52. package/scripts/generaters/archive.js +141 -141
  53. package/scripts/generaters/config.js +43 -43
  54. package/scripts/generaters/images.js +26 -26
  55. package/scripts/generaters/index.js +110 -110
  56. package/scripts/generaters/pages.js +19 -19
  57. package/scripts/generaters/script.js +89 -89
  58. package/scripts/helpers/asset.js +183 -237
  59. package/scripts/helpers/engine.js +190 -190
  60. package/scripts/helpers/list_categories.js +140 -140
  61. package/scripts/helpers/symbols_count_time.js +76 -76
  62. package/scripts/plugin/index.js +6 -6
  63. package/scripts/plugin/lib/injects-point.js +19 -19
  64. package/scripts/plugin/lib/injects.js +89 -88
  65. package/scripts/tags/links.js +86 -86
  66. package/scripts/tags/media.js +19 -19
  67. package/source/assets/algolia_logo.svg +9 -9
  68. package/source/assets/logo.svg +16 -16
  69. package/source/css/_colors.styl +207 -207
  70. package/source/css/_common/components/components.styl +6 -6
  71. package/source/css/_common/components/highlight/highlight.styl +353 -353
  72. package/source/css/_common/components/highlight/operation.styl +21 -21
  73. package/source/css/_common/components/pages/collapse.styl +119 -119
  74. package/source/css/_common/components/pages/home.styl +385 -385
  75. package/source/css/_common/components/pages/pages.styl +56 -56
  76. package/source/css/_common/components/pages/tag-cloud.styl +12 -12
  77. package/source/css/_common/components/post/breadcrumb.styl +39 -39
  78. package/source/css/_common/components/post/copyright.styl +41 -41
  79. package/source/css/_common/components/post/expand.styl +264 -264
  80. package/source/css/_common/components/post/footer.styl +11 -11
  81. package/source/css/_common/components/post/header.styl +79 -79
  82. package/source/css/_common/components/post/nav.styl +63 -63
  83. package/source/css/_common/components/post/post.styl +29 -29
  84. package/source/css/_common/components/post/reward.styl +50 -50
  85. package/source/css/_common/components/post/rtl.styl +12 -12
  86. package/source/css/_common/components/post/tags.styl +39 -39
  87. package/source/css/_common/components/tags/collapse.styl +72 -72
  88. package/source/css/_common/components/tags/container.styl +49 -49
  89. package/source/css/_common/components/tags/label.styl +12 -12
  90. package/source/css/_common/components/tags/links.styl +77 -77
  91. package/source/css/_common/components/tags/list.styl +131 -131
  92. package/source/css/_common/components/tags/note.styl +70 -70
  93. package/source/css/_common/components/tags/player.styl +361 -361
  94. package/source/css/_common/components/tags/quiz.styl +200 -200
  95. package/source/css/_common/components/tags/tabs.styl +83 -83
  96. package/source/css/_common/components/tags/tags.styl +9 -9
  97. package/source/css/_common/components/third-party/loading.styl +222 -222
  98. package/source/css/_common/components/third-party/mermaid/class.styl +90 -90
  99. package/source/css/_common/components/third-party/mermaid/flowchart.styl +72 -72
  100. package/source/css/_common/components/third-party/mermaid/gantt.styl +251 -251
  101. package/source/css/_common/components/third-party/mermaid/git.styl +7 -7
  102. package/source/css/_common/components/third-party/mermaid/mermaid.styl +37 -37
  103. package/source/css/_common/components/third-party/mermaid/pie.styl +9 -9
  104. package/source/css/_common/components/third-party/mermaid/sequence.styl +95 -95
  105. package/source/css/_common/components/third-party/mermaid/state.styl +130 -130
  106. package/source/css/_common/components/third-party/pace.styl +18 -18
  107. package/source/css/_common/components/third-party/search.styl +167 -167
  108. package/source/css/_common/components/third-party/theme.styl +151 -151
  109. package/source/css/_common/components/third-party/third-party.styl +22 -22
  110. package/source/css/_common/components/third-party/valine.styl +548 -548
  111. package/source/css/_common/components/third-party/widgets.styl +57 -57
  112. package/source/css/_common/outline/footer/footer.styl +69 -69
  113. package/source/css/_common/outline/header/brand.styl +77 -77
  114. package/source/css/_common/outline/header/header.styl +20 -20
  115. package/source/css/_common/outline/header/image.styl +79 -79
  116. package/source/css/_common/outline/header/menu.styl +117 -117
  117. package/source/css/_common/outline/header/nav.styl +81 -81
  118. package/source/css/_common/outline/header/right.styl +15 -15
  119. package/source/css/_common/outline/header/tool.styl +207 -207
  120. package/source/css/_common/outline/header/waves.styl +50 -50
  121. package/source/css/_common/outline/mobile.styl +46 -46
  122. package/source/css/_common/outline/outline.styl +78 -78
  123. package/source/css/_common/outline/sidebar/author.styl +59 -59
  124. package/source/css/_common/outline/sidebar/dimmer.styl +23 -23
  125. package/source/css/_common/outline/sidebar/menu.styl +63 -63
  126. package/source/css/_common/outline/sidebar/quick.styl +43 -43
  127. package/source/css/_common/outline/sidebar/related.styl +56 -56
  128. package/source/css/_common/outline/sidebar/sidebar.styl +75 -75
  129. package/source/css/_common/outline/sidebar/social.styl +69 -69
  130. package/source/css/_common/outline/sidebar/state.styl +37 -37
  131. package/source/css/_common/outline/sidebar/tab.styl +71 -71
  132. package/source/css/_common/outline/sidebar/toc.styl +47 -47
  133. package/source/css/_common/scaffolding/animate.styl +318 -318
  134. package/source/css/_common/scaffolding/base.styl +172 -172
  135. package/source/css/_common/scaffolding/buttons.styl +48 -48
  136. package/source/css/_common/scaffolding/divider.styl +36 -36
  137. package/source/css/_common/scaffolding/iconfont.styl +443 -443
  138. package/source/css/_common/scaffolding/normalize.styl +289 -289
  139. package/source/css/_common/scaffolding/pagination.styl +81 -81
  140. package/source/css/_common/scaffolding/ribbon.styl +38 -38
  141. package/source/css/_common/scaffolding/scaffolding.styl +14 -14
  142. package/source/css/_common/scaffolding/scrollbar.styl +37 -37
  143. package/source/css/_common/scaffolding/tables.styl +50 -50
  144. package/source/css/_common/scaffolding/tip.styl +19 -19
  145. package/source/css/_common/scaffolding/toggles.styl +59 -59
  146. package/source/css/_iconfont.styl +451 -451
  147. package/source/css/_mixins.styl +146 -146
  148. package/source/css/_variables.styl +89 -89
  149. package/source/css/app.styl +36 -36
  150. package/source/css/comment.styl +5 -5
  151. package/source/css/mermaid.styl +5 -5
  152. package/source/js/_app/components.js +330 -330
  153. package/source/js/_app/global.js +317 -317
  154. package/source/js/_app/library.js +302 -302
  155. package/source/js/_app/page.js +623 -623
  156. package/source/js/_app/player.js +748 -748
  157. package/source/js/_app/vue.js +43 -43
@@ -1,78 +1,78 @@
1
- #container {
2
- min-height: 100%;
3
- min-width: 100%;
4
- position: relative;
5
- display: flex;
6
- flex-direction: column;
7
- }
8
-
9
-
10
- .inner {
11
- margin: 0 auto;
12
- width: 100%;
13
- }
14
-
15
- main {
16
- background: linear-gradient(to top, var(--body-bg-shadow) 0, var(--grey-1) 20%) no-repeat bottom;
17
-
18
- >.inner {
19
- width: $content-desktop;
20
- align-items: flex-start;
21
- display: flex;
22
- justify-content: space-between;
23
- if (hexo-config('sidebar.position') == 'left') {
24
- flex-direction: row-reverse;
25
- }
26
-
27
- +desktop-large() {
28
- width: $content-desktop-large;
29
- }
30
-
31
- +desktop-largest() {
32
- width: $content-desktop-largest;
33
- }
34
- }
35
-
36
- }
37
-
38
- #main {
39
- background: linear-gradient(to top, var(--grey-0) 0, var(--grey-1) 20%) no-repeat top;
40
- box-shadow: 0 1.25rem 1rem .3125rem var(--body-bg-shadow);
41
-
42
- width: $content-wrap;
43
-
44
- min-height: 37.5rem;
45
-
46
- .cat {
47
- margin-top: 10rem;
48
- }
49
-
50
- .wrap {
51
- position: relative;
52
- padding: $content-desktop-padding;
53
- }
54
-
55
- .wrap:nth-child(1) {
56
- margin-bottom: 1.25rem;
57
- }
58
-
59
- +tablet-mobile() {
60
- width: 100%;
61
-
62
- .wrap {
63
- padding: $content-tablet-padding;
64
- }
65
- }
66
-
67
- +mobile() {
68
- .wrap {
69
- padding: $content-mobile-padding;
70
- }
71
- }
72
- }
73
-
74
- @import 'header';
75
- @import 'sidebar';
76
- @import 'footer';
77
-
78
- @import 'mobile';
1
+ #container {
2
+ min-height: 100%;
3
+ min-width: 100%;
4
+ position: relative;
5
+ display: flex;
6
+ flex-direction: column;
7
+ }
8
+
9
+
10
+ .inner {
11
+ margin: 0 auto;
12
+ width: 100%;
13
+ }
14
+
15
+ main {
16
+ background: linear-gradient(to top, var(--body-bg-shadow) 0, var(--grey-1) 20%) no-repeat bottom;
17
+
18
+ >.inner {
19
+ width: $content-desktop;
20
+ align-items: flex-start;
21
+ display: flex;
22
+ justify-content: space-between;
23
+ if (hexo-config('sidebar.position') == 'left') {
24
+ flex-direction: row-reverse;
25
+ }
26
+
27
+ +desktop-large() {
28
+ width: $content-desktop-large;
29
+ }
30
+
31
+ +desktop-largest() {
32
+ width: $content-desktop-largest;
33
+ }
34
+ }
35
+
36
+ }
37
+
38
+ #main {
39
+ background: linear-gradient(to top, var(--grey-0) 0, var(--grey-1) 20%) no-repeat top;
40
+ box-shadow: 0 1.25rem 1rem .3125rem var(--body-bg-shadow);
41
+
42
+ width: $content-wrap;
43
+
44
+ min-height: 37.5rem;
45
+
46
+ .cat {
47
+ margin-top: 10rem;
48
+ }
49
+
50
+ .wrap {
51
+ position: relative;
52
+ padding: $content-desktop-padding;
53
+ }
54
+
55
+ .wrap:nth-child(1) {
56
+ margin-bottom: 1.25rem;
57
+ }
58
+
59
+ +tablet-mobile() {
60
+ width: 100%;
61
+
62
+ .wrap {
63
+ padding: $content-tablet-padding;
64
+ }
65
+ }
66
+
67
+ +mobile() {
68
+ .wrap {
69
+ padding: $content-mobile-padding;
70
+ }
71
+ }
72
+ }
73
+
74
+ @import 'header';
75
+ @import 'sidebar';
76
+ @import 'footer';
77
+
78
+ @import 'mobile';
@@ -1,59 +1,59 @@
1
- .overview .author {
2
-
3
- &:hover .image {
4
- @extend .shake;
5
- }
6
-
7
- .image {
8
- border: .0625rem solid var(--body-bg-shadow);
9
- display: block;
10
- margin: 0 auto;
11
- max-width: 10rem;
12
- padding: .125rem;
13
- box-shadow: 0 0 1rem .625rem var(--body-bg-shadow);
14
- border-radius: 50%;
15
- }
16
-
17
-
18
- .name {
19
- color: var(--grey-7);
20
- font-weight: normal;
21
- margin: .3125rem 0 0;
22
- text-align: center;
23
- }
24
-
25
- .description {
26
- color: var(--grey-5);
27
- font-size: $font-size-medium;
28
- margin-top: .3125rem;
29
- text-align: center;
30
- }
31
- }
32
-
33
- @keyframes shake {
34
- 0% {
35
- transform: scale(1);
36
- }
37
-
38
- 10%,
39
- 20% {
40
- transform: scale(.9) rotate(3deg);
41
- }
42
-
43
- 30%,
44
- 50%,
45
- 70%,
46
- 90% {
47
- transform: scale(1.1) rotate(-3deg);
48
- }
49
-
50
- 40%,
51
- 60%,
52
- 80% {
53
- transform: scale(1.1) rotate(3deg);
54
- }
55
-
56
- 100% {
57
- transform: scale(1);
58
- }
59
- }
1
+ .overview .author {
2
+
3
+ &:hover .image {
4
+ @extend .shake;
5
+ }
6
+
7
+ .image {
8
+ border: .0625rem solid var(--body-bg-shadow);
9
+ display: block;
10
+ margin: 0 auto;
11
+ max-width: 10rem;
12
+ padding: .125rem;
13
+ box-shadow: 0 0 1rem .625rem var(--body-bg-shadow);
14
+ border-radius: 50%;
15
+ }
16
+
17
+
18
+ .name {
19
+ color: var(--grey-7);
20
+ font-weight: normal;
21
+ margin: .3125rem 0 0;
22
+ text-align: center;
23
+ }
24
+
25
+ .description {
26
+ color: var(--grey-5);
27
+ font-size: $font-size-medium;
28
+ margin-top: .3125rem;
29
+ text-align: center;
30
+ }
31
+ }
32
+
33
+ @keyframes shake {
34
+ 0% {
35
+ transform: scale(1);
36
+ }
37
+
38
+ 10%,
39
+ 20% {
40
+ transform: scale(.9) rotate(3deg);
41
+ }
42
+
43
+ 30%,
44
+ 50%,
45
+ 70%,
46
+ 90% {
47
+ transform: scale(1.1) rotate(-3deg);
48
+ }
49
+
50
+ 40%,
51
+ 60%,
52
+ 80% {
53
+ transform: scale(1.1) rotate(3deg);
54
+ }
55
+
56
+ 100% {
57
+ transform: scale(1);
58
+ }
59
+ }
@@ -1,23 +1,23 @@
1
- .dimmer {
2
- display: none;
3
- }
4
-
5
- +tablet-mobile() {
6
- .dimmer {
7
- background: black;
8
- height: 100%;
9
- left: 100%;
10
- opacity: 0;
11
- top: 0;
12
- width: 100%;
13
- z-index: $zindex-2;
14
- transition: opacity 1s;
15
- }
16
-
17
- #sidebar.on + .dimmer {
18
- position: fixed;
19
- display: block;
20
- opacity: .3;
21
- transform: translateX(-100%);
22
- }
23
- }
1
+ .dimmer {
2
+ display: none;
3
+ }
4
+
5
+ +tablet-mobile() {
6
+ .dimmer {
7
+ background: black;
8
+ height: 100%;
9
+ left: 100%;
10
+ opacity: 0;
11
+ top: 0;
12
+ width: 100%;
13
+ z-index: $zindex-2;
14
+ transition: opacity 1s;
15
+ }
16
+
17
+ #sidebar.on + .dimmer {
18
+ position: fixed;
19
+ display: block;
20
+ opacity: .3;
21
+ transform: translateX(-100%);
22
+ }
23
+ }
@@ -1,63 +1,63 @@
1
- .overview .menu {
2
- padding: 1.25rem;
3
- margin: 0;
4
-
5
- background-color: transparent;
6
-
7
- .item {
8
- border-radius: .9375rem;
9
- margin-bottom: .625rem;
10
- display: block;
11
- color: var(--grey-5);
12
- the-transition();
13
-
14
- a {
15
- color: inherit;
16
- display: block;
17
- line-height: 3;
18
- }
19
-
20
- .submenu {
21
- display: none;
22
- padding: 0;
23
- @extend .slide-down-in;
24
- }
25
-
26
- &:hover {
27
- background-color: rgba(0,0,0,.1);
28
- color: inherit;
29
-
30
- .submenu {
31
- display: block;
32
- }
33
- }
34
-
35
- .ic {
36
- margin-right: .625rem;
37
- }
38
-
39
- &.active {
40
- @extend $color-btn;
41
-
42
- &:hover {
43
- box-shadow: 0 0 .75rem var(--color-pink);
44
- color: var(--grey-0);
45
- }
46
-
47
- .item {
48
- color: currentColor;
49
- }
50
- }
51
-
52
-
53
- &.expand {
54
- background-color: rgba(0,0,0,.05);
55
-
56
- .submenu {
57
- display: block;
58
- }
59
-
60
- }
61
-
62
- }
63
- }
1
+ .overview .menu {
2
+ padding: 1.25rem;
3
+ margin: 0;
4
+
5
+ background-color: transparent;
6
+
7
+ .item {
8
+ border-radius: .9375rem;
9
+ margin-bottom: .625rem;
10
+ display: block;
11
+ color: var(--grey-5);
12
+ the-transition();
13
+
14
+ a {
15
+ color: inherit;
16
+ display: block;
17
+ line-height: 3;
18
+ }
19
+
20
+ .submenu {
21
+ display: none;
22
+ padding: 0;
23
+ @extend .slide-down-in;
24
+ }
25
+
26
+ &:hover {
27
+ background-color: rgba(0,0,0,.1);
28
+ color: inherit;
29
+
30
+ .submenu {
31
+ display: block;
32
+ }
33
+ }
34
+
35
+ .ic {
36
+ margin-right: .625rem;
37
+ }
38
+
39
+ &.active {
40
+ @extend $color-btn;
41
+
42
+ &:hover {
43
+ box-shadow: 0 0 .75rem var(--color-pink);
44
+ color: var(--grey-0);
45
+ }
46
+
47
+ .item {
48
+ color: currentColor;
49
+ }
50
+ }
51
+
52
+
53
+ &.expand {
54
+ background-color: rgba(0,0,0,.05);
55
+
56
+ .submenu {
57
+ display: block;
58
+ }
59
+
60
+ }
61
+
62
+ }
63
+ }
@@ -1,43 +1,43 @@
1
- #quick {
2
- display: none;
3
- align-items: center;
4
- flex-wrap: wrap;
5
- width: $sidebar-desktop;
6
- margin: 0;
7
- padding: 0;
8
- position: fixed;
9
- bottom: .125rem;
10
-
11
- li {
12
- width: 25%;
13
- min-height: 1.875rem;
14
- the-transition();
15
-
16
- i {
17
- cursor: pointer;
18
- }
19
-
20
- a {
21
- width: 100%;
22
- display: block;
23
- }
24
-
25
- &:hover {
26
- color: var(--primary-color);
27
- }
28
- }
29
-
30
- li.percent {
31
- display: block;
32
- background: var(--primary-color);
33
- width: 0;
34
- min-height: .125rem;
35
- }
36
- }
37
-
38
- #sidebar.affix, #sidebar.on {
39
- #quick {
40
- display: flex;
41
- }
42
- }
43
-
1
+ #quick {
2
+ display: none;
3
+ align-items: center;
4
+ flex-wrap: wrap;
5
+ width: $sidebar-desktop;
6
+ margin: 0;
7
+ padding: 0;
8
+ position: fixed;
9
+ bottom: .125rem;
10
+
11
+ li {
12
+ width: 25%;
13
+ min-height: 1.875rem;
14
+ the-transition();
15
+
16
+ i {
17
+ cursor: pointer;
18
+ }
19
+
20
+ a {
21
+ width: 100%;
22
+ display: block;
23
+ }
24
+
25
+ &:hover {
26
+ color: var(--primary-color);
27
+ }
28
+ }
29
+
30
+ li.percent {
31
+ display: block;
32
+ background: var(--primary-color);
33
+ width: 0;
34
+ min-height: .125rem;
35
+ }
36
+ }
37
+
38
+ #sidebar.affix, #sidebar.on {
39
+ #quick {
40
+ display: flex;
41
+ }
42
+ }
43
+
@@ -1,56 +1,56 @@
1
- .related {
2
- font-size: $font-size-small;
3
-
4
- ul {
5
-
6
- padding: 0 .125rem .3125rem 1.25rem;
7
- text-align: left;
8
-
9
- li {
10
- position: relative;
11
- line-height: 1.8;
12
- padding-bottom: .625rem;
13
-
14
- a {
15
- text-overflow: ellipsis;
16
- white-space: nowrap;
17
- overflow: hidden;
18
- width: 100%;
19
- display: inline-block;
20
- }
21
-
22
- &.active a {
23
- color: var(--primary-color);
24
- }
25
-
26
- &::before {
27
- content: "";
28
- width: .5rem;
29
- height: .5rem;
30
- background: var(--primary-color);
31
- box-sizing: unset;
32
- left: -1.25rem;
33
- top: .3125rem;
34
- border-radius: 100%;
35
- position: absolute;
36
- border: .1875rem solid var(--grey-1);
37
- z-index: $zindex-1;
38
- the-transition();
39
- }
40
-
41
- &:hover::before {
42
- background: var(--color-blue);
43
- }
44
-
45
- &:not(:last-child)::after {
46
- content: "";
47
- height: 100%;
48
- width: .125rem;
49
- background: var(--color-red-a3);
50
- position: absolute;
51
- left: -.875rem;
52
- top: .5rem;
53
- }
54
- }
55
- }
56
- }
1
+ .related {
2
+ font-size: $font-size-small;
3
+
4
+ ul {
5
+
6
+ padding: 0 .125rem .3125rem 1.25rem;
7
+ text-align: left;
8
+
9
+ li {
10
+ position: relative;
11
+ line-height: 1.8;
12
+ padding-bottom: .625rem;
13
+
14
+ a {
15
+ text-overflow: ellipsis;
16
+ white-space: nowrap;
17
+ overflow: hidden;
18
+ width: 100%;
19
+ display: inline-block;
20
+ }
21
+
22
+ &.active a {
23
+ color: var(--primary-color);
24
+ }
25
+
26
+ &::before {
27
+ content: "";
28
+ width: .5rem;
29
+ height: .5rem;
30
+ background: var(--primary-color);
31
+ box-sizing: unset;
32
+ left: -1.25rem;
33
+ top: .3125rem;
34
+ border-radius: 100%;
35
+ position: absolute;
36
+ border: .1875rem solid var(--grey-1);
37
+ z-index: $zindex-1;
38
+ the-transition();
39
+ }
40
+
41
+ &:hover::before {
42
+ background: var(--color-blue);
43
+ }
44
+
45
+ &:not(:last-child)::after {
46
+ content: "";
47
+ height: 100%;
48
+ width: .125rem;
49
+ background: var(--color-red-a3);
50
+ position: absolute;
51
+ left: -.875rem;
52
+ top: .5rem;
53
+ }
54
+ }
55
+ }
56
+ }