@design.estate/dees-wcctools 3.0.0 → 3.1.0

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@design.estate/dees-wcctools",
3
- "version": "3.0.0",
3
+ "version": "3.1.0",
4
4
  "private": false,
5
5
  "description": "A set of web component tools for creating element catalogues, enabling the structured development and documentation of custom elements and pages.",
6
6
  "exports": {
@@ -3,6 +3,6 @@
3
3
  */
4
4
  export const commitinfo = {
5
5
  name: '@design.estate/dees-wcctools',
6
- version: '3.0.0',
6
+ version: '3.1.0',
7
7
  description: 'A set of web component tools for creating element catalogues, enabling the structured development and documentation of custom elements and pages.'
8
8
  }
@@ -100,7 +100,7 @@ export class WccProperties extends DeesElement {
100
100
  }
101
101
  .grid {
102
102
  display: grid;
103
- grid-template-columns: 1fr 150px 350px 70px;
103
+ grid-template-columns: 1fr 150px 350px 100px;
104
104
  height: 100%;
105
105
  }
106
106
  .properties {
@@ -197,7 +197,8 @@ export class WccProperties extends DeesElement {
197
197
  }
198
198
 
199
199
  .viewportSelector,
200
- .themeSelector {
200
+ .themeSelector,
201
+ .shareSelector {
201
202
  user-select: none;
202
203
  background: transparent;
203
204
  display: flex;
@@ -219,6 +220,11 @@ export class WccProperties extends DeesElement {
219
220
  grid-template-columns: repeat(5, 1fr);
220
221
  flex: 1;
221
222
  }
223
+ .selectorButtons1 {
224
+ display: grid;
225
+ grid-template-columns: 1fr;
226
+ flex: 1;
227
+ }
222
228
  .button {
223
229
  display: flex;
224
230
  flex-direction: column;
@@ -671,12 +677,17 @@ export class WccProperties extends DeesElement {
671
677
  </div>
672
678
  </div>
673
679
  </div>
674
- <!-- Recording Button -->
675
- <wcc-record-button
676
- .state=${this.isRecording ? 'recording' : 'idle'}
677
- .duration=${this.recordingDuration}
678
- @record-click=${() => this.handleRecordButtonClick()}
679
- ></wcc-record-button>
680
+ <div class="shareSelector">
681
+ <div class="panelheading">Share</div>
682
+ <div class="selectorButtons1">
683
+ <div
684
+ class="button ${this.isRecording ? 'selected' : ''}"
685
+ @click=${() => this.handleRecordButtonClick()}
686
+ >
687
+ Record<i class="material-symbols-outlined">${this.isRecording ? 'stop_circle' : 'videocam'}</i>
688
+ </div>
689
+ </div>
690
+ </div>
680
691
  </div>
681
692
  ${this.warning ? html`<div class="warning">${this.warning}</div>` : null}
682
693
  </div>