@licklist/design 0.58.3-dev.0 → 0.58.3-dev.2
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/iframe/event/event-card/IframeEventCard.d.ts +2 -1
- package/dist/iframe/event/event-card/IframeEventCard.d.ts.map +1 -1
- package/dist/iframe/event/event-card/IframeEventCard.js +1 -1
- package/dist/iframe/page/components/PageBody/components/LeftBlock/LeftBlock.d.ts.map +1 -1
- package/dist/iframe/page/components/PageBody/components/LeftBlock/LeftBlock.js +1 -1
- package/dist/styles/iframe-events/Card.scss +19 -6
- package/dist/styles/iframe-page/Page.scss +1 -0
- package/dist/styles/iframe-page/PageBody.scss +5 -4
- package/package.json +1 -1
- package/src/iframe/event/event-card/IframeEventCard.stories.tsx +1 -0
- package/src/iframe/event/event-card/IframeEventCard.tsx +3 -0
- package/src/iframe/page/components/PageBody/components/LeftBlock/LeftBlock.tsx +3 -1
- package/src/styles/iframe-events/Card.scss +19 -6
- package/src/styles/iframe-page/Page.scss +1 -0
- package/src/styles/iframe-page/PageBody.scss +5 -4
|
@@ -16,7 +16,8 @@ interface IframeEventCardProps {
|
|
|
16
16
|
titleId?: string;
|
|
17
17
|
descriptionId?: string;
|
|
18
18
|
imageClassName?: string;
|
|
19
|
+
showMoreInfo?: boolean;
|
|
19
20
|
}
|
|
20
|
-
export declare function IframeEventCard({ title, type, cost, date, imageSrc, colour, goToDetails, description, isListView, className, shortDate, titleId, descriptionId, imageClassName, }: IframeEventCardProps): JSX.Element;
|
|
21
|
+
export declare function IframeEventCard({ title, type, cost, date, imageSrc, colour, goToDetails, description, isListView, className, shortDate, titleId, descriptionId, imageClassName, showMoreInfo, }: IframeEventCardProps): JSX.Element;
|
|
21
22
|
export {};
|
|
22
23
|
//# sourceMappingURL=IframeEventCard.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IframeEventCard.d.ts","sourceRoot":"","sources":["../../../../src/iframe/event/event-card/IframeEventCard.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAE,OAAO,EAAE,MAAM,2DAA2D,CAAC;AASpF,UAAU,oBAAoB;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,cAAc,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;IAC1C,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,cAAc,CAAC,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"IframeEventCard.d.ts","sourceRoot":"","sources":["../../../../src/iframe/event/event-card/IframeEventCard.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAE,OAAO,EAAE,MAAM,2DAA2D,CAAC;AASpF,UAAU,oBAAoB;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,cAAc,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;IAC1C,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,wBAAgB,eAAe,CAAC,EAC9B,KAAK,EACL,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,QAAQ,EACR,MAAM,EACN,WAAW,EACX,WAAW,EACX,UAAkB,EAClB,SAAS,EACT,SAAS,EACT,OAAO,EACP,aAAa,EACb,cAAc,EACd,YAAY,GACb,EAAE,oBAAoB,eA8FtB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=e(require("react")),a=require("react-i18next"),r=require("react-bootstrap"),i=e(require("clsx")),c=require("react-intl"),
|
|
1
|
+
"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=e(require("react")),a=require("react-i18next"),r=require("react-bootstrap"),i=e(require("clsx")),c=require("react-intl"),s=require("../../../tiptap-editor/TipTapEditor.js"),l=require("../../../events/event-card/utils.js"),n=require("../../../assets/iframe/clock.svg.js"),m=require("../../../assets/iframe/calendar.svg.js"),d=require("../../../assets/iframe/ticket.svg.js");exports.IframeEventCard=function(e){var o=e.title,v=e.type,u=e.cost,f=e.date,p=e.imageSrc,E=e.colour,N=e.goToDetails,g=e.description,_=e.isListView,C=void 0!==_&&_,b=e.className,x=e.shortDate,w=e.titleId,T=e.descriptionId,q=e.imageClassName,y=e.showMoreInfo,j=c.useIntl().formatNumber,I=a.useTranslation("Design").t;return t.createElement(r.Card,{style:{"--card-colour":E},className:i("iframe-event-card",{"list-view":C},b),onClick:N?function(){N&&N()}:void 0},y&&t.createElement("div",{className:"iframe-event-card__info-icon"},"i"),p&&t.createElement(r.Card.Img,{className:null!=q?q:"card-image",variant:"top",as:"div",style:{backgroundImage:'url("'.concat(p,'")')}}),t.createElement(r.Card.Body,{className:i("d-flex","flex-column",!p&&"no-image")},t.createElement(r.Card.Title,{className:"iframe-event-card__title",id:w},o),t.createElement("div",{className:"flex-grow-1 iframe-event-card__description"},t.createElement(r.Card.Text,{as:"div"},t.createElement("div",{className:"d-flex align-items-center mb-3"},t.createElement("div",{className:"icon-wrapper"},t.createElement(m.ReactComponent,null)),t.createElement("p",{className:"iframe-event-card__bold m-0 list-view-hided"},f),t.createElement("p",{className:"iframe-event-card__bold m-0 grid-view-hided"},x))),v&&t.createElement(r.Card.Text,{as:"div",className:"list-view-hided"},t.createElement("div",{className:"d-flex align-items-center mb-3"},t.createElement("div",{className:"icon-wrapper"},t.createElement(n.ReactComponent,null)),t.createElement("p",{className:"iframe-event-card__bold m-0"},v))),"number"==typeof u&&t.createElement(r.Card.Text,{as:"div"},t.createElement("div",{className:"d-flex align-items-center mb-3"},t.createElement("div",{className:"icon-wrapper"},t.createElement(d.ReactComponent,null)),t.createElement("p",{className:"iframe-event-card__bold m-0"},I("from")," ",j(u,{style:"currency",currency:"GBP"})))),g&&t.createElement(r.Card.Text,{as:"div",className:"list-view-hided"},t.createElement(s.TipTapEditor,{viewMode:!0,disabled:!0,content:l.formatContent(g,150),id:T})))))};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LeftBlock.d.ts","sourceRoot":"","sources":["../../../../../../src/iframe/page/components/PageBody/components/LeftBlock/LeftBlock.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,iBAAiB,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAM5E,MAAM,MAAM,cAAc,GAAG,iBAAiB,CAC5C;IACE,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B,GAAG,cAAc,CAAC,cAAc,CAAC,CACnC,CAAC;AAEF,eAAO,MAAM,SAAS,+EAOnB,cAAc,
|
|
1
|
+
{"version":3,"file":"LeftBlock.d.ts","sourceRoot":"","sources":["../../../../../../src/iframe/page/components/PageBody/components/LeftBlock/LeftBlock.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,iBAAiB,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAM5E,MAAM,MAAM,cAAc,GAAG,iBAAiB,CAC5C;IACE,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B,GAAG,cAAc,CAAC,cAAc,CAAC,CACnC,CAAC;AAEF,eAAO,MAAM,SAAS,+EAOnB,cAAc,gBA+BhB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("tslib"),l=e(require("react")),a=e(require("clsx")),
|
|
1
|
+
"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("tslib"),l=e(require("react")),a=e(require("clsx")),i=require("@licklist/plugins/dist/context/page/PageContext"),s=require("../../constants.js"),n=require("../../hooks/useResizePageBody.js");exports.LeftBlock=function(e){var r=e.pageTitle,c=e.children,o=e.className,u=e.component,d=e.childrenClassName,m=t.__rest(e,["pageTitle","children","className","component","childrenClassName"]),f=n.useResizePageBody(),g=f.leftBlockStyles,p=f.leftBlockContainerSizes;return l.createElement("div",t.__assign({className:a("left-block",o)},m),l.createElement("div",{className:"navigation"},r&&l.createElement(l.Fragment,null,"string"==typeof r?l.createElement("div",{className:"title",id:"navigation-title"},r):r),u),l.createElement("div",{className:a("left-block-container",d),style:g,id:s.PAGE_LEFT_BLOCK_CONTAINER_ID},l.createElement(i.PageContextProvider,{leftBlockContainerSizes:p},c)))};
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
@import "../snippet-templates/snippetVariables";
|
|
2
|
+
@import "../themes//bookedit/variables";
|
|
2
3
|
|
|
3
4
|
.iframe-event-card {
|
|
4
5
|
position: relative;
|
|
@@ -26,6 +27,18 @@
|
|
|
26
27
|
padding: 0.5rem 0 0.875rem;
|
|
27
28
|
}
|
|
28
29
|
|
|
30
|
+
&__info-icon {
|
|
31
|
+
position: absolute;
|
|
32
|
+
right: 1rem;
|
|
33
|
+
top: 1rem;
|
|
34
|
+
background-color: "#ffffff";
|
|
35
|
+
border-radius: 1.5rem;
|
|
36
|
+
padding: 0 0.5rem;
|
|
37
|
+
font-size: 0.75rem;
|
|
38
|
+
font-weight: $white;
|
|
39
|
+
border: 1px solid $black;
|
|
40
|
+
}
|
|
41
|
+
|
|
29
42
|
&__title {
|
|
30
43
|
transition: $color-transition;
|
|
31
44
|
color: $snippet-elements-body-color;
|
|
@@ -33,7 +46,7 @@
|
|
|
33
46
|
line-height: 1.25rem;
|
|
34
47
|
cursor: pointer;
|
|
35
48
|
margin-bottom: 0.5rem;
|
|
36
|
-
font-size:
|
|
49
|
+
font-size: 0.95rem;
|
|
37
50
|
}
|
|
38
51
|
|
|
39
52
|
&__label {
|
|
@@ -82,7 +95,8 @@
|
|
|
82
95
|
color: $snippet-elements-button-color;
|
|
83
96
|
border: none;
|
|
84
97
|
background-color: $snippet-elements-button-background-color;
|
|
85
|
-
box-shadow: 0 0 0 $input-btn-focus-width
|
|
98
|
+
box-shadow: 0 0 0 $input-btn-focus-width
|
|
99
|
+
$snippet-elements-button-background-color;
|
|
86
100
|
}
|
|
87
101
|
|
|
88
102
|
&:disabled {
|
|
@@ -95,14 +109,14 @@
|
|
|
95
109
|
&:focus,
|
|
96
110
|
&.focus {
|
|
97
111
|
&:not(:disabled) {
|
|
98
|
-
opacity: .7;
|
|
112
|
+
opacity: 0.7;
|
|
99
113
|
}
|
|
100
114
|
}
|
|
101
115
|
|
|
102
116
|
&:active,
|
|
103
117
|
&.active {
|
|
104
118
|
&:not(:disabled) {
|
|
105
|
-
opacity: .8;
|
|
119
|
+
opacity: 0.8;
|
|
106
120
|
}
|
|
107
121
|
}
|
|
108
122
|
}
|
|
@@ -123,7 +137,7 @@
|
|
|
123
137
|
}
|
|
124
138
|
|
|
125
139
|
.card-text {
|
|
126
|
-
font-size: 0.
|
|
140
|
+
font-size: 0.82rem;
|
|
127
141
|
}
|
|
128
142
|
|
|
129
143
|
&.event-info {
|
|
@@ -202,7 +216,6 @@
|
|
|
202
216
|
|
|
203
217
|
@media (max-width: 576px) {
|
|
204
218
|
&.list-view {
|
|
205
|
-
|
|
206
219
|
.card-image {
|
|
207
220
|
margin-right: 0.5rem;
|
|
208
221
|
}
|
|
@@ -29,15 +29,16 @@
|
|
|
29
29
|
.navigation {
|
|
30
30
|
font-size: 1.125rem;
|
|
31
31
|
font-weight: 500;
|
|
32
|
-
|
|
32
|
+
padding-bottom: 2.625rem;
|
|
33
33
|
display: flex;
|
|
34
34
|
align-items: flex-start;
|
|
35
35
|
justify-content: space-between;
|
|
36
|
+
margin-top: 0.125rem;
|
|
36
37
|
|
|
37
38
|
.title {
|
|
39
|
+
position: absolute;
|
|
38
40
|
color: $snippet-elements-body-color;
|
|
39
41
|
margin: 0;
|
|
40
|
-
margin-top: 0.125rem;
|
|
41
42
|
}
|
|
42
43
|
|
|
43
44
|
@include media-breakpoint-down(sm) {
|
|
@@ -64,7 +65,7 @@
|
|
|
64
65
|
overflow-x: hidden;
|
|
65
66
|
scrollbar-width: thin;
|
|
66
67
|
.iframe-event-card {
|
|
67
|
-
border-bottom:
|
|
68
|
+
border-bottom: 1px solid $separator-color;
|
|
68
69
|
}
|
|
69
70
|
|
|
70
71
|
@include media-breakpoint-down(sm) {
|
|
@@ -115,7 +116,7 @@
|
|
|
115
116
|
}
|
|
116
117
|
|
|
117
118
|
.collapse {
|
|
118
|
-
max-height: calc(100vh -
|
|
119
|
+
max-height: calc(100vh - 15rem);
|
|
119
120
|
transition: none 0s ease 0s;
|
|
120
121
|
|
|
121
122
|
&.show {
|
package/package.json
CHANGED
|
@@ -29,6 +29,7 @@ interface IframeEventCardProps {
|
|
|
29
29
|
titleId?: string;
|
|
30
30
|
descriptionId?: string;
|
|
31
31
|
imageClassName?: string;
|
|
32
|
+
showMoreInfo?: boolean;
|
|
32
33
|
}
|
|
33
34
|
|
|
34
35
|
export function IframeEventCard({
|
|
@@ -46,6 +47,7 @@ export function IframeEventCard({
|
|
|
46
47
|
titleId,
|
|
47
48
|
descriptionId,
|
|
48
49
|
imageClassName,
|
|
50
|
+
showMoreInfo,
|
|
49
51
|
}: IframeEventCardProps) {
|
|
50
52
|
const { formatNumber } = useIntl();
|
|
51
53
|
const { t } = useTranslation("Design");
|
|
@@ -70,6 +72,7 @@ export function IframeEventCard({
|
|
|
70
72
|
)}
|
|
71
73
|
onClick={goToDetails ? onClick : undefined}
|
|
72
74
|
>
|
|
75
|
+
{showMoreInfo && <div className="iframe-event-card__info-icon">i</div>}
|
|
73
76
|
{imageSrc && (
|
|
74
77
|
<Card.Img
|
|
75
78
|
className={imageClassName ?? "card-image"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
@import "../snippet-templates/snippetVariables";
|
|
2
|
+
@import "../themes//bookedit/variables";
|
|
2
3
|
|
|
3
4
|
.iframe-event-card {
|
|
4
5
|
position: relative;
|
|
@@ -26,6 +27,18 @@
|
|
|
26
27
|
padding: 0.5rem 0 0.875rem;
|
|
27
28
|
}
|
|
28
29
|
|
|
30
|
+
&__info-icon {
|
|
31
|
+
position: absolute;
|
|
32
|
+
right: 1rem;
|
|
33
|
+
top: 1rem;
|
|
34
|
+
background-color: "#ffffff";
|
|
35
|
+
border-radius: 1.5rem;
|
|
36
|
+
padding: 0 0.5rem;
|
|
37
|
+
font-size: 0.75rem;
|
|
38
|
+
font-weight: $white;
|
|
39
|
+
border: 1px solid $black;
|
|
40
|
+
}
|
|
41
|
+
|
|
29
42
|
&__title {
|
|
30
43
|
transition: $color-transition;
|
|
31
44
|
color: $snippet-elements-body-color;
|
|
@@ -33,7 +46,7 @@
|
|
|
33
46
|
line-height: 1.25rem;
|
|
34
47
|
cursor: pointer;
|
|
35
48
|
margin-bottom: 0.5rem;
|
|
36
|
-
font-size:
|
|
49
|
+
font-size: 0.95rem;
|
|
37
50
|
}
|
|
38
51
|
|
|
39
52
|
&__label {
|
|
@@ -82,7 +95,8 @@
|
|
|
82
95
|
color: $snippet-elements-button-color;
|
|
83
96
|
border: none;
|
|
84
97
|
background-color: $snippet-elements-button-background-color;
|
|
85
|
-
box-shadow: 0 0 0 $input-btn-focus-width
|
|
98
|
+
box-shadow: 0 0 0 $input-btn-focus-width
|
|
99
|
+
$snippet-elements-button-background-color;
|
|
86
100
|
}
|
|
87
101
|
|
|
88
102
|
&:disabled {
|
|
@@ -95,14 +109,14 @@
|
|
|
95
109
|
&:focus,
|
|
96
110
|
&.focus {
|
|
97
111
|
&:not(:disabled) {
|
|
98
|
-
opacity: .7;
|
|
112
|
+
opacity: 0.7;
|
|
99
113
|
}
|
|
100
114
|
}
|
|
101
115
|
|
|
102
116
|
&:active,
|
|
103
117
|
&.active {
|
|
104
118
|
&:not(:disabled) {
|
|
105
|
-
opacity: .8;
|
|
119
|
+
opacity: 0.8;
|
|
106
120
|
}
|
|
107
121
|
}
|
|
108
122
|
}
|
|
@@ -123,7 +137,7 @@
|
|
|
123
137
|
}
|
|
124
138
|
|
|
125
139
|
.card-text {
|
|
126
|
-
font-size: 0.
|
|
140
|
+
font-size: 0.82rem;
|
|
127
141
|
}
|
|
128
142
|
|
|
129
143
|
&.event-info {
|
|
@@ -202,7 +216,6 @@
|
|
|
202
216
|
|
|
203
217
|
@media (max-width: 576px) {
|
|
204
218
|
&.list-view {
|
|
205
|
-
|
|
206
219
|
.card-image {
|
|
207
220
|
margin-right: 0.5rem;
|
|
208
221
|
}
|
|
@@ -29,15 +29,16 @@
|
|
|
29
29
|
.navigation {
|
|
30
30
|
font-size: 1.125rem;
|
|
31
31
|
font-weight: 500;
|
|
32
|
-
|
|
32
|
+
padding-bottom: 2.625rem;
|
|
33
33
|
display: flex;
|
|
34
34
|
align-items: flex-start;
|
|
35
35
|
justify-content: space-between;
|
|
36
|
+
margin-top: 0.125rem;
|
|
36
37
|
|
|
37
38
|
.title {
|
|
39
|
+
position: absolute;
|
|
38
40
|
color: $snippet-elements-body-color;
|
|
39
41
|
margin: 0;
|
|
40
|
-
margin-top: 0.125rem;
|
|
41
42
|
}
|
|
42
43
|
|
|
43
44
|
@include media-breakpoint-down(sm) {
|
|
@@ -64,7 +65,7 @@
|
|
|
64
65
|
overflow-x: hidden;
|
|
65
66
|
scrollbar-width: thin;
|
|
66
67
|
.iframe-event-card {
|
|
67
|
-
border-bottom:
|
|
68
|
+
border-bottom: 1px solid $separator-color;
|
|
68
69
|
}
|
|
69
70
|
|
|
70
71
|
@include media-breakpoint-down(sm) {
|
|
@@ -115,7 +116,7 @@
|
|
|
115
116
|
}
|
|
116
117
|
|
|
117
118
|
.collapse {
|
|
118
|
-
max-height: calc(100vh -
|
|
119
|
+
max-height: calc(100vh - 15rem);
|
|
119
120
|
transition: none 0s ease 0s;
|
|
120
121
|
|
|
121
122
|
&.show {
|