Skip to content

Commit 4e6eb15

Browse files
committed
styling overhaul
1 parent b75d396 commit 4e6eb15

File tree

7 files changed

+84
-114
lines changed

7 files changed

+84
-114
lines changed

README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -105,4 +105,4 @@ sf org assign permset --name flow_scanner__Flow_Scanner
105105
sf project sync
106106
```
107107

108-
Want to help improve [Lightning Flow Scanner](https://flow-scanner.github.io/lightning-flow-scanner-core/)? See our [Contributing Guidelines](https://github.com/Flow-Scanner/lightning-flow-scanner-core/blob/main/CONTRIBUTING.md).
108+
Want to help improve [Lightning Flow Scanner](https://flow-scanner.github.io/lightning-flow-scanner-core/)? See our [Contributing Guidelines](https://github.com/Flow-Scanner/lightning-flow-scanner-core?tab=contributing-ov-file).

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

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,9 +43,14 @@ lightning-card {
4343
margin: 0;
4444
}
4545

46-
.toolbar-item {
46+
/* .toolbar-item {
4747
flex: 1 1 auto;
4848
min-width: 120px;
49+
} */
50+
.toolbar-item {
51+
flex: 0 0 auto;
52+
min-width: 120px;
53+
max-width: 200px; /* Add consistent max width for search inputs */
4954
}
5055

5156
/* Search inputs in toolbar */
Lines changed: 39 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -1,52 +1,36 @@
11
<template>
22
<div slot="title" class="slds-grid slds-grid_vertical-align-center slds-p-around_xx-small toolbar-row">
33

4-
<!-- Icon -->
5-
<div class="toolbar-icon">
6-
<lightning-icon icon-name="custom:custom19" size="small"></lightning-icon>
7-
</div>
4+
<!-- Icon -->
5+
<div class="toolbar-icon">
6+
<lightning-icon icon-name="custom:custom19" size="small"></lightning-icon>
7+
</div>
88

9-
<!-- Title -->
10-
<div class="toolbar-title slds-p-left_x-small">
11-
<h2 class="slds-text-heading_small slds-truncate">Flows</h2>
12-
</div>
9+
<!-- Title -->
10+
<div class="toolbar-title slds-p-left_x-small">
11+
<h2 class="slds-text-heading_small slds-truncate">Flows</h2>
12+
</div>
1313

14-
<!-- Name / Label -->
15-
<div class="toolbar-item slds-p-left_x-small">
16-
<lightning-input
17-
type="search"
18-
placeholder="Name or Label"
19-
onkeyup={handleNameKeyUp}
20-
variant="label-hidden"
21-
class="compact-input"
22-
></lightning-input>
23-
</div>
14+
<!-- Name / Label -->
15+
<div class="toolbar-item slds-p-left_x-small">
16+
<lightning-input type="search" placeholder="Name or Label" onkeyup={handleNameKeyUp} variant="label-hidden"
17+
class="compact-input"></lightning-input>
18+
</div>
2419

25-
<!-- Flow Type -->
26-
<div class="toolbar-item slds-p-left_x-small">
27-
<lightning-input
28-
type="search"
29-
placeholder="Flow Type"
30-
onkeyup={handleTypeKeyUp}
31-
variant="label-hidden"
32-
class="compact-input"
33-
></lightning-input>
34-
</div>
20+
<!-- Flow Type -->
21+
<div class="toolbar-item slds-p-left_x-small">
22+
<lightning-input type="search" placeholder="Flow Type" onkeyup={handleTypeKeyUp} variant="label-hidden"
23+
class="compact-input"></lightning-input>
24+
</div>
3525

36-
<!-- Active Toggle -->
37-
<div class="toolbar-item slds-p-left_x-small slds-align-middle">
38-
<lightning-input
39-
type="toggle"
40-
label="Active"
41-
checked={activeOnly}
42-
onchange={handleToggleChange}
43-
class="compact-toggle"
44-
variant="label-hidden"
45-
></lightning-input>
46-
</div>
26+
<!-- Active Toggle -->
27+
<div class="toolbar-item slds-p-left_x-small slds-align-middle">
28+
<lightning-input type="toggle" label="Active" checked={activeOnly} onchange={handleToggleChange}
29+
class="compact-toggle" variant="label-hidden"></lightning-input>
4730
</div>
31+
</div>
4832
<lightning-card>
49-
33+
5034

5135
<!-- Table & footer remain unchanged -->
5236
<template if:true={err}>
@@ -59,27 +43,27 @@ <h2 class="slds-text-heading_small slds-truncate">Flows</h2>
5943

6044
<template if:true={displayedRecords.length}>
6145
<div class="custom-datatable">
62-
<lightning-datatable
63-
key-field="id"
64-
data={displayedRecords}
65-
columns={columns}
66-
hide-checkbox-column="true"
67-
onrowaction={handleRowAction}
68-
onsort={handleSort}
69-
sorted-by={sortedBy}
70-
sorted-direction={sortedDirection}
71-
></lightning-datatable>
46+
<lightning-datatable key-field="id" data={displayedRecords} columns={columns}
47+
hide-checkbox-column="true" onrowaction={handleRowAction} onsort={handleSort} sorted-by={sortedBy}
48+
sorted-direction={sortedDirection}></lightning-datatable>
7249
</div>
7350
</template>
7451

7552
<template if:true={hasMoreRecords}>
7653
<div slot="footer" class="slds-p-horizontal_small">
77-
<lightning-button
78-
label="Load More"
79-
variant="brand"
80-
onclick={handleLoadMore}
81-
></lightning-button>
54+
<lightning-button label="Load More" variant="brand" onclick={handleLoadMore}></lightning-button>
8255
</div>
8356
</template>
8457
</lightning-card>
58+
<!-- Footer -->
59+
<div class="footer">
60+
<div class="github-info">
61+
Want to help improve&nbsp;
62+
<a href="https://flow-scanner.github.io/lightning-flow-scanner-core/" target="_blank">Lightning Flow
63+
Scanner</a>
64+
?&nbsp;See our&nbsp;
65+
<a href="https://github.com/Flow-Scanner/lightning-flow-scanner-core?tab=contributing-ov-file"
66+
target="_blank">Contributing Guidelines</a>.
67+
</div>
68+
</div>
8569
</template>

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

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -95,10 +95,10 @@
9595
width: 100%;
9696
gap: 0.5rem;
9797
padding: 0.25rem 0.5rem;
98-
background-color: #003087; /* same as header/card */
98+
background-color: #003087;
9999
color: #ffffff;
100100
margin: 0 !important;
101-
justify-content: space-between; /* Spread items to push button to the right */
101+
justify-content: space-between;
102102
}
103103

104104
.toolbar-icon {
@@ -121,17 +121,18 @@
121121
color: #ffffff;
122122
}
123123

124-
.toolbar-item {
125-
flex: 0 0 auto; /* Prevent stretching */
126-
min-width: 120px;
124+
.toolbar-item {
125+
flex: 0 0 auto;
126+
min-width: 120px;
127+
max-width: 200px; /* Add consistent max width for search inputs */
127128
}
128129

129130
.toolbar-button-container {
130131
flex: 0 0 auto;
131132
margin-left: auto;
132-
padding: 0; /* Remove padding */
133-
display: flex; /* Add flex to prevent extra space */
134-
align-items: center; /* Align vertically */
133+
padding: 0;
134+
display: flex;
135+
align-items: center;
135136
}
136137

137138
.toolbar-stats {

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

Lines changed: 17 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -76,44 +76,31 @@
7676
<template if:true={isAllMode}>
7777
<div class="all-mode-container">
7878
<template if:true={allScanResults}>
79-
<div slot="title" class="slds-grid slds-grid_vertical-align-center slds-grid_align-spread toolbar-row">
79+
<div slot="title"
80+
class="slds-grid slds-grid_vertical-align-center slds-grid_align-spread toolbar-row">
8081
<div class="toolbar-icon">
8182
<lightning-icon icon-name="standard:work_order" size="small"></lightning-icon>
8283
</div>
8384
<div class="toolbar-title slds-p-left_x-small">
8485
<h2 class="slds-text-heading_small slds-truncate">All Results</h2>
8586
</div>
8687
<div class="toolbar-item slds-p-left_x-small">
87-
<lightning-input
88-
type="search"
89-
placeholder="Flow Name"
90-
onkeyup={handleFlowNameFilter}
91-
variant="label-hidden"
92-
class="compact-input"
93-
></lightning-input>
88+
<lightning-input type="search" placeholder="Flow Name" onkeyup={handleFlowNameFilter}
89+
variant="label-hidden" class="compact-input"></lightning-input>
9490
</div>
9591
<div class="toolbar-item slds-p-left_x-small">
96-
<lightning-input
97-
type="search"
98-
placeholder="Search All Fields"
99-
onkeyup={handleOtherFieldsFilter}
100-
variant="label-hidden"
101-
class="compact-input"
102-
></lightning-input>
92+
<lightning-input type="search" placeholder="Search All Fields"
93+
onkeyup={handleOtherFieldsFilter} variant="label-hidden"
94+
class="compact-input"></lightning-input>
10395
</div>
10496
<div class="toolbar-item slds-p-left_x-small">
10597
<span class="slds-text-body_small toolbar-stats">
10698
<strong>Violations: {displayedViolationsCount} / {totalViolationsCount}</strong>
10799
</span>
108100
</div>
109101
<div class="toolbar-item toolbar-button-container">
110-
<lightning-button
111-
label="Export CSV"
112-
icon-name="utility:download"
113-
onclick={handleDownload}
114-
variant="brand"
115-
class="slds-button slds-button_brand"
116-
></lightning-button>
102+
<lightning-button label="Export CSV" icon-name="utility:download" onclick={handleDownload}
103+
variant="brand" class="slds-button slds-button_brand"></lightning-button>
117104
</div>
118105
</div>
119106
<lightning-card>
@@ -175,24 +162,18 @@ <h2 class="slds-text-heading_small slds-truncate">All Results</h2>
175162
<div class="footer">
176163
<div class="github-info">
177164
Want to help improve&nbsp;
178-
<a href="https://flow-scanner.github.io/lightning-flow-scanner-core/" target="_blank">Lightning Flow Scanner</a>
165+
<a href="https://flow-scanner.github.io/lightning-flow-scanner-core/" target="_blank">Lightning Flow
166+
Scanner</a>
179167
?&nbsp;See our&nbsp;
180-
<a href="https://github.com/Flow-Scanner/lightning-flow-scanner-core/blob/main/CONTRIBUTING.md" target="_blank">Contributing Guidelines</a>.
168+
<a href="https://github.com/Flow-Scanner/lightning-flow-scanner-core?tab=contributing-ov-file"
169+
target="_blank">Contributing Guidelines</a>.
181170
</div>
182171
<template if:false={isAllMode}>
183172
<div class="navigation-buttons">
184-
<lightning-button
185-
label="Previous Flow"
186-
variant="brand"
187-
disabled={isFirstFlow}
188-
onclick={handlePreviousFlow}
189-
></lightning-button>
190-
<lightning-button
191-
label="Next Flow"
192-
variant="brand"
193-
disabled={isLastFlow}
194-
onclick={handleNextFlow}
195-
></lightning-button>
173+
<lightning-button label="Previous Flow" variant="brand" disabled={isFirstFlow}
174+
onclick={handlePreviousFlow}></lightning-button>
175+
<lightning-button label="Next Flow" variant="brand" disabled={isLastFlow}
176+
onclick={handleNextFlow}></lightning-button>
196177
</div>
197178
</template>
198179
</div>

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

Lines changed: 4 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -20,24 +20,15 @@
2020
onsearch={handleSearch} onloadmore={handleLoadMore}></c-flow-overview>
2121
</template>
2222
<template if:true={isTab2Active}>
23-
<c-lightning-flow-scanner
24-
name={flowName}
25-
metadata={flowMetadata}
26-
scan-result={scanResult}
27-
all-scan-results={allScanResults}
28-
number-of-rules={numberOfRules}
29-
error={err}
30-
records={records}
31-
selected-flow-record={selectedFlowRecord}
32-
onnavigateflow={handleNavigateFlow}
33-
></c-lightning-flow-scanner>
23+
<c-lightning-flow-scanner name={flowName} metadata={flowMetadata} scan-result={scanResult}
24+
all-scan-results={allScanResults} number-of-rules={numberOfRules} error={err} records={records}
25+
selected-flow-record={selectedFlowRecord}
26+
onnavigateflow={handleNavigateFlow}></c-lightning-flow-scanner>
3427
</template>
3528
<template if:true={isTab3Active}>
3629
<c-scan-configurator rules={rules} onrulechange={handleRuleChange}></c-scan-configurator>
3730
</template>
3831
</div>
39-
40-
4132
</div>
4233
<template if:true={isLoading}>
4334
<lightning-spinner alternative-text="Loading" size="medium"></lightning-spinner>

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

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -54,4 +54,12 @@
5454
</p>
5555
</template>
5656
</lightning-card>
57+
<div class="footer">
58+
<div class="github-info">
59+
Want to help improve&nbsp;
60+
<a href="https://flow-scanner.github.io/lightning-flow-scanner-core/" target="_blank">Lightning Flow Scanner</a>
61+
?&nbsp;See our&nbsp;
62+
<a href="https://github.com/Flow-Scanner/lightning-flow-scanner-core?tab=contributing-ov-file" target="_blank">Contributing Guidelines</a>.
63+
</div>
64+
</div>
5765
</template>

0 commit comments

Comments
 (0)