@asante-org/atlascopco-vt-litesitegenerator 3.0.16 → 3.0.18
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/index.esm.scss +86 -132
- package/dist/index.scss +86 -132
- package/dist/lsg-clientlib.css +2106 -0
- package/dist/lsg-clientlib.css.map +1 -0
- package/dist/lsg-clientlib.js +524 -0
- package/dist/lsg-clientlib.js.map +1 -0
- package/dist/src/components/lsg/LsgImage/LsgImage.d.ts +10 -15
- package/dist/src/components/lsg/LsgImage/LsgImage.stories.d.ts +2 -6
- package/dist/src/components/lsg/LsgImage/index.d.ts +1 -1
- package/dist/themes/theme-1.css +66 -69
- package/dist/themes/theme-1.css.map +1 -1
- package/dist/themes/theme-2.css +61 -75
- package/dist/themes/theme-2.css.map +1 -1
- package/dist/themes/theme-3.css +73 -72
- package/dist/themes/theme-3.css.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
package/dist/index.esm.scss
CHANGED
|
@@ -2737,153 +2737,130 @@
|
|
|
2737
2737
|
position: relative;
|
|
2738
2738
|
width: 100%;
|
|
2739
2739
|
max-width: var(--lsg-image-max-width);
|
|
2740
|
-
margin-inline: auto;
|
|
2741
2740
|
font-family: var(--lsg-font-family-primary);
|
|
2742
2741
|
border-radius: var(--lsg-image-container-radius, 0);
|
|
2743
2742
|
overflow: var(--lsg-image-container-overflow, visible);
|
|
2744
2743
|
}
|
|
2745
|
-
.lsg-image--full-width {
|
|
2746
|
-
max-width: none;
|
|
2747
|
-
}
|
|
2748
2744
|
.lsg-image__media {
|
|
2749
2745
|
position: relative;
|
|
2746
|
+
box-sizing: border-box;
|
|
2750
2747
|
width: 100%;
|
|
2751
2748
|
height: var(--lsg-image-height);
|
|
2752
2749
|
overflow: var(--lsg-image-media-overflow, hidden);
|
|
2753
2750
|
background: var(--lsg-image-bg);
|
|
2754
|
-
|
|
2755
|
-
}
|
|
2756
|
-
.lsg-image--parallax .lsg-image__media {
|
|
2757
|
-
background-attachment: fixed;
|
|
2758
|
-
background-size: cover;
|
|
2759
|
-
background-position: center;
|
|
2760
|
-
}
|
|
2761
|
-
@media (max-width: 767px) {
|
|
2762
|
-
.lsg-image--parallax .lsg-image__media {
|
|
2763
|
-
background-attachment: scroll;
|
|
2764
|
-
}
|
|
2751
|
+
border-bottom: var(--lsg-image-media-border, none);
|
|
2765
2752
|
}
|
|
2766
|
-
.lsg-image__picture {
|
|
2767
|
-
|
|
2768
|
-
|
|
2753
|
+
.lsg-image__picture, .lsg-image__picture picture {
|
|
2754
|
+
display: block;
|
|
2755
|
+
width: 100%;
|
|
2756
|
+
height: 100%;
|
|
2769
2757
|
}
|
|
2770
2758
|
.lsg-image__img {
|
|
2759
|
+
display: block;
|
|
2771
2760
|
width: 100%;
|
|
2772
2761
|
height: 100%;
|
|
2773
2762
|
-o-object-fit: cover;
|
|
2774
2763
|
object-fit: cover;
|
|
2775
|
-
display: block;
|
|
2776
2764
|
}
|
|
2777
2765
|
.lsg-image__link {
|
|
2778
2766
|
position: absolute;
|
|
2779
2767
|
inset: 0;
|
|
2780
|
-
display: flex;
|
|
2781
|
-
align-items: center;
|
|
2782
|
-
justify-content: center;
|
|
2783
|
-
color: var(--lsg-color-primary);
|
|
2784
|
-
cursor: pointer;
|
|
2785
|
-
text-decoration: none;
|
|
2786
2768
|
z-index: 2;
|
|
2787
2769
|
}
|
|
2788
2770
|
.lsg-image__link:focus-visible {
|
|
2789
2771
|
outline: 2px solid var(--lsg-color-primary);
|
|
2790
2772
|
outline-offset: -2px;
|
|
2791
2773
|
}
|
|
2792
|
-
.lsg-image__overlay {
|
|
2793
|
-
position: absolute;
|
|
2794
|
-
inset: 0;
|
|
2795
|
-
background: var(--lsg-image-link-overlay-bg);
|
|
2796
|
-
opacity: 0;
|
|
2797
|
-
transition: opacity var(--lsg-image-transition);
|
|
2798
|
-
pointer-events: none;
|
|
2799
|
-
z-index: 1;
|
|
2800
|
-
}
|
|
2801
|
-
@media (min-width: 768px) {
|
|
2802
|
-
.lsg-image__link:hover + .lsg-image__overlay, .lsg-image__link:focus-visible + .lsg-image__overlay {
|
|
2803
|
-
opacity: 1;
|
|
2804
|
-
}
|
|
2805
|
-
}
|
|
2806
2774
|
.lsg-image__tags {
|
|
2807
2775
|
position: absolute;
|
|
2808
|
-
|
|
2776
|
+
z-index: 3;
|
|
2777
|
+
left: var(--lsg-image-tags-position-left, var(--lsg-image-tags-inset));
|
|
2809
2778
|
top: var(--lsg-image-tags-position-top, auto);
|
|
2810
2779
|
bottom: var(--lsg-image-tags-position-bottom, var(--lsg-image-tags-inset));
|
|
2811
|
-
display:
|
|
2812
|
-
|
|
2780
|
+
display: flex;
|
|
2781
|
+
flex-wrap: wrap;
|
|
2813
2782
|
gap: var(--lsg-image-tag-gap);
|
|
2814
2783
|
max-width: var(--lsg-image-tags-max-width-mobile);
|
|
2815
|
-
|
|
2784
|
+
pointer-events: none;
|
|
2816
2785
|
}
|
|
2817
2786
|
.lsg-image__tag {
|
|
2818
|
-
|
|
2819
|
-
padding: 0 var(--lsg-image-tag-padding-x);
|
|
2787
|
+
box-sizing: border-box;
|
|
2820
2788
|
display: inline-flex;
|
|
2821
2789
|
align-items: center;
|
|
2822
2790
|
justify-content: center;
|
|
2823
|
-
|
|
2824
|
-
|
|
2825
|
-
|
|
2826
|
-
|
|
2827
|
-
border: var(--lsg-image-tag-border-width,
|
|
2828
|
-
|
|
2829
|
-
|
|
2791
|
+
height: var(--lsg-image-tag-height);
|
|
2792
|
+
padding: 0 var(--lsg-image-tag-padding-x);
|
|
2793
|
+
overflow: hidden;
|
|
2794
|
+
background: var(--lsg-image-tag-bg);
|
|
2795
|
+
border-width: var(--lsg-image-tag-border-width, 0);
|
|
2796
|
+
border-style: var(--lsg-image-tag-border-style, solid);
|
|
2797
|
+
border-color: var(--lsg-image-tag-border, transparent);
|
|
2798
|
+
border-radius: var(--lsg-image-tag-radius, var(--lsg-theme-radius, 0));
|
|
2799
|
+
backdrop-filter: blur(var(--lsg-image-tag-blur, 0));
|
|
2800
|
+
-webkit-backdrop-filter: blur(var(--lsg-image-tag-blur, 0));
|
|
2830
2801
|
color: var(--lsg-image-tag-color);
|
|
2802
|
+
font-size: var(--lsg-image-tag-font-size);
|
|
2803
|
+
font-weight: var(--lsg-image-tag-font-weight, 600);
|
|
2804
|
+
line-height: var(--lsg-image-tag-line-height, 1.2);
|
|
2805
|
+
text-align: center;
|
|
2806
|
+
text-transform: var(--lsg-image-tag-text-transform, none);
|
|
2831
2807
|
white-space: nowrap;
|
|
2832
2808
|
transition: background-color var(--lsg-image-transition);
|
|
2833
2809
|
}
|
|
2834
2810
|
.lsg-image:hover .lsg-image__tag, .lsg-image:focus-within .lsg-image__tag {
|
|
2835
|
-
background
|
|
2811
|
+
background: var(--lsg-image-tag-bg-hover);
|
|
2836
2812
|
}
|
|
2837
2813
|
.lsg-image__caption {
|
|
2838
2814
|
position: var(--lsg-image-caption-position, relative);
|
|
2839
2815
|
top: var(--lsg-image-caption-top, auto);
|
|
2816
|
+
right: 0;
|
|
2840
2817
|
bottom: var(--lsg-image-caption-bottom, auto);
|
|
2841
2818
|
left: 0;
|
|
2842
|
-
|
|
2843
|
-
|
|
2819
|
+
z-index: 3;
|
|
2820
|
+
box-sizing: border-box;
|
|
2844
2821
|
width: 100%;
|
|
2845
2822
|
height: var(--lsg-image-caption-height);
|
|
2846
2823
|
overflow: hidden;
|
|
2847
|
-
box-sizing: border-box;
|
|
2848
|
-
padding: var(--lsg-image-caption-padding-y) var(--lsg-image-caption-padding-x);
|
|
2849
2824
|
display: flex;
|
|
2850
2825
|
flex-direction: column;
|
|
2851
2826
|
justify-content: center;
|
|
2827
|
+
gap: var(--lsg-image-caption-gap, 8px);
|
|
2828
|
+
padding: var(--lsg-image-caption-padding-y) var(--lsg-image-caption-padding-x);
|
|
2852
2829
|
background: var(--lsg-image-caption-bg);
|
|
2853
|
-
|
|
2830
|
+
pointer-events: none;
|
|
2854
2831
|
transition: height var(--lsg-image-transition);
|
|
2855
2832
|
}
|
|
2856
2833
|
.lsg-image:hover .lsg-image__caption, .lsg-image:focus-within .lsg-image__caption {
|
|
2857
2834
|
height: var(--lsg-image-caption-height-hover);
|
|
2858
2835
|
}
|
|
2859
2836
|
.lsg-image__title {
|
|
2837
|
+
margin: 0;
|
|
2838
|
+
color: var(--lsg-image-title-color);
|
|
2860
2839
|
font-size: var(--lsg-image-title-font-size);
|
|
2861
2840
|
font-weight: var(--lsg-font-weight-semibold, 600);
|
|
2862
2841
|
line-height: 1.2;
|
|
2863
|
-
color: var(--lsg-image-title-color);
|
|
2864
|
-
margin: 0;
|
|
2865
2842
|
}
|
|
2866
2843
|
.lsg-image__text {
|
|
2844
|
+
margin: 0;
|
|
2845
|
+
padding-left: var(--lsg-image-text-indent, 0);
|
|
2846
|
+
color: var(--lsg-image-text-color);
|
|
2867
2847
|
font-size: var(--lsg-image-text-font-size);
|
|
2868
2848
|
font-weight: var(--lsg-font-weight-regular, 400);
|
|
2869
|
-
line-height: 1.
|
|
2870
|
-
color: var(--lsg-image-text-color, var(--lsg-color-black, #090909));
|
|
2871
|
-
margin: 4px 0 0;
|
|
2849
|
+
line-height: 1.5;
|
|
2872
2850
|
opacity: 0;
|
|
2873
2851
|
transition: opacity var(--lsg-image-transition);
|
|
2874
2852
|
}
|
|
2875
|
-
.lsg-image:hover .lsg-image__text, .lsg-image:focus-within .lsg-image__text {
|
|
2853
|
+
.lsg-image__text:only-child, .lsg-image:hover .lsg-image__text, .lsg-image:focus-within .lsg-image__text {
|
|
2876
2854
|
opacity: 1;
|
|
2877
2855
|
}
|
|
2878
2856
|
@media (min-width: 768px) {
|
|
2879
2857
|
.lsg-image__tags {
|
|
2880
|
-
display: flex;
|
|
2881
2858
|
flex-wrap: nowrap;
|
|
2882
2859
|
max-width: var(--lsg-image-tags-max-width-desktop);
|
|
2883
2860
|
}
|
|
2884
2861
|
}
|
|
2885
2862
|
@media (prefers-reduced-motion: reduce) {
|
|
2886
|
-
.lsg-image__caption, .lsg-image__tag, .lsg-image__text
|
|
2863
|
+
.lsg-image__caption, .lsg-image__tag, .lsg-image__text {
|
|
2887
2864
|
transition: none;
|
|
2888
2865
|
}
|
|
2889
2866
|
}
|
|
@@ -6882,153 +6859,130 @@
|
|
|
6882
6859
|
position: relative;
|
|
6883
6860
|
width: 100%;
|
|
6884
6861
|
max-width: var(--lsg-image-max-width);
|
|
6885
|
-
margin-inline: auto;
|
|
6886
6862
|
font-family: var(--lsg-font-family-primary);
|
|
6887
6863
|
border-radius: var(--lsg-image-container-radius, 0);
|
|
6888
6864
|
overflow: var(--lsg-image-container-overflow, visible);
|
|
6889
6865
|
}
|
|
6890
|
-
.lsg-image--full-width {
|
|
6891
|
-
max-width: none;
|
|
6892
|
-
}
|
|
6893
6866
|
.lsg-image__media {
|
|
6894
6867
|
position: relative;
|
|
6868
|
+
box-sizing: border-box;
|
|
6895
6869
|
width: 100%;
|
|
6896
6870
|
height: var(--lsg-image-height);
|
|
6897
6871
|
overflow: var(--lsg-image-media-overflow, hidden);
|
|
6898
6872
|
background: var(--lsg-image-bg);
|
|
6899
|
-
|
|
6900
|
-
}
|
|
6901
|
-
.lsg-image--parallax .lsg-image__media {
|
|
6902
|
-
background-attachment: fixed;
|
|
6903
|
-
background-size: cover;
|
|
6904
|
-
background-position: center;
|
|
6905
|
-
}
|
|
6906
|
-
@media (max-width: 767px) {
|
|
6907
|
-
.lsg-image--parallax .lsg-image__media {
|
|
6908
|
-
background-attachment: scroll;
|
|
6909
|
-
}
|
|
6873
|
+
border-bottom: var(--lsg-image-media-border, none);
|
|
6910
6874
|
}
|
|
6911
|
-
.lsg-image__picture {
|
|
6912
|
-
|
|
6913
|
-
|
|
6875
|
+
.lsg-image__picture, .lsg-image__picture picture {
|
|
6876
|
+
display: block;
|
|
6877
|
+
width: 100%;
|
|
6878
|
+
height: 100%;
|
|
6914
6879
|
}
|
|
6915
6880
|
.lsg-image__img {
|
|
6881
|
+
display: block;
|
|
6916
6882
|
width: 100%;
|
|
6917
6883
|
height: 100%;
|
|
6918
6884
|
-o-object-fit: cover;
|
|
6919
6885
|
object-fit: cover;
|
|
6920
|
-
display: block;
|
|
6921
6886
|
}
|
|
6922
6887
|
.lsg-image__link {
|
|
6923
6888
|
position: absolute;
|
|
6924
6889
|
inset: 0;
|
|
6925
|
-
display: flex;
|
|
6926
|
-
align-items: center;
|
|
6927
|
-
justify-content: center;
|
|
6928
|
-
color: var(--lsg-color-primary);
|
|
6929
|
-
cursor: pointer;
|
|
6930
|
-
text-decoration: none;
|
|
6931
6890
|
z-index: 2;
|
|
6932
6891
|
}
|
|
6933
6892
|
.lsg-image__link:focus-visible {
|
|
6934
6893
|
outline: 2px solid var(--lsg-color-primary);
|
|
6935
6894
|
outline-offset: -2px;
|
|
6936
6895
|
}
|
|
6937
|
-
.lsg-image__overlay {
|
|
6938
|
-
position: absolute;
|
|
6939
|
-
inset: 0;
|
|
6940
|
-
background: var(--lsg-image-link-overlay-bg);
|
|
6941
|
-
opacity: 0;
|
|
6942
|
-
transition: opacity var(--lsg-image-transition);
|
|
6943
|
-
pointer-events: none;
|
|
6944
|
-
z-index: 1;
|
|
6945
|
-
}
|
|
6946
|
-
@media (min-width: 768px) {
|
|
6947
|
-
.lsg-image__link:hover + .lsg-image__overlay, .lsg-image__link:focus-visible + .lsg-image__overlay {
|
|
6948
|
-
opacity: 1;
|
|
6949
|
-
}
|
|
6950
|
-
}
|
|
6951
6896
|
.lsg-image__tags {
|
|
6952
6897
|
position: absolute;
|
|
6953
|
-
|
|
6898
|
+
z-index: 3;
|
|
6899
|
+
left: var(--lsg-image-tags-position-left, var(--lsg-image-tags-inset));
|
|
6954
6900
|
top: var(--lsg-image-tags-position-top, auto);
|
|
6955
6901
|
bottom: var(--lsg-image-tags-position-bottom, var(--lsg-image-tags-inset));
|
|
6956
|
-
display:
|
|
6957
|
-
|
|
6902
|
+
display: flex;
|
|
6903
|
+
flex-wrap: wrap;
|
|
6958
6904
|
gap: var(--lsg-image-tag-gap);
|
|
6959
6905
|
max-width: var(--lsg-image-tags-max-width-mobile);
|
|
6960
|
-
|
|
6906
|
+
pointer-events: none;
|
|
6961
6907
|
}
|
|
6962
6908
|
.lsg-image__tag {
|
|
6963
|
-
|
|
6964
|
-
padding: 0 var(--lsg-image-tag-padding-x);
|
|
6909
|
+
box-sizing: border-box;
|
|
6965
6910
|
display: inline-flex;
|
|
6966
6911
|
align-items: center;
|
|
6967
6912
|
justify-content: center;
|
|
6968
|
-
|
|
6969
|
-
|
|
6970
|
-
|
|
6971
|
-
|
|
6972
|
-
border: var(--lsg-image-tag-border-width,
|
|
6973
|
-
|
|
6974
|
-
|
|
6913
|
+
height: var(--lsg-image-tag-height);
|
|
6914
|
+
padding: 0 var(--lsg-image-tag-padding-x);
|
|
6915
|
+
overflow: hidden;
|
|
6916
|
+
background: var(--lsg-image-tag-bg);
|
|
6917
|
+
border-width: var(--lsg-image-tag-border-width, 0);
|
|
6918
|
+
border-style: var(--lsg-image-tag-border-style, solid);
|
|
6919
|
+
border-color: var(--lsg-image-tag-border, transparent);
|
|
6920
|
+
border-radius: var(--lsg-image-tag-radius, var(--lsg-theme-radius, 0));
|
|
6921
|
+
backdrop-filter: blur(var(--lsg-image-tag-blur, 0));
|
|
6922
|
+
-webkit-backdrop-filter: blur(var(--lsg-image-tag-blur, 0));
|
|
6975
6923
|
color: var(--lsg-image-tag-color);
|
|
6924
|
+
font-size: var(--lsg-image-tag-font-size);
|
|
6925
|
+
font-weight: var(--lsg-image-tag-font-weight, 600);
|
|
6926
|
+
line-height: var(--lsg-image-tag-line-height, 1.2);
|
|
6927
|
+
text-align: center;
|
|
6928
|
+
text-transform: var(--lsg-image-tag-text-transform, none);
|
|
6976
6929
|
white-space: nowrap;
|
|
6977
6930
|
transition: background-color var(--lsg-image-transition);
|
|
6978
6931
|
}
|
|
6979
6932
|
.lsg-image:hover .lsg-image__tag, .lsg-image:focus-within .lsg-image__tag {
|
|
6980
|
-
background
|
|
6933
|
+
background: var(--lsg-image-tag-bg-hover);
|
|
6981
6934
|
}
|
|
6982
6935
|
.lsg-image__caption {
|
|
6983
6936
|
position: var(--lsg-image-caption-position, relative);
|
|
6984
6937
|
top: var(--lsg-image-caption-top, auto);
|
|
6938
|
+
right: 0;
|
|
6985
6939
|
bottom: var(--lsg-image-caption-bottom, auto);
|
|
6986
6940
|
left: 0;
|
|
6987
|
-
|
|
6988
|
-
|
|
6941
|
+
z-index: 3;
|
|
6942
|
+
box-sizing: border-box;
|
|
6989
6943
|
width: 100%;
|
|
6990
6944
|
height: var(--lsg-image-caption-height);
|
|
6991
6945
|
overflow: hidden;
|
|
6992
|
-
box-sizing: border-box;
|
|
6993
|
-
padding: var(--lsg-image-caption-padding-y) var(--lsg-image-caption-padding-x);
|
|
6994
6946
|
display: flex;
|
|
6995
6947
|
flex-direction: column;
|
|
6996
6948
|
justify-content: center;
|
|
6949
|
+
gap: var(--lsg-image-caption-gap, 8px);
|
|
6950
|
+
padding: var(--lsg-image-caption-padding-y) var(--lsg-image-caption-padding-x);
|
|
6997
6951
|
background: var(--lsg-image-caption-bg);
|
|
6998
|
-
|
|
6952
|
+
pointer-events: none;
|
|
6999
6953
|
transition: height var(--lsg-image-transition);
|
|
7000
6954
|
}
|
|
7001
6955
|
.lsg-image:hover .lsg-image__caption, .lsg-image:focus-within .lsg-image__caption {
|
|
7002
6956
|
height: var(--lsg-image-caption-height-hover);
|
|
7003
6957
|
}
|
|
7004
6958
|
.lsg-image__title {
|
|
6959
|
+
margin: 0;
|
|
6960
|
+
color: var(--lsg-image-title-color);
|
|
7005
6961
|
font-size: var(--lsg-image-title-font-size);
|
|
7006
6962
|
font-weight: var(--lsg-font-weight-semibold, 600);
|
|
7007
6963
|
line-height: 1.2;
|
|
7008
|
-
color: var(--lsg-image-title-color);
|
|
7009
|
-
margin: 0;
|
|
7010
6964
|
}
|
|
7011
6965
|
.lsg-image__text {
|
|
6966
|
+
margin: 0;
|
|
6967
|
+
padding-left: var(--lsg-image-text-indent, 0);
|
|
6968
|
+
color: var(--lsg-image-text-color);
|
|
7012
6969
|
font-size: var(--lsg-image-text-font-size);
|
|
7013
6970
|
font-weight: var(--lsg-font-weight-regular, 400);
|
|
7014
|
-
line-height: 1.
|
|
7015
|
-
color: var(--lsg-image-text-color, var(--lsg-color-black, #090909));
|
|
7016
|
-
margin: 4px 0 0;
|
|
6971
|
+
line-height: 1.5;
|
|
7017
6972
|
opacity: 0;
|
|
7018
6973
|
transition: opacity var(--lsg-image-transition);
|
|
7019
6974
|
}
|
|
7020
|
-
.lsg-image:hover .lsg-image__text, .lsg-image:focus-within .lsg-image__text {
|
|
6975
|
+
.lsg-image__text:only-child, .lsg-image:hover .lsg-image__text, .lsg-image:focus-within .lsg-image__text {
|
|
7021
6976
|
opacity: 1;
|
|
7022
6977
|
}
|
|
7023
6978
|
@media (min-width: 768px) {
|
|
7024
6979
|
.lsg-image__tags {
|
|
7025
|
-
display: flex;
|
|
7026
6980
|
flex-wrap: nowrap;
|
|
7027
6981
|
max-width: var(--lsg-image-tags-max-width-desktop);
|
|
7028
6982
|
}
|
|
7029
6983
|
}
|
|
7030
6984
|
@media (prefers-reduced-motion: reduce) {
|
|
7031
|
-
.lsg-image__caption, .lsg-image__tag, .lsg-image__text
|
|
6985
|
+
.lsg-image__caption, .lsg-image__tag, .lsg-image__text {
|
|
7032
6986
|
transition: none;
|
|
7033
6987
|
}
|
|
7034
6988
|
}
|