@licklist/design 0.70.5-dev.0 → 0.70.5-dev.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.
@@ -6,6 +6,7 @@
6
6
 
7
7
  .main-filter-section {
8
8
  display: flex;
9
+ gap: 1rem;
9
10
  justify-content: center;
10
11
 
11
12
  .search {
@@ -46,7 +47,6 @@
46
47
 
47
48
  .buttons {
48
49
  display: flex;
49
- margin-left: 1rem;
50
50
 
51
51
  .btn {
52
52
  padding: 0;
@@ -122,8 +122,6 @@
122
122
  flex-direction: column;
123
123
 
124
124
  .buttons {
125
- margin-top: 1rem;
126
- margin-left: 0;
127
125
  justify-content: space-between;
128
126
  }
129
127
  }
@@ -174,6 +172,7 @@
174
172
 
175
173
  .additional-filter-container {
176
174
  flex-wrap: nowrap;
175
+ align-items: baseline;
177
176
 
178
177
  @include media-breakpoint-down(md) {
179
178
  flex-wrap: wrap;
@@ -1,12 +1,19 @@
1
- .booking-tabs-pane {
1
+ .booking-tabs-panel {
2
2
  display: flex;
3
3
  flex-direction: row;
4
- justify-content: space-between;
5
4
  align-items: center;
6
- height: 2.75rem;
5
+ gap: 1rem;
7
6
  background-color: $white;
8
7
 
9
8
  .booking-tabs {
9
+ display: flex;
10
+ gap: 0.5rem;
11
+
12
+ @include media-breakpoint-down(md) {
13
+ flex-direction: column;
14
+ align-self: center;
15
+ }
16
+
10
17
  svg {
11
18
  g > rect:first-child {
12
19
  fill: $white;
@@ -20,40 +27,29 @@
20
27
  }
21
28
  }
22
29
  }
23
-
24
- @include media-breakpoint-down(sm) {
25
- width: 4rem;
26
- }
27
30
  }
28
31
 
29
32
  .content {
30
33
  display: flex;
34
+ flex-grow: 1;
35
+ gap: 1rem;
31
36
  justify-content: space-between;
32
- width: 85%;
33
- flex-direction: row;
37
+ align-items: center;
34
38
 
35
39
  @include media-breakpoint-down(sm) {
36
- display: flex;
37
40
  flex-direction: column;
38
41
  align-items: start;
39
- height: 4rem;
40
- }
41
-
42
- .booking {
43
- @include media-breakpoint-down(sm) {
44
- height: 13rem;
45
- }
42
+ gap: 0.5rem;
46
43
  }
47
44
  }
48
45
 
49
46
  .separator {
50
- height: 2.75rem;
47
+ align-self: stretch;
51
48
  border-right: 2px solid #dcdcdc;
52
49
  }
53
50
 
54
51
  .children {
55
52
  flex: 1;
56
- margin-left: 1rem;
57
53
 
58
54
  @include media-breakpoint-down(sm) {
59
55
  display: flex;
@@ -64,12 +60,13 @@
64
60
 
65
61
  .buttons {
66
62
  display: flex;
63
+ align-items: center;
67
64
 
68
65
  .btn {
69
66
  display: flex;
70
67
  align-items: center;
71
- height: 100%;
72
- height: 2.125rem;
68
+ padding-top: 0.5rem;
69
+ padding-bottom: 0.5rem;
73
70
  }
74
71
 
75
72
  .btn-outline-primary {
@@ -96,13 +93,19 @@
96
93
  }
97
94
  }
98
95
 
99
- @include media-breakpoint-down(sm) {
100
- display: flex;
96
+ @include media-breakpoint-down(lg) {
101
97
  flex-direction: column;
98
+ align-items: stretch;
99
+ gap: 0.5rem;
100
+ }
101
+
102
+ @include media-breakpoint-down(sm) {
103
+ flex-direction: row;
102
104
  align-items: start;
103
105
  gap: 0.5rem;
104
106
  margin-top: 0.5rem;
105
107
  white-space: nowrap;
108
+ flex-wrap: wrap;
106
109
  }
107
110
  }
108
111
 
@@ -113,10 +116,4 @@
113
116
  margin-top: 1rem;
114
117
  height: 100%;
115
118
  }
116
-
117
- .booking {
118
- @include media-breakpoint-down(sm) {
119
- height: 13rem;
120
- }
121
- }
122
119
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@licklist/design",
3
- "version": "0.70.5-dev.0",
3
+ "version": "0.70.5-dev.1",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+ssh://git@bitbucket.org/artelogicsoft/licklist_design.git"
@@ -208,4 +208,4 @@
208
208
  "yarn": "4.4.0"
209
209
  },
210
210
  "stableVersion": "0.69.1-dev.3"
211
- }
211
+ }
@@ -6,6 +6,7 @@
6
6
 
7
7
  .main-filter-section {
8
8
  display: flex;
9
+ gap: 1rem;
9
10
  justify-content: center;
10
11
 
11
12
  .search {
@@ -46,7 +47,6 @@
46
47
 
47
48
  .buttons {
48
49
  display: flex;
49
- margin-left: 1rem;
50
50
 
51
51
  .btn {
52
52
  padding: 0;
@@ -122,8 +122,6 @@
122
122
  flex-direction: column;
123
123
 
124
124
  .buttons {
125
- margin-top: 1rem;
126
- margin-left: 0;
127
125
  justify-content: space-between;
128
126
  }
129
127
  }
@@ -174,6 +172,7 @@
174
172
 
175
173
  .additional-filter-container {
176
174
  flex-wrap: nowrap;
175
+ align-items: baseline;
177
176
 
178
177
  @include media-breakpoint-down(md) {
179
178
  flex-wrap: wrap;
@@ -1,12 +1,19 @@
1
- .booking-tabs-pane {
1
+ .booking-tabs-panel {
2
2
  display: flex;
3
3
  flex-direction: row;
4
- justify-content: space-between;
5
4
  align-items: center;
6
- height: 2.75rem;
5
+ gap: 1rem;
7
6
  background-color: $white;
8
7
 
9
8
  .booking-tabs {
9
+ display: flex;
10
+ gap: 0.5rem;
11
+
12
+ @include media-breakpoint-down(md) {
13
+ flex-direction: column;
14
+ align-self: center;
15
+ }
16
+
10
17
  svg {
11
18
  g > rect:first-child {
12
19
  fill: $white;
@@ -20,40 +27,29 @@
20
27
  }
21
28
  }
22
29
  }
23
-
24
- @include media-breakpoint-down(sm) {
25
- width: 4rem;
26
- }
27
30
  }
28
31
 
29
32
  .content {
30
33
  display: flex;
34
+ flex-grow: 1;
35
+ gap: 1rem;
31
36
  justify-content: space-between;
32
- width: 85%;
33
- flex-direction: row;
37
+ align-items: center;
34
38
 
35
39
  @include media-breakpoint-down(sm) {
36
- display: flex;
37
40
  flex-direction: column;
38
41
  align-items: start;
39
- height: 4rem;
40
- }
41
-
42
- .booking {
43
- @include media-breakpoint-down(sm) {
44
- height: 13rem;
45
- }
42
+ gap: 0.5rem;
46
43
  }
47
44
  }
48
45
 
49
46
  .separator {
50
- height: 2.75rem;
47
+ align-self: stretch;
51
48
  border-right: 2px solid #dcdcdc;
52
49
  }
53
50
 
54
51
  .children {
55
52
  flex: 1;
56
- margin-left: 1rem;
57
53
 
58
54
  @include media-breakpoint-down(sm) {
59
55
  display: flex;
@@ -64,12 +60,13 @@
64
60
 
65
61
  .buttons {
66
62
  display: flex;
63
+ align-items: center;
67
64
 
68
65
  .btn {
69
66
  display: flex;
70
67
  align-items: center;
71
- height: 100%;
72
- height: 2.125rem;
68
+ padding-top: 0.5rem;
69
+ padding-bottom: 0.5rem;
73
70
  }
74
71
 
75
72
  .btn-outline-primary {
@@ -96,13 +93,19 @@
96
93
  }
97
94
  }
98
95
 
99
- @include media-breakpoint-down(sm) {
100
- display: flex;
96
+ @include media-breakpoint-down(lg) {
101
97
  flex-direction: column;
98
+ align-items: stretch;
99
+ gap: 0.5rem;
100
+ }
101
+
102
+ @include media-breakpoint-down(sm) {
103
+ flex-direction: row;
102
104
  align-items: start;
103
105
  gap: 0.5rem;
104
106
  margin-top: 0.5rem;
105
107
  white-space: nowrap;
108
+ flex-wrap: wrap;
106
109
  }
107
110
  }
108
111
 
@@ -113,10 +116,4 @@
113
116
  margin-top: 1rem;
114
117
  height: 100%;
115
118
  }
116
-
117
- .booking {
118
- @include media-breakpoint-down(sm) {
119
- height: 13rem;
120
- }
121
- }
122
119
  }