@smwb/ui-css 1.0.0 → 1.0.1
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/dist/ui.css +57 -7
- package/package.json +8 -2
package/dist/ui.css
CHANGED
|
@@ -4019,7 +4019,7 @@
|
|
|
4019
4019
|
outline-offset: 2px;
|
|
4020
4020
|
}
|
|
4021
4021
|
.smwb-carousel {
|
|
4022
|
-
max-width: 412px;
|
|
4022
|
+
max-width: var(--smwb-carousel-max-width, 412px);
|
|
4023
4023
|
}
|
|
4024
4024
|
.smwb-carousel__inner {
|
|
4025
4025
|
position: relative;
|
|
@@ -4028,8 +4028,8 @@
|
|
|
4028
4028
|
text-align: center;
|
|
4029
4029
|
overflow: hidden;
|
|
4030
4030
|
cursor: pointer;
|
|
4031
|
-
margin-left: -4px;
|
|
4032
|
-
margin-right: -4px;
|
|
4031
|
+
margin-left: calc(-1 * var(--smwb-carousel-gap, 4px));
|
|
4032
|
+
margin-right: calc(-1 * var(--smwb-carousel-gap, 4px));
|
|
4033
4033
|
touch-action: pan-y;
|
|
4034
4034
|
}
|
|
4035
4035
|
.smwb-carousel__layer {
|
|
@@ -4040,20 +4040,24 @@
|
|
|
4040
4040
|
}
|
|
4041
4041
|
.smwb-carousel__slide {
|
|
4042
4042
|
flex-shrink: 0;
|
|
4043
|
-
padding-left: 4px;
|
|
4044
|
-
padding-right: 4px;
|
|
4043
|
+
padding-left: var(--smwb-carousel-gap, 4px);
|
|
4044
|
+
padding-right: var(--smwb-carousel-gap, 4px);
|
|
4045
4045
|
}
|
|
4046
4046
|
.smwb-carousel__slide-inner {
|
|
4047
4047
|
border-radius: 28px;
|
|
4048
4048
|
overflow: hidden;
|
|
4049
4049
|
will-change: width;
|
|
4050
4050
|
}
|
|
4051
|
+
.smwb-carousel__slide-inner_clickable {
|
|
4052
|
+
cursor: zoom-in;
|
|
4053
|
+
}
|
|
4051
4054
|
.smwb-carousel__slide-inner img {
|
|
4052
|
-
height: 205px;
|
|
4053
|
-
aspect-ratio: 0.9;
|
|
4055
|
+
height: var(--smwb-carousel-cell-height, 205px);
|
|
4056
|
+
aspect-ratio: var(--smwb-carousel-aspect-ratio, 0.9);
|
|
4054
4057
|
object-fit: cover;
|
|
4055
4058
|
width: 100%;
|
|
4056
4059
|
user-select: none;
|
|
4060
|
+
-webkit-user-drag: none;
|
|
4057
4061
|
}
|
|
4058
4062
|
.smwb-carousel__navigation {
|
|
4059
4063
|
display: flex;
|
|
@@ -4080,6 +4084,52 @@
|
|
|
4080
4084
|
align-items: center;
|
|
4081
4085
|
justify-content: center;
|
|
4082
4086
|
}
|
|
4087
|
+
.smwb-carousel__fullscreen-content {
|
|
4088
|
+
position: relative;
|
|
4089
|
+
width: 100%;
|
|
4090
|
+
height: 100%;
|
|
4091
|
+
display: flex;
|
|
4092
|
+
align-items: center;
|
|
4093
|
+
justify-content: center;
|
|
4094
|
+
}
|
|
4095
|
+
.smwb-carousel__fullscreen-stage {
|
|
4096
|
+
display: flex;
|
|
4097
|
+
align-items: center;
|
|
4098
|
+
justify-content: center;
|
|
4099
|
+
max-width: 100%;
|
|
4100
|
+
max-height: 100%;
|
|
4101
|
+
}
|
|
4102
|
+
.smwb-carousel__fullscreen-stage img {
|
|
4103
|
+
max-width: 96vw;
|
|
4104
|
+
max-height: 92vh;
|
|
4105
|
+
width: auto;
|
|
4106
|
+
height: auto;
|
|
4107
|
+
object-fit: contain;
|
|
4108
|
+
user-select: none;
|
|
4109
|
+
-webkit-user-drag: none;
|
|
4110
|
+
}
|
|
4111
|
+
.smwb-carousel__fullscreen-arrow,
|
|
4112
|
+
.smwb-carousel__fullscreen-close {
|
|
4113
|
+
position: absolute;
|
|
4114
|
+
z-index: 1;
|
|
4115
|
+
cursor: pointer;
|
|
4116
|
+
color: #fff;
|
|
4117
|
+
filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.6));
|
|
4118
|
+
}
|
|
4119
|
+
.smwb-carousel__fullscreen-arrow {
|
|
4120
|
+
top: 50%;
|
|
4121
|
+
transform: translateY(-50%);
|
|
4122
|
+
}
|
|
4123
|
+
.smwb-carousel__fullscreen-arrow_prev {
|
|
4124
|
+
left: 16px;
|
|
4125
|
+
}
|
|
4126
|
+
.smwb-carousel__fullscreen-arrow_next {
|
|
4127
|
+
right: 16px;
|
|
4128
|
+
}
|
|
4129
|
+
.smwb-carousel__fullscreen-close {
|
|
4130
|
+
top: 16px;
|
|
4131
|
+
right: 16px;
|
|
4132
|
+
}
|
|
4083
4133
|
.smwb-accordion {
|
|
4084
4134
|
display: flex;
|
|
4085
4135
|
flex-direction: column;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@smwb/ui-css",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.1",
|
|
4
4
|
"description": "Prebuilt aggregate stylesheet for the @smwb design system (compiled from @smwb/ui-styles). Framework-agnostic — shared by the React and SolidJS libraries.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"sideEffects": [
|
|
@@ -19,7 +19,13 @@
|
|
|
19
19
|
"build": "lessc -rp=/ ../styles/less/components.less ./dist/ui.css"
|
|
20
20
|
},
|
|
21
21
|
"devDependencies": {
|
|
22
|
-
"@smwb/ui-styles": "^1.0.
|
|
22
|
+
"@smwb/ui-styles": "^1.0.2",
|
|
23
23
|
"less": "^4.6.4"
|
|
24
|
+
},
|
|
25
|
+
"homepage": "https://sourcecraft.dev/elfenmail/ui",
|
|
26
|
+
"repository": {
|
|
27
|
+
"type": "git",
|
|
28
|
+
"url": "git+https://git.sourcecraft.dev/elfenmail/ui.git",
|
|
29
|
+
"directory": "packages/ui-css"
|
|
24
30
|
}
|
|
25
31
|
}
|