@meduza/ui-kit-2 0.1.22 → 0.1.24

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "0.1.22",
2
+ "version": "0.1.24",
3
3
  "license": "MIT",
4
4
  "description": "UIKit for Meduza",
5
5
  "repository": "https://github.com/meduza-corp/ui-kit-2.git",
@@ -1,22 +1,45 @@
1
1
  @import '../vars.css';
2
2
 
3
3
  .root {
4
+ position: relative;
5
+
4
6
  width: 100%;
5
7
  margin: $gapMedium 0;
6
- padding: 21px 0 22px;
7
-
8
- border-top: 3px solid rgba(0, 0, 0, 0.1);
9
- border-bottom: 3px solid rgba(0, 0, 0, 0.1);
8
+ padding: 24px 0 25px;
10
9
 
11
10
  @media $mobile {
12
11
  display: flex;
13
12
  flex-flow: column nowrap;
14
13
 
15
14
  margin: 25px auto 20px;
16
- padding: 20px 0;
15
+ padding: 23px 0;
17
16
  }
18
17
  }
19
18
 
19
+ .root::before,
20
+ .root::after {
21
+ position: absolute;
22
+ z-index: 10;
23
+ left: 50%;
24
+
25
+ width: 100%;
26
+ max-width: 650px;
27
+ margin: 0 auto;
28
+
29
+ content: '';
30
+ transform: translateX(-50%);
31
+
32
+ border-top: 3px solid rgba(0, 0, 0, 0.1);
33
+ }
34
+
35
+ .root::before {
36
+ top: 0;
37
+ }
38
+
39
+ .root::after {
40
+ bottom: 0;
41
+ }
42
+
20
43
  .root:last-child {
21
44
  margin-bottom: 0;
22
45
  }
@@ -57,7 +80,6 @@
57
80
  display: none;
58
81
 
59
82
  width: 100%;
60
-
61
83
  padding-bottom: 13px;
62
84
 
63
85
  @media $mobile {
@@ -94,17 +116,23 @@
94
116
  z-index: 10;
95
117
  bottom: 0;
96
118
 
119
+ width: auto;
97
120
  margin-right: -20px;
98
121
  margin-left: -20px;
99
122
  padding: 12px 20px 20px;
100
123
 
101
124
  animation: spoilerSticky 500ms ease both;
102
125
 
103
- background-image: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #fff 64%);
126
+ background-image: linear-gradient(
127
+ 180deg,
128
+ rgba(255, 255, 255, 0) 0%,
129
+ #fff 64%
130
+ );
104
131
 
105
132
  @media $mobile {
106
133
  position: static;
107
134
 
135
+ width: 100%;
108
136
  margin-right: auto;
109
137
  margin-left: auto;
110
138
  padding: 0;