gitbutlerapp/gitbutler
1
1
Fork 0
mirror of https://github.com/gitbutlerapp/gitbutler.git synced 2024-12-19 23:52:05 +03:00
Code Issues Packages Projects Releases Wiki Activity

Style fixes (#3383)

Browse Source 
* style update: segmented control for `Changes`

* style fix: hunk lines overlap with another class
This commit is contained in:
Pavel Laptev 2024-03-30 23:40:30 +01:00 committed by GitHub
parent f5ebbdfc09
commit c85c1e9758
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 20 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
gitbutler-ui/src/lib/components/BranchFilesHeader.svelte
View File

@ -68,8 +68,8 @@
</div>
</div>
<SegmentedControl bind:selected={selectedListMode} selectedIndex={0}>
<Segment id="list" icon="list-view" />
<Segment id="tree" icon="tree-view" />
<Segment id="list" icon="list-view" size="small" />
<Segment id="tree" icon="tree-view" size="small" />
</SegmentedControl>
</div>

2
gitbutler-ui/src/lib/components/NotOnGitButlerBranch.svelte
View File

@ -47,7 +47,7 @@
<ProjectNameLabel projectName={project?.title} />
</div>
<p class="switchrepo__title text-base-body-18 text-bold">
Looks like you've switched away from <span class="code-line"> gitbutler/integration </span>
Looks like you've switched away from <span class="code-string"> gitbutler/integration </span>
</p>
<p class="switchrepo__message text-base-body-13">

4
gitbutler-ui/src/lib/components/PullRequestPreview.svelte
View File

@ -37,11 +37,11 @@
{pullrequest.author?.name}
</span>
wants to merge into
<span class="code-line">
<span class="code-string">
{pullrequest.sourceBranch}
</span>
from
<span class="code-line">
<span class="code-string">
{pullrequest.targetBranch}
</span>
</div>

19
gitbutler-ui/src/lib/components/SegmentControl/Segment.svelte
View File

@ -8,6 +8,7 @@
export let disabled = false;
export let icon: keyof typeof iconsJson | undefined = undefined;
export let label: string | undefined = undefined;
export let size: 'small' | 'medium' = 'medium';
let ref: HTMLButtonElement | undefined;
const dispatcher = createEventDispatcher<{ select: string }>();
@ -31,7 +32,7 @@
<button
bind:this={ref}
class="btn"
class="segment-btn segment-{size}"
class:left={index == 0}
class:right={index == $length - 1}
role="tab"
@ -67,7 +68,7 @@
</button>
<style lang="postcss">
.btn {
.segment-btn {
cursor: pointer;
display: inline-flex;
flex-grow: 1;
@ -77,8 +78,6 @@
gap: var(--size-4);
height: var(--size-control-m);
background-color: var(--clr-theme-container-light);
padding: var(--size-4) var(--size-8);
border-top-width: 1px;
border-bottom-width: 1px;
@ -99,7 +98,6 @@
&[aria-selected='true'] {
background-color: var(--clr-theme-container-pale);
padding: var(--size-4) var(--size-8);
cursor: default;
@ -135,4 +133,15 @@
.label {
color: var(--clr-theme-scale-ntrl-30);
}
/* MODIFIERS */
.segment-small {
height: var(--size-control-s);
padding: var(--size-2) var(--size-4);
}
.segment-medium {
height: var(--size-control-m);
padding: var(--size-4) var(--size-8);
}
</style>

2
gitbutler-ui/src/styles/main.postcss
View File

@ -112,7 +112,7 @@ button {
}
/* CODE */
.code-line {
.code-string {
font-family: 'Spline Sans Mono', monospace;
border-radius: var(--radius-s);
background: color-mix(in srgb, var(--clr-theme-scale-ntrl-50), transparent 80%);