Skip to content

Commit 03aea15

Browse files
committed
fix: major css cleanup
1 parent acbc9b5 commit 03aea15

File tree

38 files changed

+247
-273
lines changed

38 files changed

+247
-273
lines changed
Lines changed: 4 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,5 @@
1-
c-clock {
2-
border: solid var(--lwc-borderWidthThin, 1px) #ecebea;
3-
border-radius: var(--lwc-borderRadiusMedium, 4px);
4-
padding: 14px var(--lwc-varSpacingXSmall, 8px)
5-
var(--lwc-varSpacingXSmall, 8px) var(--lwc-varSpacingXSmall, 8px);
6-
margin-top: var(--lwc-varSpacingSmall, 12px);
7-
}
8-
9-
c-clock:before {
10-
content: 'c-clock';
11-
color: rgb(221, 219, 218);
12-
position: absolute;
13-
top: -10px;
14-
left: var(--lwc-varSpacingXxSmall, 4px);
15-
background-color: var(--lwc-colorBackgroundAlt, #ffffff);
16-
padding: 0 var(--lwc-varSpacingXxSmall, 4px);
1+
fieldset {
2+
border: solid var(--slds-g-sizing-border-1)
3+
var(--slds-g-color-neutral-base-80);
4+
border-radius: var(--slds-g-radius-border-2);
175
}

force-app/main/default/lwc/apiMethod/apiMethod.html

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,10 @@
55
label="Refresh Time"
66
onclick={handleRefresh}
77
></lightning-button>
8-
<c-clock class="slds-show slds-is-relative"></c-clock>
8+
<fieldset class="slds-var-p-around_x-small">
9+
<legend>c-clock</legend>
10+
<c-clock></c-clock>
11+
</fieldset>
912
</div>
1013

1114
<c-view-source source="lwc/apiMethod" slot="footer">
Lines changed: 4 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,5 @@
1-
c-chart-bar {
2-
border: solid var(--lwc-borderWidthThin, 1px) #ecebea;
3-
border-radius: var(--lwc-borderRadiusMedium, 4px);
4-
padding: 10px var(--lwc-varSpacingXxxSmall, 2px)
5-
var(--lwc-varSpacingXxxSmall, 2px) var(--lwc-varSpacingXxxSmall, 2px);
6-
margin-top: var(--lwc-varSpacingSmall, 12px);
7-
}
8-
9-
c-chart-bar:before {
10-
content: 'c-chart-bar';
11-
color: var(--slds-g-color-neutral-base-90, #dddbda);
12-
position: absolute;
13-
top: -10px;
14-
left: var(--lwc-varSpacingXxSmall, 4px);
15-
background-color: var(--lwc-colorBackgroundAlt, #ffffff);
16-
padding: 0 var(--lwc-varSpacingXxSmall, 4px);
1+
fieldset {
2+
border: solid var(--slds-g-sizing-border-1)
3+
var(--slds-g-color-neutral-base-80);
4+
border-radius: var(--slds-g-radius-border-2);
175
}

force-app/main/default/lwc/apiProperty/apiProperty.html

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,10 @@
99
value={percentage}
1010
onchange={handlePercentageChange}
1111
></lightning-input>
12-
<c-chart-bar
13-
class="slds-show slds-is-relative"
14-
percentage={percentage}
15-
></c-chart-bar>
12+
<fieldset class="slds-var-p-around_x-small">
13+
<legend>c-chart-bar</legend>
14+
<c-chart-bar percentage={percentage}></c-chart-bar>
15+
</fieldset>
1616
</div>
1717

1818
<c-view-source source="lwc/apiProperty" slot="footer">
Lines changed: 4 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,5 @@
1-
.todo-list {
2-
border: solid var(--lwc-borderWidthThin, 1px) #ecebea;
3-
border-radius: var(--lwc-borderRadiusMedium, 4px);
4-
padding: 14px var(--lwc-varSpacingXSmall, 8px)
5-
var(--lwc-varSpacingXSmall, 8px) var(--lwc-varSpacingXSmall, 8px);
6-
margin-top: var(--lwc-varSpacingSmall, 12px);
7-
}
8-
9-
.todo-list:before {
10-
content: 'c-todo-list';
11-
color: rgb(221, 219, 218);
12-
position: absolute;
13-
top: -10px;
14-
left: var(--lwc-varSpacingXxSmall, 4px);
15-
background-color: var(--lwc-colorBackgroundAlt, #ffffff);
16-
padding: 0 var(--lwc-varSpacingXxSmall, 4px);
1+
fieldset {
2+
border: solid var(--slds-g-sizing-border-1)
3+
var(--slds-g-color-neutral-base-80);
4+
border-radius: var(--slds-g-radius-border-2);
175
}

force-app/main/default/lwc/apiSetterGetter/apiSetterGetter.html

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -22,9 +22,10 @@
2222
onclick={handleSave}
2323
></lightning-button>
2424
</div>
25-
<div class="todo-list slds-is-relative">
25+
<fieldset class="slds-var-p-around_x-small">
26+
<legend>c-todo-list</legend>
2627
<c-todo-list todos={todos}></c-todo-list>
27-
</div>
28+
</fieldset>
2829
</div>
2930

3031
<c-view-source source="lwc/apiSetterGetter" slot="footer">
Lines changed: 4 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,5 @@
1-
c-child {
2-
position: relative;
3-
border: solid 1px #ecebea;
4-
border-radius: 4px;
5-
display: block;
6-
padding: 14px 8px 8px 8px;
7-
margin-top: 16px;
8-
}
9-
10-
c-child:before {
11-
content: 'c-child';
12-
color: #dddbda;
13-
position: absolute;
14-
top: -16px;
15-
left: 4px;
16-
background-color: #ffffff;
17-
padding: 0 4px;
1+
fieldset {
2+
border: solid var(--slds-g-sizing-border-1)
3+
var(--slds-g-color-neutral-base-80);
4+
border-radius: var(--slds-g-radius-border-2);
185
}

force-app/main/default/lwc/apiSpread/apiSpread.html

Lines changed: 18 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,24 @@
11
<template>
22
<lightning-card title="ApiSpread" icon-name="custom:custom14">
33
<div class="slds-var-m-around_medium">
4-
<lightning-input
5-
name="firstName"
6-
label="First Name"
7-
onchange={handleChange}
8-
value={props.firstName}
9-
></lightning-input>
10-
<lightning-input
11-
name="lastName"
12-
label="Last Name"
13-
onchange={handleChange}
14-
value={props.lastName}
15-
></lightning-input>
16-
<c-child lwc:spread={props}></c-child>
4+
<div class="slds-var-m-bottom_small">
5+
<lightning-input
6+
name="firstName"
7+
label="First Name"
8+
onchange={handleChange}
9+
value={props.firstName}
10+
></lightning-input>
11+
<lightning-input
12+
name="lastName"
13+
label="Last Name"
14+
onchange={handleChange}
15+
value={props.lastName}
16+
></lightning-input>
17+
</div>
18+
<fieldset class="slds-var-p-around_x-small">
19+
<legend>c-child</legend>
20+
<c-child lwc:spread={props}></c-child>
21+
</fieldset>
1722
</div>
1823

1924
<c-view-source source="lwc/apiSpread" slot="footer">

force-app/main/default/lwc/chartBar/chartBar.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
}
55

66
.bar {
7-
margin-left: 4px;
7+
margin-left: var(--slds-g-spacing-1, 4px);
88
height: 36px;
99
background-color: #f5b041;
1010
}
Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,5 @@
1-
@import 'c/cssLibrary';
1+
fieldset {
2+
border: solid var(--slds-g-sizing-border-1)
3+
var(--slds-g-color-neutral-base-80);
4+
border-radius: var(--slds-g-radius-border-2);
5+
}

0 commit comments

Comments
 (0)