@festo-ui/web-essentials 3.0.0-pre-20220105.3 → 3.0.0-pre-20220105.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.
@@ -1,52 +0,0 @@
1
- .fwe-teaser-horbox {
2
- display: flex;
3
- background-color: var(--fwe-sucanul);
4
- }
5
-
6
- .fwe-teaser-horbox .fwe-teaser-horbox-img {
7
- background-color: var(--fwe-hero);
8
- flex: 1;
9
- }
10
-
11
- .fwe-teaser-horbox .fwe-teaser-horbox-content {
12
- flex: 1;
13
- display: inline-flex;
14
- flex-direction: column;
15
- padding: 24px;
16
- }
17
-
18
- .fwe-teaser-horbox .fwe-teaser-horbox-content .fwe-teaser-more {
19
- align-self: flex-end;
20
- }
21
-
22
- .fwe-teaser-verbox {
23
- display: inline-flex;
24
- flex-direction: column;
25
- background-color: var(--fwe-sucanul);
26
- width: 100%;
27
- height: 100%;
28
- }
29
-
30
- .fwe-teaser-verbox .fwe-teaser-verbox-img {
31
- background-color: var(--fwe-hero);
32
- height: calc(50% - 12px);
33
- min-height: 186px;
34
- width: 100%;
35
- }
36
-
37
- .fwe-teaser-verbox h2 {
38
- padding-top: 24px;
39
- padding-left: 24px;
40
- padding-right: 24px;
41
- }
42
-
43
- .fwe-teaser-verbox p {
44
- padding-left: 24px;
45
- padding-right: 24px;
46
- }
47
-
48
- .fwe-teaser-verbox .fwe-teaser-more {
49
- align-self: flex-end;
50
- margin-bottom: 24px;
51
- margin-right: 24px;
52
- }
@@ -1,5 +0,0 @@
1
- @import "../variables";
2
-
3
- @import "footer";
4
- @import "teaser";
5
- @import "header-slider";
@@ -1,142 +0,0 @@
1
- footer.fwe-footer {
2
- .fwe-social-media {
3
- display: flex;
4
- flex-direction: row;
5
- justify-content: center;
6
- padding: 24px 0px;
7
- border-bottom: 1px solid $control-border-darker;
8
- margin-bottom: 24px;
9
-
10
- .fwe-social-media-link {
11
- display: block;
12
- width: 32px;
13
- height: 32px;
14
- border-radius: 4px;
15
- margin-right: 24px;
16
- opacity: 0.3;
17
- transition: opacity 0.3s;
18
-
19
- &:last-child {
20
- margin-right: 0px;
21
- }
22
-
23
- &:hover {
24
- opacity: 1;
25
- }
26
- }
27
- }
28
- .fwe-footer-details {
29
- padding-bottom: 24px;
30
- border-bottom: 1px solid $control-border-darker;
31
-
32
- h4 {
33
- font-size: 16px;
34
- line-height: 24px;
35
- font-weight: 700;
36
- list-style-type: none;
37
- position: relative;
38
- margin-top: 0px;
39
- margin-bottom: 12px;
40
- }
41
-
42
- ul.fwe-list-group {
43
- .fwe-list-group-item {
44
- padding-left: 0px;
45
- }
46
- }
47
-
48
- p {
49
- padding-top: 8px;
50
- max-width: 320px;
51
- }
52
-
53
- &:not(:first-child) {
54
- margin-top: 24px;
55
- }
56
- }
57
- .fwe-bottomline {
58
- font-size: 12px;
59
- padding-top: 70px;
60
- text-align: center;
61
-
62
- .fwe-sitelinks {
63
- order: 2;
64
-
65
- .fwe-sitelinks-groupa {
66
- padding-bottom: 8px;
67
-
68
- a {
69
- color: $control-border-darker;
70
- padding-right: 8px;
71
-
72
- &:last-child {
73
- padding-right: 0px;
74
- }
75
- }
76
- }
77
-
78
- .fwe-sitelinks-groupb {
79
- padding-bottom: 24px;
80
-
81
- a {
82
- color: $control-border-darker;
83
- padding-right: 8px;
84
-
85
- &:last-child {
86
- padding-right: 0px;
87
- }
88
- }
89
- }
90
- }
91
- .fwe-copyright {
92
- display: flex;
93
- order: 1;
94
- justify-content: center;
95
- padding-bottom: 24px;
96
- color: $control-border-darker;
97
- }
98
- }
99
- }
100
-
101
- @media only screen and (min-width: $grid-breakpoint-lg) {
102
- footer.fwe-footer {
103
- .fwe-footer-details {
104
- border-bottom: none;
105
- h4 {
106
- margin-top: 24px;
107
- }
108
- &:not(:first-child) {
109
- margin-top: 0px;
110
- }
111
- }
112
- .fwe-bottomline {
113
- font-size: 12px;
114
- padding-top: 70px;
115
- text-align: left;
116
- display: flex;
117
- .fwe-sitelinks {
118
- text-align: right;
119
- margin-left: auto;
120
- display: flex;
121
- }
122
- }
123
- .fwe-social-media {
124
- margin-bottom: 0px;
125
- }
126
- }
127
- }
128
-
129
- @media only screen and (min-width: $grid-breakpoint-xl) {
130
- footer.fwe-footer {
131
- .fwe-social-media {
132
- .fwe-social-media-link {
133
- width: 64px;
134
- height: 64px;
135
- margin-right: 42px;
136
- &:last-child {
137
- margin-right: 0px;
138
- }
139
- }
140
- }
141
- }
142
- }
@@ -1,153 +0,0 @@
1
- .fwe-header-slider-container {
2
- .fwe-header-slider-box {
3
- height: 142px;
4
- background-color: $hero;
5
- }
6
-
7
- .fwe-header-slider {
8
- margin-top: -28px;
9
- margin-left: 12px;
10
- margin-right: 12px;
11
- }
12
- }
13
-
14
- .fwe-header-slider {
15
- display: flex;
16
- flex-direction: column;
17
- padding: 24px 28px;
18
- background-color: $white;
19
- border-radius: 4px;
20
- box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.2);
21
-
22
- .fwe-header-slider-content {
23
- display: inline-flex;
24
- flex-direction: column;
25
-
26
- p {
27
- text-overflow: ellipsis;
28
- overflow: hidden;
29
- display: -webkit-box !important;
30
- -webkit-line-clamp: 2;
31
- -webkit-box-orient: vertical;
32
- white-space: normal;
33
- margin: 0;
34
- }
35
-
36
- button.fwe-btn-hero {
37
- margin-top: 24px;
38
- justify-content: center;
39
- margin-left: 18px;
40
- margin-right: 18px;
41
- }
42
- }
43
-
44
- .fwe-pagination {
45
- align-self: center;
46
- margin-top: 24px;
47
- }
48
-
49
- .fwe-header-slider-arrow-left,
50
- .fwe-header-slider-arrow-right {
51
- display: none;
52
- }
53
- }
54
-
55
- @media only screen and (min-width: $grid-breakpoint-xs) {
56
- .fwe-header-slider-container {
57
- .fwe-header-slider-box {
58
- height: 166px;
59
- }
60
- }
61
- }
62
-
63
- @media only screen and (min-width: $grid-breakpoint-sm) {
64
- .fwe-header-slider-container {
65
- .fwe-header-slider-box {
66
- height: 341px;
67
- }
68
-
69
- .fwe-header-slider {
70
- margin-top: -104px;
71
- }
72
- }
73
- }
74
-
75
- @media only screen and (min-width: $grid-breakpoint-md) {
76
- .fwe-header-slider-container {
77
- .fwe-header-slider-box {
78
- height: 455px;
79
- }
80
-
81
- .fwe-header-slider {
82
- position: relative;
83
- margin-top: -104px;
84
- }
85
- }
86
-
87
- .fwe-header-slider {
88
- padding: 24px 112px;
89
-
90
- .fwe-header-slider-content {
91
- flex-direction: row;
92
- align-items: center;
93
-
94
- p {
95
- -webkit-line-clamp: 3;
96
- }
97
-
98
- button.fwe-btn-hero {
99
- justify-content: center;
100
- margin-top: 0;
101
- margin-left: 34px;
102
- margin-right: 0;
103
- min-width: 200px;
104
- }
105
- }
106
-
107
- .fwe-header-slider-arrow-left,
108
- .fwe-header-slider-arrow-right {
109
- display: block;
110
- position: absolute;
111
- top: 50%;
112
- margin-top: 12px;
113
- transform: translateY(-50%);
114
- height: 48px;
115
- width: 48px;
116
- font-size: 48px;
117
- }
118
-
119
- .fwe-header-slider-arrow-left {
120
- left: 24px;
121
- }
122
-
123
- .fwe-header-slider-arrow-right {
124
- right: 24px;
125
- }
126
- }
127
- }
128
-
129
- @media only screen and (min-width: $grid-breakpoint-xl) {
130
- .fwe-header-slider-container {
131
- .fwe-header-slider-box {
132
- height: 640px;
133
- }
134
-
135
- .fwe-header-slider {
136
- margin: auto;
137
- margin-top: -104px;
138
- width: 1096px;
139
- }
140
- }
141
-
142
- .fwe-header-slider {
143
- padding: 24px 160px;
144
- }
145
- }
146
-
147
- @media only screen and (min-width: $grid-breakpoint-xxl) {
148
- .fwe-header-slider-container {
149
- .fwe-header-slider {
150
- width: 1192px;
151
- }
152
- }
153
- }
@@ -1,52 +0,0 @@
1
- .fwe-teaser-horbox {
2
- display: flex;
3
- background-color: var(--fwe-sucanul);
4
- }
5
-
6
- .fwe-teaser-horbox .fwe-teaser-horbox-img {
7
- background-color: var(--fwe-hero);
8
- flex: 1;
9
- }
10
-
11
- .fwe-teaser-horbox .fwe-teaser-horbox-content {
12
- flex: 1;
13
- display: inline-flex;
14
- flex-direction: column;
15
- padding: 24px;
16
- }
17
-
18
- .fwe-teaser-horbox .fwe-teaser-horbox-content .fwe-teaser-more {
19
- align-self: flex-end;
20
- }
21
-
22
- .fwe-teaser-verbox {
23
- display: inline-flex;
24
- flex-direction: column;
25
- background-color: var(--fwe-sucanul);
26
- width: 100%;
27
- height: 100%;
28
- }
29
-
30
- .fwe-teaser-verbox .fwe-teaser-verbox-img {
31
- background-color: var(--fwe-hero);
32
- height: calc(50% - 12px);
33
- min-height: 186px;
34
- width: 100%;
35
- }
36
-
37
- .fwe-teaser-verbox h2 {
38
- padding-top: 24px;
39
- padding-left: 24px;
40
- padding-right: 24px;
41
- }
42
-
43
- .fwe-teaser-verbox p {
44
- padding-left: 24px;
45
- padding-right: 24px;
46
- }
47
-
48
- .fwe-teaser-verbox .fwe-teaser-more {
49
- align-self: flex-end;
50
- margin-bottom: 24px;
51
- margin-right: 24px;
52
- }
@@ -1,5 +0,0 @@
1
- @import "../variables";
2
-
3
- @import "footer";
4
- @import "teaser";
5
- @import "header-slider";