1
0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00

Consolidate sizing of horizontal line to t-shirts

Co-authored-by: Mikko Aspiala <mikko.aspiala@gmail.com>

Signed-off-by: Janne Savolainen <janne.savolainen@live.fi>
This commit is contained in:
Janne Savolainen 2022-10-19 14:19:27 +03:00
parent 8e8161e5fb
commit 911191fee0
No known key found for this signature in database
GPG Key ID: 8C6CFB2FFFE8F68A
14 changed files with 114 additions and 105 deletions

View File

@ -169,7 +169,7 @@ exports[`preferences - closing-preferences given accessing preferences directly
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
</div>
@ -280,7 +280,7 @@ exports[`preferences - closing-preferences given accessing preferences directly
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="extension-install-registry"
@ -400,7 +400,7 @@ exports[`preferences - closing-preferences given accessing preferences directly
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="start-up"
@ -427,7 +427,7 @@ exports[`preferences - closing-preferences given accessing preferences directly
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="update-channel"
@ -516,7 +516,7 @@ exports[`preferences - closing-preferences given accessing preferences directly
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="timezone"
@ -877,7 +877,7 @@ exports[`preferences - closing-preferences given accessing preferences directly
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
</div>
@ -1449,7 +1449,7 @@ exports[`preferences - closing-preferences given already in a page and then navi
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
</div>
@ -1560,7 +1560,7 @@ exports[`preferences - closing-preferences given already in a page and then navi
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="extension-install-registry"
@ -1680,7 +1680,7 @@ exports[`preferences - closing-preferences given already in a page and then navi
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="start-up"
@ -1707,7 +1707,7 @@ exports[`preferences - closing-preferences given already in a page and then navi
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="update-channel"
@ -1796,7 +1796,7 @@ exports[`preferences - closing-preferences given already in a page and then navi
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="timezone"
@ -2157,7 +2157,7 @@ exports[`preferences - closing-preferences given already in a page and then navi
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
</div>

View File

@ -182,7 +182,7 @@ exports[`preferences: extension adding preference tabs given in preferences, whe
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
</div>
@ -293,7 +293,7 @@ exports[`preferences: extension adding preference tabs given in preferences, whe
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="extension-install-registry"
@ -413,7 +413,7 @@ exports[`preferences: extension adding preference tabs given in preferences, whe
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="start-up"
@ -440,7 +440,7 @@ exports[`preferences: extension adding preference tabs given in preferences, whe
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="update-channel"
@ -529,7 +529,7 @@ exports[`preferences: extension adding preference tabs given in preferences, whe
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="timezone"

View File

@ -157,14 +157,14 @@ exports[`preferences - hiding-of-empty-branches, given in preferences page given
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
<div
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
</div>
@ -275,7 +275,7 @@ exports[`preferences - hiding-of-empty-branches, given in preferences page given
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="extension-install-registry"
@ -395,7 +395,7 @@ exports[`preferences - hiding-of-empty-branches, given in preferences page given
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="start-up"
@ -422,7 +422,7 @@ exports[`preferences - hiding-of-empty-branches, given in preferences page given
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="update-channel"
@ -511,7 +511,7 @@ exports[`preferences - hiding-of-empty-branches, given in preferences page given
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="timezone"
@ -859,7 +859,7 @@ exports[`preferences - hiding-of-empty-branches, given in preferences page given
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
<div
@ -887,7 +887,7 @@ exports[`preferences - hiding-of-empty-branches, given in preferences page given
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
</div>
@ -998,7 +998,7 @@ exports[`preferences - hiding-of-empty-branches, given in preferences page given
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="extension-install-registry"
@ -1118,7 +1118,7 @@ exports[`preferences - hiding-of-empty-branches, given in preferences page given
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="start-up"
@ -1145,7 +1145,7 @@ exports[`preferences - hiding-of-empty-branches, given in preferences page given
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="update-channel"
@ -1234,7 +1234,7 @@ exports[`preferences - hiding-of-empty-branches, given in preferences page given
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="timezone"
@ -1582,7 +1582,7 @@ exports[`preferences - hiding-of-empty-branches, given in preferences page given
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
<div
@ -1622,7 +1622,7 @@ exports[`preferences - hiding-of-empty-branches, given in preferences page given
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
</div>
@ -1733,7 +1733,7 @@ exports[`preferences - hiding-of-empty-branches, given in preferences page given
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="extension-install-registry"
@ -1853,7 +1853,7 @@ exports[`preferences - hiding-of-empty-branches, given in preferences page given
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="start-up"
@ -1880,7 +1880,7 @@ exports[`preferences - hiding-of-empty-branches, given in preferences page given
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="update-channel"
@ -1969,7 +1969,7 @@ exports[`preferences - hiding-of-empty-branches, given in preferences page given
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="timezone"

View File

@ -157,7 +157,7 @@ exports[`preferences - navigation to application preferences given in some child
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
</div>
@ -215,7 +215,7 @@ exports[`preferences - navigation to application preferences given in some child
</section>
</div>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
<div
data-preference-item-test="allow-untrusted-certificates"
@ -505,7 +505,7 @@ exports[`preferences - navigation to application preferences given in some child
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
</div>
@ -616,7 +616,7 @@ exports[`preferences - navigation to application preferences given in some child
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="extension-install-registry"
@ -736,7 +736,7 @@ exports[`preferences - navigation to application preferences given in some child
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="start-up"
@ -763,7 +763,7 @@ exports[`preferences - navigation to application preferences given in some child
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="update-channel"
@ -852,7 +852,7 @@ exports[`preferences - navigation to application preferences given in some child
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="timezone"
@ -1202,7 +1202,7 @@ exports[`preferences - navigation to application preferences given in some child
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
</div>
@ -1313,7 +1313,7 @@ exports[`preferences - navigation to application preferences given in some child
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="extension-install-registry"
@ -1433,7 +1433,7 @@ exports[`preferences - navigation to application preferences given in some child
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="start-up"
@ -1460,7 +1460,7 @@ exports[`preferences - navigation to application preferences given in some child
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="update-channel"
@ -1549,7 +1549,7 @@ exports[`preferences - navigation to application preferences given in some child
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="timezone"

View File

@ -157,7 +157,7 @@ exports[`preferences - navigation to editor preferences given in preferences, wh
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
</div>
@ -268,7 +268,7 @@ exports[`preferences - navigation to editor preferences given in preferences, wh
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="extension-install-registry"
@ -388,7 +388,7 @@ exports[`preferences - navigation to editor preferences given in preferences, wh
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="start-up"
@ -415,7 +415,7 @@ exports[`preferences - navigation to editor preferences given in preferences, wh
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="update-channel"
@ -504,7 +504,7 @@ exports[`preferences - navigation to editor preferences given in preferences, wh
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="timezone"
@ -853,7 +853,7 @@ exports[`preferences - navigation to editor preferences given in preferences, wh
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
</div>

View File

@ -157,7 +157,7 @@ exports[`preferences - navigation to proxy preferences given in preferences, whe
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
</div>
@ -268,7 +268,7 @@ exports[`preferences - navigation to proxy preferences given in preferences, whe
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="extension-install-registry"
@ -388,7 +388,7 @@ exports[`preferences - navigation to proxy preferences given in preferences, whe
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="start-up"
@ -415,7 +415,7 @@ exports[`preferences - navigation to proxy preferences given in preferences, whe
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="update-channel"
@ -504,7 +504,7 @@ exports[`preferences - navigation to proxy preferences given in preferences, whe
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="timezone"
@ -853,7 +853,7 @@ exports[`preferences - navigation to proxy preferences given in preferences, whe
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
</div>
@ -911,7 +911,7 @@ exports[`preferences - navigation to proxy preferences given in preferences, whe
</section>
</div>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
<div
data-preference-item-test="allow-untrusted-certificates"

View File

@ -169,7 +169,7 @@ exports[`preferences - navigation to telemetry preferences given URL for Sentry
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
</div>
@ -488,7 +488,7 @@ exports[`preferences - navigation to telemetry preferences given in preferences,
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
</div>
@ -599,7 +599,7 @@ exports[`preferences - navigation to telemetry preferences given in preferences,
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="extension-install-registry"
@ -719,7 +719,7 @@ exports[`preferences - navigation to telemetry preferences given in preferences,
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="start-up"
@ -746,7 +746,7 @@ exports[`preferences - navigation to telemetry preferences given in preferences,
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="update-channel"
@ -835,7 +835,7 @@ exports[`preferences - navigation to telemetry preferences given in preferences,
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="timezone"
@ -1196,7 +1196,7 @@ exports[`preferences - navigation to telemetry preferences given in preferences,
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
</div>
@ -1307,7 +1307,7 @@ exports[`preferences - navigation to telemetry preferences given in preferences,
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="extension-install-registry"
@ -1427,7 +1427,7 @@ exports[`preferences - navigation to telemetry preferences given in preferences,
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="start-up"
@ -1454,7 +1454,7 @@ exports[`preferences - navigation to telemetry preferences given in preferences,
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="update-channel"
@ -1543,7 +1543,7 @@ exports[`preferences - navigation to telemetry preferences given in preferences,
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="timezone"
@ -1904,7 +1904,7 @@ exports[`preferences - navigation to telemetry preferences given in preferences,
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
</div>
@ -2213,7 +2213,7 @@ exports[`preferences - navigation to telemetry preferences given no URL for Sent
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
</div>

View File

@ -157,7 +157,7 @@ exports[`preferences - navigation to terminal preferences given in preferences,
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
</div>
@ -268,7 +268,7 @@ exports[`preferences - navigation to terminal preferences given in preferences,
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="extension-install-registry"
@ -388,7 +388,7 @@ exports[`preferences - navigation to terminal preferences given in preferences,
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="start-up"
@ -415,7 +415,7 @@ exports[`preferences - navigation to terminal preferences given in preferences,
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="update-channel"
@ -504,7 +504,7 @@ exports[`preferences - navigation to terminal preferences given in preferences,
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="timezone"
@ -853,7 +853,7 @@ exports[`preferences - navigation to terminal preferences given in preferences,
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
</div>

View File

@ -375,7 +375,7 @@ exports[`preferences - navigation using application menu when navigating to pref
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
</div>
@ -486,7 +486,7 @@ exports[`preferences - navigation using application menu when navigating to pref
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="extension-install-registry"
@ -606,7 +606,7 @@ exports[`preferences - navigation using application menu when navigating to pref
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="start-up"
@ -633,7 +633,7 @@ exports[`preferences - navigation using application menu when navigating to pref
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="update-channel"
@ -722,7 +722,7 @@ exports[`preferences - navigation using application menu when navigating to pref
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="timezone"

View File

@ -378,7 +378,7 @@ exports[`show-about-using-tray when navigating using tray renders 1`] = `
style="padding: 0px 10px;"
>
<div
class="HorizontalLine Small"
class="HorizontalLine size-sm"
/>
</div>
</div>
@ -489,7 +489,7 @@ exports[`show-about-using-tray when navigating using tray renders 1`] = `
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="extension-install-registry"
@ -609,7 +609,7 @@ exports[`show-about-using-tray when navigating using tray renders 1`] = `
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="start-up"
@ -636,7 +636,7 @@ exports[`show-about-using-tray when navigating using tray renders 1`] = `
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="update-channel"
@ -725,7 +725,7 @@ exports[`show-about-using-tray when navigating using tray renders 1`] = `
</section>
</div>
<div
class="HorizontalLine"
class="HorizontalLine size-xl"
/>
<div
data-preference-item-test="timezone"

View File

@ -23,7 +23,7 @@ export const preferenceTabsRoot: PreferenceTabsRoot = {
childSeparator: () => (
<div style={{ padding: "0 10px" }}>
<HorizontalLine small />
<HorizontalLine size="sm" />
</div>
),
};

View File

@ -23,7 +23,7 @@ const proxyPreferencePageInjectable = getInjectable({
id: "proxy-page",
parentId: "proxy-tab",
Component: ProxyPage,
childSeparator: () => <HorizontalLine small />,
childSeparator: () => <HorizontalLine size="sm" />,
}),
injectionToken: preferenceItemInjectionToken,

View File

@ -4,14 +4,22 @@
*/
.HorizontalLine {
margin-top: 40px;
margin-bottom: 40px;
height: 1px;
border-top: thin solid var(--hrColor);
}
.Small {
margin-top: 20px;
margin-bottom: 20px;
@mixin horizontalLineSize(
$sizeName,
$size
) {
.size-#{$sizeName} {
margin-top: $size;
margin-bottom: $size;
}
}
$baseline: 8px;
@include horizontalLineSize('sm', 2 * $baseline);
@include horizontalLineSize('md', 3 * $baseline);
@include horizontalLineSize('xl', 5 * $baseline);

View File

@ -6,11 +6,12 @@ import React from "react";
import styles from "./horizontal-line.module.scss";
import { cssNames } from "../../utils";
export const HorizontalLine = ({ small } = { small: false }) => (
<div
className={cssNames({
[styles.HorizontalLine]: true,
[styles.Small]: small,
})}
/>
);
interface HorizontalLineProps {
size: "sm" | "md" | "xl";
}
export const HorizontalLine = ({ size }: HorizontalLineProps = { size: "xl" }) => {
const classNames = cssNames(styles.HorizontalLine, styles[`size-${size}`]);
return <div className={classNames} />;
};