krl-alfred 2.17.23 → 2.17.25
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/components/BlogCard/BlogCard.js +1 -1
- package/dist/components/StepSlider/StepSlider.js +15 -1
- package/dist/components/StepSlider/StepSlider.styled.js +2 -2
- package/dist/components/VideoCard/stories/VideoCard.stories.js +1 -1
- package/dist/hooks/useVideoPlayer.js +0 -4
- package/package.json +1 -1
|
@@ -16,6 +16,6 @@ var props_1 = require("./props");
|
|
|
16
16
|
var BlogCard_styled_1 = require("./BlogCard.styled");
|
|
17
17
|
var BlogCard = function (props) {
|
|
18
18
|
var _a = props.authorTitle, authorTitle = _a === void 0 ? props_1.BlogCardDefault.authorTitle : _a, _b = props.authorImg, authorImg = _b === void 0 ? props_1.BlogCardDefault.authorImg : _b, _c = props.contentImg, contentImg = _c === void 0 ? props_1.BlogCardDefault.contentImg : _c, _d = props.tags, tags = _d === void 0 ? props_1.BlogCardDefault.tags : _d, _e = props.date, date = _e === void 0 ? props_1.BlogCardDefault.date : _e, _f = props.contentTitle, contentTitle = _f === void 0 ? props_1.BlogCardDefault.contentTitle : _f, _g = props.contentDesc, contentDesc = _g === void 0 ? props_1.BlogCardDefault.contentDesc : _g, _h = props.direction, direction = _h === void 0 ? props_1.BlogCardDefault.direction : _h, _j = props.size, size = _j === void 0 ? props_1.BlogCardDefault.size : _j;
|
|
19
|
-
return ((0, jsx_runtime_1.jsxs)(BlogCard_styled_1.BlogCardStyled, __assign({ "$direction": direction, "$size": size }, { children: [(0, jsx_runtime_1.jsxs)("div", __assign({ className: "author" }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ className: "img" }, { children: authorImg })), (0, jsx_runtime_1.jsx)("strong", __assign({ className: "title" }, { children: authorTitle }))] })), (0, jsx_runtime_1.jsxs)("div", __assign({ className: "content" }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ className: "contentImg" }, { children: contentImg })), (0, jsx_runtime_1.jsxs)("div", __assign({ className: "contentBottom" }, { children: [(0, jsx_runtime_1.jsxs)("div", __assign({ className: "tagWrapper" }, { children: [(0, jsx_runtime_1.jsx)("span", __assign({ className: "tags" }, { children: tags })), (0, jsx_runtime_1.jsx)("span", __assign({ className: "date" }, { children: date }))] })), (0, jsx_runtime_1.jsx)("strong",
|
|
19
|
+
return ((0, jsx_runtime_1.jsxs)(BlogCard_styled_1.BlogCardStyled, __assign({ "$direction": direction, "$size": size }, { children: [(0, jsx_runtime_1.jsxs)("div", __assign({ className: "author" }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ className: "img" }, { children: authorImg })), (0, jsx_runtime_1.jsx)("strong", __assign({ className: "title" }, { children: authorTitle }))] })), (0, jsx_runtime_1.jsxs)("div", __assign({ className: "content" }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ className: "contentImg" }, { children: contentImg })), (0, jsx_runtime_1.jsxs)("div", __assign({ className: "contentBottom" }, { children: [(0, jsx_runtime_1.jsxs)("div", __assign({ className: "tagWrapper" }, { children: [(0, jsx_runtime_1.jsx)("span", __assign({ className: "tags" }, { children: tags })), (0, jsx_runtime_1.jsx)("span", __assign({ className: "date" }, { children: date }))] })), (0, jsx_runtime_1.jsx)("strong", { className: "contentTitle", dangerouslySetInnerHTML: { __html: contentTitle } }), (0, jsx_runtime_1.jsx)("p", __assign({ className: "contentDesc" }, { children: contentDesc }))] }))] }))] })));
|
|
20
20
|
};
|
|
21
21
|
exports.default = BlogCard;
|
|
@@ -28,8 +28,22 @@ var StepSlider = function (_a) {
|
|
|
28
28
|
var selectedOptionElement = stepsWrapper.children[selectedIndex];
|
|
29
29
|
if (selectedOptionElement) {
|
|
30
30
|
// Step'in sol pozisyonunu al ve indicator'ı oraya yerleştir
|
|
31
|
+
var stepHalfWidth = selectedOptionElement.offsetWidth / 2;
|
|
32
|
+
var indicatorLeft = void 0;
|
|
33
|
+
if (selectedIndex === 0) {
|
|
34
|
+
// İlk step için özel pozisyon
|
|
35
|
+
indicatorLeft = selectedOptionElement.offsetLeft + 22; // İlk step pozisyonu
|
|
36
|
+
}
|
|
37
|
+
else if (selectedIndex === options.length - 1) {
|
|
38
|
+
// Son step için özel pozisyon
|
|
39
|
+
indicatorLeft = selectedOptionElement.offsetLeft + selectedOptionElement.offsetWidth - 7; // Son step pozisyonu
|
|
40
|
+
}
|
|
41
|
+
else {
|
|
42
|
+
// Diğer step'ler için mevcut pozisyon
|
|
43
|
+
indicatorLeft = selectedOptionElement.offsetLeft + stepHalfWidth + 7;
|
|
44
|
+
}
|
|
31
45
|
setIndicatorStyle({
|
|
32
|
-
left: "".concat(
|
|
46
|
+
left: "".concat(indicatorLeft, "px"),
|
|
33
47
|
});
|
|
34
48
|
}
|
|
35
49
|
}
|
|
@@ -11,7 +11,7 @@ exports.StepOptionStyled = exports.IndicatorStyled = exports.StepsWrapper = expo
|
|
|
11
11
|
var styled_components_1 = __importDefault(require("styled-components"));
|
|
12
12
|
exports.Container = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n .top {\n display: flex;\n margin-bottom: 1rem;\n font: var(--caption-bold-12-15);\n\n &.justify-between {\n justify-content: space-between;\n }\n\n label {\n margin: 0;\n color: var(--dark-opacity-50);\n display: block;\n }\n }\n"], ["\n .top {\n display: flex;\n margin-bottom: 1rem;\n font: var(--caption-bold-12-15);\n\n &.justify-between {\n justify-content: space-between;\n }\n\n label {\n margin: 0;\n color: var(--dark-opacity-50);\n display: block;\n }\n }\n"])));
|
|
13
13
|
exports.StepSliderStyled = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n position: relative;\n background-color: white;\n border-radius: 0.5rem;\n border: 1px solid var(--grey-10);\n height: 48px;\n padding: 0 1.5rem;\n box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n margin-bottom: 0.5rem;\n"], ["\n position: relative;\n background-color: white;\n border-radius: 0.5rem;\n border: 1px solid var(--grey-10);\n height: 48px;\n padding: 0 1.5rem;\n box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n margin-bottom: 0.5rem;\n"])));
|
|
14
|
-
exports.StepsWrapper = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display:
|
|
14
|
+
exports.StepsWrapper = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(20px, 1fr));\n justify-content: space-between;\n align-items: center;\n height: 100%;\n position: relative;\n z-index: 1;\n pointer-events: none;\n"], ["\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(20px, 1fr));\n justify-content: space-between;\n align-items: center;\n height: 100%;\n position: relative;\n z-index: 1;\n pointer-events: none;\n"])));
|
|
15
15
|
exports.IndicatorStyled = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n position: absolute;\n top: 50%;\n transform: translateY(-50%) translateX(-16px);\n background-color: white;\n border-radius: 6px;\n transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);\n z-index: 0;\n width: 64px !important;\n height: 64px;\n box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n"], ["\n position: absolute;\n top: 50%;\n transform: translateY(-50%) translateX(-16px);\n background-color: white;\n border-radius: 6px;\n transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);\n z-index: 0;\n width: 64px !important;\n height: 64px;\n box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n"])));
|
|
16
|
-
exports.StepOptionStyled = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n text-align: center;\n padding:
|
|
16
|
+
exports.StepOptionStyled = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n text-align: center;\n display: flex;\n justify-content: center;\n padding: 0 0;\n border-radius: 6px;\n cursor: pointer;\n color: var(--grey-50);\n background-color: transparent;\n transition: color 0.3s ease;\n z-index: 1;\n font: var(--body-semi-bold-14-17);\n min-width: 34px;\n user-select: ", ";\n pointer-events: ", ";\n &:hover {\n color: var(--dark);\n }\n span {\n display: block;\n text-align: center;\n font: var(--body-semi-bold-14-17);\n color: var(--grey-50);\n b {\n display: block;\n font: var(--headline-extra-bold-18-22);\n color: var(--dark);\n }\n }\n &:first-child {\n justify-content: start;\n }\n &:last-child {\n justify-content: end;\n }\n"], ["\n text-align: center;\n display: flex;\n justify-content: center;\n padding: 0 0;\n border-radius: 6px;\n cursor: pointer;\n color: var(--grey-50);\n background-color: transparent;\n transition: color 0.3s ease;\n z-index: 1;\n font: var(--body-semi-bold-14-17);\n min-width: 34px;\n user-select: ", ";\n pointer-events: ", ";\n &:hover {\n color: var(--dark);\n }\n span {\n display: block;\n text-align: center;\n font: var(--body-semi-bold-14-17);\n color: var(--grey-50);\n b {\n display: block;\n font: var(--headline-extra-bold-18-22);\n color: var(--dark);\n }\n }\n &:first-child {\n justify-content: start;\n }\n &:last-child {\n justify-content: end;\n }\n"])), function (props) { return props.isActive ? 'none' : 'auto'; }, function (props) { return props.isActive ? 'none' : 'auto'; });
|
|
17
17
|
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
|
|
@@ -27,6 +27,6 @@ exports.Default = {
|
|
|
27
27
|
args: {
|
|
28
28
|
poster: "https://www.kiralarsin.com/Banners/kiralama-uzatmain-new.svg",
|
|
29
29
|
title: "Buharlı temizlik makinesini kullanmaya emin olamıyordum. ",
|
|
30
|
-
videoUrl: "https://
|
|
30
|
+
videoUrl: "https://kiralarsin.s3.eu-central-1.amazonaws.com/video/bugu%CC%88n-kiralarsin-dan-kiraladig%CC%86im-insta360-ile-keyifli-bi-motosiklet-gezisi-yaptim.mp4"
|
|
31
31
|
},
|
|
32
32
|
};
|