pacem-less 0.20.1 → 0.20.2-baalbek

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.
Files changed (9) hide show
  1. package/pacem/scaffolding/dark/index.less +1 -0
  2. package/pacem/scaffolding/dark/namevalue-list.less +8 -0
  3. package/pacem/{ui → scaffolding}/dark/snapshot.less +30 -38
  4. package/pacem/scaffolding/dark/tags.less +1 -1
  5. package/pacem/text-overrides.less +1 -1
  6. package/pacem/ui/dark/index.less +0 -1
  7. package/pacem/ui/dark/tuner.less +21 -4
  8. package/pacem/ui/shared.less +2 -0
  9. package/package.json +1 -1
package/pacem/scaffolding/dark/index.less CHANGED
@@ -44,6 +44,7 @@ label.@{PCSS}-label{
44
44
  @import "number";
45
45
  @import "suggest";
46
46
  @import "tags";
47
+ @import "snapshot";
47
48
  @import "image";
48
49
  @import "slider";
49
50
  @import "char-counter";
package/pacem/scaffolding/dark/namevalue-list.less CHANGED
@@ -2,4 +2,12 @@
2
2
 
3
3
  @{P}-namevalue-list {
4
4
  display: block;
5
+
6
+ &.@{PCSS}-readonly {
7
+ .@{PCSS}-fieldset .@{PCSS}-fieldgroup .fieldgroup-prepend,
8
+ .@{PCSS}-fieldset .@{PCSS}-fieldgroup .fieldgroup-append {
9
+ border: none;
10
+ width: @input_padding_horiz;
11
+ }
12
+ }
5
13
  }
package/pacem/{ui → scaffolding}/dark/snapshot.less RENAMED
@@ -1,4 +1,6 @@
1
- @import "../shared";
1
+ @import "../../../shared";
2
+ @import "../shared";
3
+
2
4
 
3
5
  .@{PCSS}-brightout {
4
6
  -moz-animation: bright-out 1s 1 normal;
@@ -41,17 +43,19 @@
41
43
  height: @_dim_h + 2 * @_brd;
42
44
 
43
45
  .@{PCSS}-snapshot {
44
- position: relative;
45
46
  height: 100%;
46
47
  width: 100%;
47
- display: flex;
48
+ display: grid;
49
+ grid-template-rows: auto 1fr;
50
+ grid-template-columns: auto 1fr auto;
51
+ grid-template-areas: "topleft center topright" "left center right";
48
52
  justify-content: center;
49
53
  align-items: center;
50
54
 
51
55
  &.@{PCSS}-ongoing {
52
56
  }
53
57
 
54
- @{P}-button {
58
+ @{P}-button {
55
59
  // default: disabled
56
60
  .ButtonHidden();
57
61
  color: @color_light;
@@ -66,20 +70,20 @@
66
70
  }
67
71
  }
68
72
  // cascade-based visibility
69
- &.@{PCSS}-steady @{P}-button.@{PCSS}-camera,
70
- &.@{PCSS}-preview @{P}-button.@{PCSS}-confirm,
71
- &.@{PCSS}-ongoing @{P}-button.@{PCSS}-undo,
72
- &.@{PCSS}-video @{P}-button.@{PCSS}-countdown {
73
+ &.snapshot-steady @{P}-button.snapshot-camera,
74
+ &.snapshot-preview @{P}-button.snapshot-confirm,
75
+ &.snapshot-ongoing @{P}-button.snapshot-undo,
76
+ &.snapshot-video @{P}-button.snapshot-countdown {
73
77
  .ButtonVisible();
74
78
  }
75
79
 
76
- &.@{PCSS}-video @{P}-button.@{PCSS}-countdown {
80
+ &.snapshot-video @{P}-button.snapshot-countdown {
77
81
  pointer-events: /*still*/ none;
78
82
  }
79
83
  // taking picture vs countdown rolling
80
84
  &.@{PCSS}-video.@{PCSS}-countdown {
81
85
 
82
- @{P}-button.@{PCSS}-countdown {
86
+ @{P}-button.@{PCSS}-countdown {
83
87
  font-size: @grid_spacing;
84
88
  text-align: center;
85
89
 
@@ -89,27 +93,22 @@
89
93
  }
90
94
  }
91
95
 
92
- .@{PCSS}-camera {
93
- z-index: 1;
94
-
95
- &:before {
96
- .Icon('photo_camera');
97
- }
96
+ .snapshot-camera {
97
+ grid-area: center;
98
98
  }
99
99
 
100
- .@{PCSS}-undo:before {
100
+ .snapshot-undo:before {
101
101
  .Icon('arrow_back');
102
102
  }
103
103
 
104
- .@{PCSS}-confirm:before {
104
+ .snapshot-confirm:before {
105
105
  .Icon('check');
106
106
  color: @color_highlight;
107
107
  }
108
108
 
109
109
  canvas, video {
110
- position: absolute;
111
- top: 0;
112
- left: 0;
110
+ grid-row: 1 span 2;
111
+ grid-column: 1 span 3;
113
112
  width: 100%;
114
113
  height: 100%;
115
114
  box-sizing: border-box;
@@ -121,14 +120,14 @@
121
120
  pointer-events: none;
122
121
  }
123
122
 
124
- &.@{PCSS}-steady .@{PCSS}-preview,
125
- &.@{PCSS}-preview.@{PCSS}-taking .@{PCSS}-preview,
126
- &.@{PCSS}-video video {
123
+ &.snapshot-steady .snapshot-preview,
124
+ &.snapshot-preview.snapshot-taking .snapshot-preview,
125
+ &.snapshot-video video {
127
126
  visibility: visible;
128
127
  pointer-events: all;
129
128
  }
130
129
 
131
- &.@{PCSS}-preview.@{PCSS}-taking .@{PCSS}-preview {
130
+ &.snapshot-preview.snapshot-taking .snapshot-preview {
132
131
  border-color: @color_highlight;
133
132
  }
134
133
 
@@ -139,20 +138,13 @@
139
138
 
140
139
  @_pad: @grid_spacing/4;
141
140
 
142
- .@{PCSS}-confirm,
143
- .@{PCSS}-undo,
144
- .@{PCSS}-countdown {
145
- position: absolute;
146
- top: @_pad;
147
- }
148
-
149
- .@{PCSS}-undo {
150
- left: @_pad;
141
+ .snapshot-undo {
142
+ grid-area: topleft;
151
143
  }
152
144
 
153
- .@{PCSS}-confirm,
154
- .@{PCSS}-countdown {
155
- right: @_pad;
145
+ .snapshot-confirm,
146
+ .snapshot-countdown {
147
+ grid-area: topright;
156
148
  }
157
149
  }
158
150
  }
@@ -160,7 +152,7 @@
160
152
 
161
153
  .@{PCSS}-animations {
162
154
 
163
- @{P}-snapshot {
155
+ @{P}-snapshot {
164
156
  .Animatable(pop-anim, .4s, @easing_out_back);
165
157
  }
166
158
  }
package/pacem/scaffolding/dark/tags.less CHANGED
@@ -56,7 +56,7 @@
56
56
  ul.@{PCSS}-tags {
57
57
  display: flex;
58
58
  flex-flow: row wrap;
59
- align-items: flex-start;
59
+ align-items: center;
60
60
  justify-content: flex-start;
61
61
  padding-right: @_spacing;
62
62
 
package/pacem/text-overrides.less CHANGED
@@ -34,7 +34,7 @@
34
34
  }
35
35
 
36
36
  .text-disabled {
37
- color: @color_watermark !important;
37
+ color: @color_disabled !important;
38
38
  }
39
39
 
40
40
  .text-strike {
package/pacem/ui/dark/index.less CHANGED
@@ -61,7 +61,6 @@
61
61
 
62
62
  // to be imported separately by the shell css
63
63
  // @import "menu";
64
- @import "snapshot";
65
64
  @import "binder";
66
65
  @import "markdown";
67
66
  @import "social";
package/pacem/ui/dark/tuner.less CHANGED
@@ -6,6 +6,7 @@
6
6
  display: block;
7
7
  position: relative;
8
8
 
9
+ &::part(@{PCSS}-tuner),
9
10
  canvas.@{PCSS}-tuner {
10
11
  width: 100%;
11
12
  height: 100%;
@@ -20,6 +21,7 @@
20
21
  }
21
22
  }
22
23
 
24
+ &::part(@{PCSS}-content),
23
25
  .@{PCSS}-content {
24
26
  position: absolute;
25
27
  display: flex;
@@ -49,42 +51,49 @@
49
51
  }
50
52
  // coloring
51
53
  &.tuner-accent {
54
+ &::part(@{PCSS}-tuner),
52
55
  canvas.@{PCSS}-tuner {
53
56
  stroke: @color_accent;
54
57
  }
55
58
  }
56
59
 
57
60
  &.tuner-warning {
61
+ &::part(@{PCSS}-tuner),
58
62
  canvas.@{PCSS}-tuner {
59
63
  stroke: @color_warning;
60
64
  }
61
65
  }
62
66
 
63
67
  &.tuner-success {
68
+ &::part(@{PCSS}-tuner),
64
69
  canvas.@{PCSS}-tuner {
65
70
  stroke: @color_success;
66
71
  }
67
72
  }
68
73
 
69
74
  &.tuner-danger {
75
+ &::part(@{PCSS}-tuner),
70
76
  canvas.@{PCSS}-tuner {
71
77
  stroke: @color_danger;
72
78
  }
73
79
  }
74
80
 
75
81
  &.tuner-error {
82
+ &::part(@{PCSS}-tuner),
76
83
  canvas.@{PCSS}-tuner {
77
84
  stroke: @color_error;
78
85
  }
79
86
  }
80
87
 
81
88
  &.tuner-primary {
89
+ &::part(@{PCSS}-tuner),
82
90
  canvas.@{PCSS}-tuner {
83
91
  stroke: @color_primary;
84
92
  }
85
93
  }
86
94
 
87
95
  &.tuner-thin {
96
+ &::part(@{PCSS}-tuner),
88
97
  canvas.@{PCSS}-tuner {
89
98
  stroke-width: 3px;
90
99
  }
@@ -97,9 +106,13 @@
97
106
  background-repeat: no-repeat;
98
107
  background-size: 100%;
99
108
 
100
- @{P}-tuner canvas.@{PCSS}-tuner {
101
- stroke-width: 3px !important;
102
- border-color: fade(@clr, 10);
109
+ @{P}-tuner {
110
+
111
+ &::part(@{PCSS}-tuner),
112
+ canvas.@{PCSS}-tuner {
113
+ stroke-width: 3px !important;
114
+ border-color: fade(@clr, 10);
115
+ }
103
116
  }
104
117
  }
105
118
 
@@ -109,6 +122,10 @@
109
122
  background-size: 100%;
110
123
  transition: @easing_out_sine .25s;
111
124
  padding: @grid_spacing/3;
125
+ display: flex;
126
+ align-items:center;
127
+ justify-content: center;
128
+ .TunerWrapper(@color_default);
112
129
 
113
130
  &.tuner-accent {
114
131
  .TunerWrapper(@color_accent);
@@ -138,7 +155,7 @@
138
155
  .@{PCSS}-animations {
139
156
 
140
157
  .@{PCSS}-tuner-wrapper,
141
- @{P}-tuner {
158
+ @{P}-tuner {
142
159
  .Animatable(pop-anim, .4s, @easing_out_back);
143
160
  }
144
161
  }
package/pacem/ui/shared.less CHANGED
@@ -94,10 +94,12 @@
94
94
  width: @_outer_radius;
95
95
  height: @_outer_radius;
96
96
 
97
+ &::part(@{PCSS}-tuner),
97
98
  canvas.@{PCSS}-tuner {
98
99
  stroke-width: @_thickness;
99
100
  }
100
101
 
102
+ &::part(@{PCSS}-content),
101
103
  .@{PCSS}-content {
102
104
  width: @_outer_radius;
103
105
  height: @_outer_radius;
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "0.20.1",
2
+ "version": "0.20.2-baalbek",
3
3
  "name": "pacem-less",
4
4
  "homepage": "https://js.pacem.it",
5
5
  "repository": {