mirror of
https://github.com/gitbutlerapp/gitbutler.git
synced 2024-12-24 01:51:57 +03:00
Moved things into cards
This commit is contained in:
parent
b6b23d388a
commit
bfa191572c
@ -67,22 +67,19 @@ input:focus {
|
||||
height: 0;
|
||||
}
|
||||
|
||||
|
||||
/* Side Bar */
|
||||
.side-panel {
|
||||
@apply h-full w-[424px] border-r border-zinc-700;
|
||||
}
|
||||
|
||||
|
||||
/* Main Content Container */
|
||||
.main-content-container {
|
||||
@apply flex flex-col h-full w-2/3 flex-auto;
|
||||
@apply flex h-full w-2/3 flex-auto flex-col;
|
||||
}
|
||||
|
||||
|
||||
/* Card Styling */
|
||||
.card {
|
||||
@apply rounded border-[0.5px] border-gb-700 bg-card-default
|
||||
@apply rounded border-[0.5px] border-gb-700 bg-card-default shadow;
|
||||
}
|
||||
|
||||
/* Text Editor */
|
||||
|
@ -90,7 +90,7 @@
|
||||
<ul class="mx-1 flex flex-auto flex-col overflow-auto">
|
||||
{#each $recentActivity as activity}
|
||||
<li
|
||||
class="mb-2 ml-3 mr-1 flex flex-col gap-2 rounded border border-zinc-700 bg-[#2F2F33] p-3 text-zinc-400"
|
||||
class="card mb-2 ml-3 mr-1 flex flex-col gap-2 p-3 text-zinc-400"
|
||||
>
|
||||
<div class="flex flex-row justify-between text-zinc-500">
|
||||
<span>
|
||||
|
@ -52,7 +52,7 @@
|
||||
|
||||
{#each $fileDeltasByDate as [date, fileDeltas, largestBucketSize]}
|
||||
<li
|
||||
class="card changed-day-card flex flex-col rounded border-[0.5px] border-gb-700 bg-card-default"
|
||||
class="card changed-day-card flex flex-col"
|
||||
>
|
||||
<header
|
||||
class="header flex flex-row justify-between gap-2 rounded-tl rounded-tr border-b-gb-700 bg-card-active px-3 py-2"
|
||||
@ -73,7 +73,7 @@
|
||||
{#each Object.entries(fileDeltas) as [filepath, deltas]}
|
||||
<li class="changed-file flex items-center justify-between gap-4 ">
|
||||
<a
|
||||
class="file-name flex w-full max-w-[360px] overflow-auto py-2 font-mono hover:underline max-w-"
|
||||
class="file-name max-w- flex w-full max-w-[360px] overflow-auto py-2 font-mono hover:underline"
|
||||
href="/projects/{projectId}/player/{format(
|
||||
date,
|
||||
'yyyy-MM-dd'
|
||||
|
@ -227,7 +227,7 @@
|
||||
<form on:submit|preventDefault={onCommit} class="flex h-full flex-col gap-4 px-4">
|
||||
<h1 class="pt-2 text-2xl font-bold">Commit</h1>
|
||||
<ul
|
||||
class="flex h-full w-full flex-col overflow-auto rounded border border-gb-700 bg-card-default"
|
||||
class="card flex h-full w-full flex-col overflow-auto"
|
||||
>
|
||||
<header class="flex w-full items-center rounded-tl rounded-tr bg-card-active p-2">
|
||||
<input
|
||||
@ -367,15 +367,10 @@
|
||||
</div>
|
||||
|
||||
<div class="main-content-container">
|
||||
<div
|
||||
id="preview"
|
||||
class="card relative m-2 flex flex-col overflow-auto h-full "
|
||||
>
|
||||
<div id="preview" class="card relative m-2 flex h-full flex-col overflow-auto ">
|
||||
{#if $selectedDiffPath}
|
||||
{#if $selectedDiff}
|
||||
<header class="flex items-center gap-3 bg-card-active px-3 py-2">
|
||||
<span>{$selectedDiffPath}</span>
|
||||
|
||||
<header class="flex items-center gap-3 bg-card-active pl-2 pr-3 py-2">
|
||||
<div class="flex items-center gap-1">
|
||||
<button
|
||||
on:click={selectPreviousFile}
|
||||
@ -396,6 +391,8 @@
|
||||
<IconChevronDown class="h-4 w-4" />
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<span>{$selectedDiffPath}</span>
|
||||
</header>
|
||||
|
||||
<div id="code" class="flex-auto overflow-auto px-2">
|
||||
@ -412,12 +409,12 @@
|
||||
id="controls"
|
||||
class="absolute bottom-0 flex w-full flex-col gap-4 overflow-hidden rounded-br rounded-bl border-t border-zinc-700 bg-[#2E2E32]/75 p-2 pt-4"
|
||||
style="
|
||||
border-width: 0.5px;
|
||||
-webkit-backdrop-filter: blur(5px) saturate(190%) contrast(70%) brightness(80%);
|
||||
backdrop-filter: blur(5px) saturate(190%) contrast(70%) brightness(80%);
|
||||
background-color: rgba(24, 24, 27, 0.60);
|
||||
border: 0.5px solid rgba(63, 63, 70, 0.50);
|
||||
"
|
||||
border-width: 0.5px;
|
||||
-webkit-backdrop-filter: blur(5px) saturate(190%) contrast(70%) brightness(80%);
|
||||
backdrop-filter: blur(5px) saturate(190%) contrast(70%) brightness(80%);
|
||||
background-color: rgba(24, 24, 27, 0.60);
|
||||
border: 0.5px solid rgba(63, 63, 70, 0.50);
|
||||
"
|
||||
>
|
||||
<div class="align-center flex flex-row-reverse gap-2">
|
||||
<button class="checkbox-button">
|
||||
|
@ -65,7 +65,7 @@
|
||||
class:text-white={date === $currentDate}
|
||||
class:border-zinc-700={date !== $currentDate}
|
||||
class:bg-card-default={date !== $currentDate}
|
||||
class="calendar-card max-h-content flex w-full flex-col items-center justify-around rounded border-[0.5px] border-gb-700 p-2 text-zinc-300 shadow transition duration-150 ease-out hover:ease-in"
|
||||
class="card max-h-content flex w-full flex-col items-center justify-around p-2 text-zinc-300 shadow transition duration-150 ease-out hover:ease-in"
|
||||
>
|
||||
{#if isToday}
|
||||
<div class="py-2 text-lg leading-5">Today</div>
|
||||
|
Loading…
Reference in New Issue
Block a user