Skip to content

Commit a346d83

Browse files
committed
Uses shared rule styles
1 parent d856631 commit a346d83

File tree

6 files changed

+82
-91
lines changed

6 files changed

+82
-91
lines changed

src/webviews/apps/plus/graph/actions/gitActionsButtons.ts

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,8 @@ import { pluralize } from '../../../../../system/string';
55
import { createWebviewCommandLink } from '../../../../../system/webview';
66
import type { BranchState, State } from '../../../../plus/graph/protocol';
77
import { inlineCode } from '../../../shared/components/styles/lit/base.css';
8-
import { actionButton, linkBase, ruleBase } from '../styles/graph.css';
8+
import { ruleStyles } from '../../shared/components/vscode.css';
9+
import { actionButton, linkBase } from '../styles/graph.css';
910
import '../../../shared/components/code-icon';
1011
import '../../../shared/components/overlays/tooltip';
1112

@@ -61,7 +62,7 @@ export class GitActionsButtons extends LitElement {
6162

6263
@customElement('gl-fetch-button')
6364
export class GlFetchButton extends LitElement {
64-
static override styles = [linkBase, inlineCode, actionButton, ruleBase];
65+
static override styles = [linkBase, inlineCode, actionButton, ruleStyles];
6566

6667
@property({ type: Object })
6768
state!: State;
@@ -114,7 +115,7 @@ export class PushPullButton extends LitElement {
114115
linkBase,
115116
inlineCode,
116117
actionButton,
117-
ruleBase,
118+
ruleStyles,
118119
css`
119120
:host {
120121
display: contents;

src/webviews/apps/plus/graph/graph-header.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -47,9 +47,10 @@ import { ipcContext } from '../../shared/contexts/ipc';
4747
import type { TelemetryContext } from '../../shared/contexts/telemetry';
4848
import { telemetryContext } from '../../shared/contexts/telemetry';
4949
import { emitTelemetrySentEvent } from '../../shared/telemetry';
50+
import { ruleStyles } from '../shared/components/vscode.css';
5051
import { stateContext } from './context';
5152
import { graphStateContext } from './stateProvider';
52-
import { actionButton, linkBase, ruleBase } from './styles/graph.css';
53+
import { actionButton, linkBase } from './styles/graph.css';
5354
import { graphHeaderControlStyles, progressStyles, repoHeaderStyles, titlebarStyles } from './styles/header.css';
5455
import '@shoelace-style/shoelace/dist/components/option/option.js';
5556
import '@shoelace-style/shoelace/dist/components/select/select.js';
@@ -108,7 +109,7 @@ export class GlGraphHeader extends SignalWatcher(LitElement) {
108109
static override styles = [
109110
inlineCode,
110111
linkBase,
111-
ruleBase,
112+
ruleStyles,
112113
actionButton,
113114
titlebarStyles,
114115
repoHeaderStyles,

src/webviews/apps/plus/graph/styles/graph.css.ts

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -15,13 +15,6 @@ export const linkBase = css`
1515
}
1616
`;
1717

18-
export const ruleBase = css`
19-
hr {
20-
border: none;
21-
border-top: 1px solid var(--color-foreground--25);
22-
}
23-
`;
24-
2518
export const actionButton = css`
2619
.action-button {
2720
position: relative;

src/webviews/apps/plus/shared/components/account-chip.ts

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@ import { elementBase, linkBase } from '../../../shared/components/styles/lit/bas
2525
import type { PromosContext } from '../../../shared/contexts/promos';
2626
import { promosContext } from '../../../shared/contexts/promos';
2727
import { chipStyles } from './chipStyles';
28+
import { ruleStyles } from './vscode.css';
2829
import '../../../shared/components/button';
2930
import '../../../shared/components/button-container';
3031
import '../../../shared/components/code-icon';
@@ -42,6 +43,7 @@ export class GlAccountChip extends LitElement {
4243
linkBase,
4344
focusableBaseStyles,
4445
chipStyles,
46+
ruleStyles,
4547
css`
4648
:host {
4749
display: inline-flex;
@@ -200,11 +202,6 @@ export class GlAccountChip extends LitElement {
200202
margin-left: 0.4rem;
201203
}
202204
203-
hr {
204-
border: none;
205-
border-top: 1px solid var(--color-foreground--25);
206-
}
207-
208205
.upgrade > * {
209206
margin-block: 0.8rem 0;
210207
}

src/webviews/apps/plus/timeline/timeline.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ import { GlAppHost } from '../../shared/appHost';
2020
import type { Checkbox } from '../../shared/components/checkbox/checkbox';
2121
import type { GlRefButton } from '../../shared/components/ref-button';
2222
import type { HostIpc } from '../../shared/ipc';
23-
import { linkStyles } from '../shared/components/vscode.css';
23+
import { linkStyles, ruleStyles } from '../shared/components/vscode.css';
2424
import type { CommitEventDetail, GlTimelineChart } from './components/chart';
2525
import { TimelineStateProvider } from './stateProvider';
2626
import { timelineBaseStyles, timelineStyles } from './timeline.css';
@@ -44,7 +44,7 @@ export class GlTimelineApp extends GlAppHost<State> {
4444
delegatesFocus: true,
4545
};
4646

47-
static override styles = [linkStyles, timelineBaseStyles, timelineStyles];
47+
static override styles = [linkStyles, ruleStyles, timelineBaseStyles, timelineStyles];
4848

4949
@query('#chart')
5050
private _chart?: GlTimelineChart;

src/webviews/apps/shared/components/markdown/markdown.ts

Lines changed: 71 additions & 72 deletions
Original file line numberDiff line numberDiff line change
@@ -5,92 +5,91 @@ import { until } from 'lit/directives/until.js';
55
import type { RendererObject, RendererThis, Tokens } from 'marked';
66
import { marked } from 'marked';
77
import type { ThemeIcon } from 'vscode';
8+
import { ruleStyles } from '../../../plus/shared/components/vscode.css';
89

910
@customElement('gl-markdown')
1011
export class GlMarkdown extends LitElement {
11-
static override styles = css`
12-
a,
13-
a code {
14-
text-decoration: none;
15-
color: var(--vscode-textLink-foreground);
16-
}
17-
18-
a:hover,
19-
a:hover code {
20-
color: var(--vscode-textLink-activeForeground);
21-
}
12+
static override styles = [
13+
ruleStyles,
14+
css`
15+
a,
16+
a code {
17+
text-decoration: none;
18+
color: var(--vscode-textLink-foreground);
19+
}
2220
23-
a:hover:not(.disabled) {
24-
cursor: pointer;
25-
}
21+
a:hover,
22+
a:hover code {
23+
color: var(--vscode-textLink-activeForeground);
24+
}
2625
27-
p,
28-
.code,
29-
ul,
30-
h1,
31-
h2,
32-
h3,
33-
h4,
34-
h5,
35-
h6 {
36-
margin: 8px 0;
37-
}
26+
a:hover:not(.disabled) {
27+
cursor: pointer;
28+
}
3829
39-
h1,
40-
h2,
41-
h3,
42-
h4,
43-
h5,
44-
h6 {
45-
line-height: 1.1;
46-
}
30+
p,
31+
.code,
32+
ul,
33+
h1,
34+
h2,
35+
h3,
36+
h4,
37+
h5,
38+
h6 {
39+
margin: 8px 0;
40+
}
4741
48-
code {
49-
background: var(--vscode-textCodeBlock-background);
50-
border-radius: 3px;
51-
padding: 0px 4px 2px 4px;
52-
font-family: var(--vscode-editor-font-family);
53-
}
42+
h1,
43+
h2,
44+
h3,
45+
h4,
46+
h5,
47+
h6 {
48+
line-height: 1.1;
49+
}
5450
55-
code code-icon {
56-
color: inherit;
57-
font-size: inherit;
58-
vertical-align: middle;
59-
}
51+
code {
52+
background: var(--vscode-textCodeBlock-background);
53+
border-radius: 3px;
54+
padding: 0px 4px 2px 4px;
55+
font-family: var(--vscode-editor-font-family);
56+
}
6057
61-
hr {
62-
border: none;
63-
border-top: 1px solid var(--color-foreground--25);
64-
}
58+
code code-icon {
59+
color: inherit;
60+
font-size: inherit;
61+
vertical-align: middle;
62+
}
6563
66-
p:first-child,
67-
.code:first-child,
68-
ul:first-child {
69-
margin-top: 0;
70-
}
64+
p:first-child,
65+
.code:first-child,
66+
ul:first-child {
67+
margin-top: 0;
68+
}
7169
72-
p:last-child,
73-
.code:last-child,
74-
ul:last-child {
75-
margin-bottom: 0;
76-
}
70+
p:last-child,
71+
.code:last-child,
72+
ul:last-child {
73+
margin-bottom: 0;
74+
}
7775
78-
/* MarkupContent Layout */
79-
ul {
80-
padding-left: 20px;
81-
}
82-
ol {
83-
padding-left: 20px;
84-
}
76+
/* MarkupContent Layout */
77+
ul {
78+
padding-left: 20px;
79+
}
80+
ol {
81+
padding-left: 20px;
82+
}
8583
86-
li > p {
87-
margin-bottom: 0;
88-
}
84+
li > p {
85+
margin-bottom: 0;
86+
}
8987
90-
li > ul {
91-
margin-top: 0;
92-
}
93-
`;
88+
li > ul {
89+
margin-top: 0;
90+
}
91+
`,
92+
];
9493

9594
@property({ type: String })
9695
private markdown = '';

0 commit comments

Comments
 (0)