Use same font family and sizing as Linear

This commit is contained in:
Kiril Videlov 2023-02-23 13:25:39 +01:00
parent 35a3a0194d
commit c162567b6e
15 changed files with 54 additions and 36 deletions

View File

@ -18,14 +18,15 @@
"@codemirror/view": "^6.7.3",
"@tauri-apps/api": "^1.2.0",
"date-fns": "^2.29.3",
"fluent-svelte": "^1.6.0",
"idb-keyval": "^6.2.0",
"inter-ui": "^3.19.3",
"mm-jsr": "^3.0.2",
"nanoid": "^4.0.1",
"posthog-js": "^1.46.1",
"seti-icons": "^0.0.4",
"svelte-icons": "^2.1.0",
"tauri-plugin-log-api": "github:tauri-apps/tauri-plugin-log",
"fluent-svelte": "^1.6.0"
"tauri-plugin-log-api": "github:tauri-apps/tauri-plugin-log"
},
"devDependencies": {
"@sveltejs/adapter-static": "next",

View File

@ -19,6 +19,7 @@ specifiers:
eslint-plugin-unicorn: ^45.0.2
fluent-svelte: ^1.6.0
idb-keyval: ^6.2.0
inter-ui: ^3.19.3
mm-jsr: ^3.0.2
nanoid: ^4.0.1
postcss: ^8.4.14
@ -47,6 +48,7 @@ dependencies:
date-fns: 2.29.3
fluent-svelte: 1.6.0
idb-keyval: 6.2.0
inter-ui: 3.19.3
mm-jsr: 3.0.2
nanoid: 4.0.1
posthog-js: 1.46.1
@ -1665,6 +1667,10 @@ packages:
resolution: {integrity: sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==}
dev: true
/inter-ui/3.19.3:
resolution: {integrity: sha512-5FG9fjuYOXocIfjzcCBhICL5cpvwEetseL3FU6tP3d6Bn7g8wODhB+I9RNGRTizCT7CUG4GOK54OPxqq3msQgg==}
dev: false
/internal-slot/1.0.5:
resolution: {integrity: sha512-Y+R5hJrzs52QCG2laLn4udYVnxsfny9CpOhNhUvk/SSSVyF6T27FzRbF0sroPidSu3X8oEAkOn2K804mjpt6UQ==}
engines: {node: '>= 0.4'}

View File

@ -7,7 +7,7 @@
%sveltekit.head%
</head>
<body class="fixed h-full w-full overflow-hidden font-sans antialiased">
<body class="fixed h-full w-full overflow-hidden font-sans antialiased text-base">
<div style="display: contents">%sveltekit.body%</div>
</body>
</html>

View File

@ -1,3 +1,4 @@
@import "inter-ui/inter.css";
@tailwind base;
@tailwind components;
@tailwind utilities;

View File

@ -11,7 +11,7 @@
export let session: Session | undefined;
</script>
<div id="session-nav" class="grid grid-cols-3 gap-6 text-sm">
<div id="session-nav" class="grid grid-cols-3 gap-6">
<div class="flex items-center justify-center">
{#if previousSesssion}
<a

View File

@ -17,7 +17,7 @@
<div class="font-bold text-zinc-300">
{toHumanBranchName(session.meta.branch)}
</div>
<div class="mt-1 text-xs">
<div class="mt-1">
<span>
{#if session.meta.startTimestampMs}
{toHumanReadableTime(session.meta.startTimestampMs)}

View File

@ -80,10 +80,10 @@
/>
</div>
</div>
<div id="time-range" class="text-xs">
<div id="time-range" class="">
{toHumanReadableDate(session.meta.startTimestampMs)},
{toHumanReadableTime(session.meta.startTimestampMs)}
<div class="text-xs text-zinc-600">
<div class=" text-zinc-600">
{Math.round(
(session.meta.lastTimestampMs - session.meta.startTimestampMs) /
60
@ -97,7 +97,7 @@
<div class="w-6 h-6 text-white fill-blue-400">
{@html pathToIconSvg(delta)}
</div>
<div class="text-xs text-white w-24 truncate">
<div class="text-white w-24 truncate">
{pathToName(delta)}
</div>
</div>

View File

@ -41,7 +41,7 @@
<a
{href}
title={startTime.toLocaleTimeString()}
class="group absolute inset-1 flex flex-col items-center justify-center rounded-lg bg-zinc-300 p-3 text-xs leading-5 hover:bg-zinc-200 shadow"
class="group absolute inset-1 flex flex-col items-center justify-center rounded-lg bg-zinc-300 p-3 leading-5 hover:bg-zinc-200 shadow"
>
<p class="order-1 font-semibold text-zinc-800">
{toHumanBranchName(label)}

View File

@ -18,7 +18,7 @@
<header
data-tauri-drag-region
class="sticky top-0 z-50 flex flex-row items-center h-8 overflow-hidden text-sm border-b select-none text-zinc-400 border-zinc-700 bg-zinc-900 "
class="sticky top-0 z-50 flex flex-row items-center h-8 overflow-hidden border-b select-none text-zinc-400 border-zinc-700 bg-zinc-900 "
>
<div class="ml-24">
<BackForwardButtons />
@ -38,7 +38,7 @@
<!-- <div
class="flex items-center flex-shrink-0 h-6 border-t select-none border-zinc-700 bg-zinc-900 "
>
<div class="flex flex-row items-center ml-4 space-x-2 text-xs">
<div class="flex flex-row items-center ml-4 space-x-2">
<div class="w-2 h-2 bg-green-700 rounded-full" />
<div>Up to date</div>
</div>

View File

@ -94,14 +94,14 @@
class="flex items-center flex-shrink-0 h-6 border-t select-none border-zinc-700 bg-zinc-900 "
>
<div
class="flex flex-row mx-4 items-center space-x-2 text-xs justify-between w-full"
class="flex flex-row mx-4 items-center space-x-2 justify-between w-full"
>
{#if $project?.api?.sync}
<a
href="/projects/{$project?.id}/settings"
class="text-zinc-400 hover:text-zinc-300"
>
<div class="flex flex-row items-center space-x-2 text-xs">
<div class="flex flex-row items-center space-x-2 ">
<div class="w-2 h-2 bg-green-700 rounded-full" />
<div class="text-zinc-200">Syncing</div>
</div>
@ -114,7 +114,7 @@
href="/projects/{$project?.id}/settings"
class="text-zinc-400 hover:text-zinc-300"
>
<div class="flex flex-row items-center space-x-2 text-xs">
<div class="flex flex-row items-center space-x-2 ">
<div class="w-2 h-2 bg-red-700 rounded-full" />
<div class="text-zinc-200">Offline</div>
</div>

View File

@ -136,7 +136,7 @@
<div
class="overflow-hidden sticky top-0 z-30 bg-zinc-800 flex-none shadow shadow-zinc-700 ring-1 ring-zinc-700 ring-opacity-5 mb-1"
>
<div class="grid-cols-11 -mr-px text-sm border-zinc-700 grid">
<div class="grid-cols-11 -mr-px border-zinc-700 grid">
<div />
<div
class="col-span-2 flex items-center justify-center py-2"
@ -196,7 +196,7 @@
: ''}"
>
<button
class="z-20 flex justify-end items-center overflow-hidden sticky left-0 w-1/6 text-xs leading-5
class="z-20 flex justify-end items-center overflow-hidden sticky left-0 w-1/6 leading-5
{selectedFileIdx == i
? 'text-zinc-200 cursor-default'
: 'text-zinc-400 hover:text-zinc-200 cursor-pointer'}"
@ -250,7 +250,7 @@
)} / span 1;"
>
<button
class="z-20 h-full flex flex-col w-full items-center justify-center text-xs "
class="z-20 h-full flex flex-col w-full items-center justify-center"
on:click={() => {
value = timeStampToCol(
new Date(delta.timestampMs)

View File

@ -44,7 +44,7 @@
<div class="flex flex-col text-zinc-100 space-y-6">
<div class="space-y-0">
<div class="text-lg font-medium">Project Settings</div>
<div class="text-sm text-zinc-400">
<div class="text-zinc-400">
Manage your project settings for <strong
>{$project?.title}</strong
>
@ -79,7 +79,7 @@
Git Host
</div>
<div
class="text-sm text-zinc-400 font-mono"
class="text-zinc-400 font-mono"
>
{hostname($project?.api?.git_url)}
</div>
@ -87,7 +87,7 @@
Repository ID
</div>
<div
class="text-sm text-zinc-400 font-mono"
class="text-zinc-400 font-mono"
>
{repo_id($project?.api?.git_url)}
</div>
@ -115,7 +115,7 @@
<div class="space-y-2">
<div class="flex flex-row space-x-2 items-end">
<div class="">GitButler Cloud</div>
<div class="text-xs text-zinc-400">
<div class="text-zinc-400">
backup your work and access advanced features
</div>
</div>
@ -126,7 +126,7 @@
{/if}
<div class="space-y-2">
<div class="ml-1">Path</div>
<div class="text-sm text-zinc-400 font-mono">
<div class="text-zinc-400 font-mono">
{$project?.path}
</div>
</div>

View File

@ -65,7 +65,7 @@
class="overflow-hidden sticky top-0 z-30 bg-zinc-800 flex-none shadow shadow-zinc-700 ring-1 ring-zinc-700 ring-opacity-5 pr-8"
>
<div
class="grid-cols-7 -mr-px text-sm leading-6 border-r border-zinc-700 divide-x divide-zinc-700 grid"
class="grid-cols-7 -mr-px leading-6 border-r border-zinc-700 divide-x divide-zinc-700 grid"
>
<div class="col-end-1 w-14" />
<div class="flex items-center justify-center py-3">
@ -139,7 +139,7 @@
<div class="row-end-1 h-7" />
<div>
<div
class="sticky left-0 z-20 -mt-2.5 -ml-14 w-14 pr-2 text-right text-xs leading-5 text-zinc-500"
class="sticky left-0 z-20 -mt-2.5 -ml-14 w-14 pr-2 text-right leading-5 text-zinc-500"
>
12AM
</div>
@ -147,7 +147,7 @@
<div />
<div>
<div
class="sticky left-0 z-20 -mt-2.5 -ml-14 w-14 pr-2 text-right text-xs leading-5 text-zinc-500"
class="sticky left-0 z-20 -mt-2.5 -ml-14 w-14 pr-2 text-right leading-5 text-zinc-500"
>
2AM
</div>
@ -155,7 +155,7 @@
<div />
<div>
<div
class="sticky left-0 z-20 -mt-2.5 -ml-14 w-14 pr-2 text-right text-xs leading-5 text-zinc-500"
class="sticky left-0 z-20 -mt-2.5 -ml-14 w-14 pr-2 text-right leading-5 text-zinc-500"
>
4AM
</div>
@ -163,7 +163,7 @@
<div />
<div>
<div
class="sticky left-0 z-20 -mt-2.5 -ml-14 w-14 pr-2 text-right text-xs leading-5 text-zinc-500"
class="sticky left-0 z-20 -mt-2.5 -ml-14 w-14 pr-2 text-right leading-5 text-zinc-500"
>
6AM
</div>
@ -171,7 +171,7 @@
<div />
<div>
<div
class="sticky left-0 z-20 -mt-2.5 -ml-14 w-14 pr-2 text-right text-xs leading-5 text-zinc-500"
class="sticky left-0 z-20 -mt-2.5 -ml-14 w-14 pr-2 text-right leading-5 text-zinc-500"
>
8AM
</div>
@ -179,7 +179,7 @@
<div />
<div>
<div
class="sticky left-0 z-20 -mt-2.5 -ml-14 w-14 pr-2 text-right text-xs leading-5 text-zinc-500"
class="sticky left-0 z-20 -mt-2.5 -ml-14 w-14 pr-2 text-right leading-5 text-zinc-500"
>
10AM
</div>
@ -187,7 +187,7 @@
<div />
<div>
<div
class="sticky left-0 z-20 -mt-2.5 -ml-14 w-14 pr-2 text-right text-xs leading-5 text-zinc-500"
class="sticky left-0 z-20 -mt-2.5 -ml-14 w-14 pr-2 text-right leading-5 text-zinc-500"
>
12PM
</div>
@ -195,7 +195,7 @@
<div />
<div>
<div
class="sticky left-0 z-20 -mt-2.5 -ml-14 w-14 pr-2 text-right text-xs leading-5 text-zinc-500"
class="sticky left-0 z-20 -mt-2.5 -ml-14 w-14 pr-2 text-right leading-5 text-zinc-500"
>
2PM
</div>
@ -203,7 +203,7 @@
<div />
<div>
<div
class="sticky left-0 z-20 -mt-2.5 -ml-14 w-14 pr-2 text-right text-xs leading-5 text-zinc-500"
class="sticky left-0 z-20 -mt-2.5 -ml-14 w-14 pr-2 text-right leading-5 text-zinc-500"
>
4PM
</div>
@ -211,7 +211,7 @@
<div />
<div>
<div
class="sticky left-0 z-20 -mt-2.5 -ml-14 w-14 pr-2 text-right text-xs leading-5 text-zinc-500"
class="sticky left-0 z-20 -mt-2.5 -ml-14 w-14 pr-2 text-right leading-5 text-zinc-500"
>
6PM
</div>
@ -219,7 +219,7 @@
<div />
<div>
<div
class="sticky left-0 z-20 -mt-2.5 -ml-14 w-14 pr-2 text-right text-xs leading-5 text-zinc-500"
class="sticky left-0 z-20 -mt-2.5 -ml-14 w-14 pr-2 text-right leading-5 text-zinc-500"
>
8PM
</div>
@ -227,7 +227,7 @@
<div />
<div>
<div
class="sticky left-0 z-20 -mt-2.5 -ml-14 w-14 pr-2 text-right text-xs leading-5 text-zinc-500"
class="sticky left-0 z-20 -mt-2.5 -ml-14 w-14 pr-2 text-right leading-5 text-zinc-500"
>
10PM
</div>

View File

@ -107,7 +107,7 @@
<div class="mt-8 text-center">
<Login {user} {api} />
</div>
<div class="text-sm text-zinc-300 text-center">
<div class="text-zinc-300 text-center">
You will still need to give us permission for each project
before we transfer any data to our servers. You can revoke
this permission at any time.

View File

@ -3,6 +3,16 @@ const config = {
darkMode: "class",
theme: {
fontFamily: {
sans: ["Inter", "SF Pro", "-apple-system", "system-ui"],
},
fontSize: {
xs: "10px",
sm: "12px",
base: "13px",
lg: "15px",
xl: "22px",
},
extend: {},
},