Skip to content

Commit

Permalink
Updated uptime card
Browse files Browse the repository at this point in the history
  • Loading branch information
nckrtl committed Dec 8, 2023
1 parent 0108d5f commit 13d86cc
Show file tree
Hide file tree
Showing 7 changed files with 255 additions and 137 deletions.
121 changes: 46 additions & 75 deletions dist/output.css
Original file line number Diff line number Diff line change
Expand Up @@ -98,6 +98,10 @@
--tw-backdrop-sepia:
}

#ohdear :is(.static) {
position: static
}

#ohdear :is(.absolute) {
position: absolute
}
Expand All @@ -106,6 +110,10 @@
position: relative
}

#ohdear :is(.left-0) {
left: 0px
}

#ohdear :is(.right-0) {
right: 0px
}
Expand Down Expand Up @@ -158,6 +166,10 @@
width: 2.5rem
}

#ohdear :is(.w-2) {
width: 0.5rem
}

#ohdear :is(.w-32) {
width: 8rem
}
Expand Down Expand Up @@ -206,10 +218,6 @@
grid-template-columns: repeat(1, minmax(0, 1fr))
}

#ohdear :is(.grid-cols-3) {
grid-template-columns: repeat(3, minmax(0, 1fr))
}

#ohdear :is(.flex-col) {
flex-direction: column
}
Expand All @@ -226,10 +234,6 @@
justify-content: space-between
}

#ohdear :is(.gap-3) {
gap: 0.75rem
}

#ohdear :is(.gap-4) {
gap: 1rem
}
Expand All @@ -238,18 +242,18 @@
gap: 1.5rem
}

#ohdear :is(.space-x-1 > :not([hidden]) ~ :not([hidden])) {
--tw-space-x-reverse: 0;
margin-right: calc(0.25rem * var(--tw-space-x-reverse));
margin-left: calc(0.25rem * calc(1 - var(--tw-space-x-reverse)))
}

#ohdear :is(.space-x-2 > :not([hidden]) ~ :not([hidden])) {
--tw-space-x-reverse: 0;
margin-right: calc(0.5rem * var(--tw-space-x-reverse));
margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)))
}

#ohdear :is(.space-y-2 > :not([hidden]) ~ :not([hidden])) {
--tw-space-y-reverse: 0;
margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
margin-bottom: calc(0.5rem * var(--tw-space-y-reverse))
}

#ohdear :is(.truncate) {
overflow: hidden;
text-overflow: ellipsis;
Expand All @@ -268,10 +272,6 @@
border-radius: 9999px
}

#ohdear :is(.rounded-lg) {
border-radius: 0.5rem
}

#ohdear :is(.rounded-tr-lg) {
border-top-right-radius: 0.5rem
}
Expand All @@ -286,16 +286,26 @@
background-color: rgb(209 250 229 / var(--tw-bg-opacity))
}

#ohdear :is(.bg-emerald-300) {
#ohdear :is(.bg-emerald-400) {
--tw-bg-opacity: 1;
background-color: rgb(110 231 183 / var(--tw-bg-opacity))
background-color: rgb(52 211 153 / var(--tw-bg-opacity))
}

#ohdear :is(.bg-gray-200) {
--tw-bg-opacity: 1;
background-color: rgb(229 231 235 / var(--tw-bg-opacity))
}

#ohdear :is(.bg-gray-600) {
--tw-bg-opacity: 1;
background-color: rgb(75 85 99 / var(--tw-bg-opacity))
}

#ohdear :is(.bg-green-500) {
--tw-bg-opacity: 1;
background-color: rgb(34 197 94 / var(--tw-bg-opacity))
}

#ohdear :is(.bg-indigo-100) {
--tw-bg-opacity: 1;
background-color: rgb(224 231 255 / var(--tw-bg-opacity))
Expand Down Expand Up @@ -331,19 +341,9 @@
background-color: rgb(254 249 195 / var(--tw-bg-opacity))
}

#ohdear :is(.bg-emerald-700) {
--tw-bg-opacity: 1;
background-color: rgb(4 120 87 / var(--tw-bg-opacity))
}

#ohdear :is(.bg-gray-800) {
--tw-bg-opacity: 1;
background-color: rgb(31 41 55 / var(--tw-bg-opacity))
}

#ohdear :is(.bg-emerald-400) {
#ohdear :is(.bg-emerald-500) {
--tw-bg-opacity: 1;
background-color: rgb(52 211 153 / var(--tw-bg-opacity))
background-color: rgb(16 185 129 / var(--tw-bg-opacity))
}

#ohdear :is(.px-1) {
Expand Down Expand Up @@ -391,6 +391,10 @@
padding-bottom: 1px
}

#ohdear :is(.pt-4) {
padding-top: 1rem
}

#ohdear :is(.text-center) {
text-align: center
}
Expand All @@ -399,19 +403,14 @@
text-align: right
}

#ohdear :is(.text-2xl) {
font-size: 1.5rem;
line-height: 2rem
}

#ohdear :is(.text-base) {
font-size: 1rem;
line-height: 1.5rem
}

#ohdear :is(.text-xl) {
font-size: 1.25rem;
line-height: 1.75rem
#ohdear :is(.text-sm) {
font-size: 0.875rem;
line-height: 1.25rem
}

#ohdear :is(.text-xs) {
Expand All @@ -431,15 +430,6 @@
text-transform: uppercase
}

#ohdear :is(.tabular-nums) {
--tw-numeric-spacing: tabular-nums;
font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction)
}

#ohdear :is(.tracking-wider) {
letter-spacing: 0.05em
}

#ohdear :is(.text-amber-700) {
--tw-text-opacity: 1;
color: rgb(180 83 9 / var(--tw-text-opacity))
Expand All @@ -450,21 +440,11 @@
color: rgb(4 120 87 / var(--tw-text-opacity))
}

#ohdear :is(.text-emerald-900) {
--tw-text-opacity: 1;
color: rgb(6 78 59 / var(--tw-text-opacity))
}

#ohdear :is(.text-gray-400) {
--tw-text-opacity: 1;
color: rgb(156 163 175 / var(--tw-text-opacity))
}

#ohdear :is(.text-gray-500) {
--tw-text-opacity: 1;
color: rgb(107 114 128 / var(--tw-text-opacity))
}

#ohdear :is(.text-gray-600) {
--tw-text-opacity: 1;
color: rgb(75 85 99 / var(--tw-text-opacity))
Expand Down Expand Up @@ -525,11 +505,6 @@
color: rgb(161 98 7 / var(--tw-text-opacity))
}

#ohdear :is(.text-emerald-200) {
--tw-text-opacity: 1;
color: rgb(167 243 208 / var(--tw-text-opacity))
}

#ohdear :is(.transition-colors) {
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
Expand All @@ -549,9 +524,9 @@
background-color: rgb(4 120 87 / 0.5)
}

#ohdear :is(.dark .dark\:bg-emerald-800) {
#ohdear :is(.dark .dark\:bg-gray-800) {
--tw-bg-opacity: 1;
background-color: rgb(6 95 70 / var(--tw-bg-opacity))
background-color: rgb(31 41 55 / var(--tw-bg-opacity))
}

#ohdear :is(.dark .dark\:bg-orange-700\/50) {
Expand All @@ -578,6 +553,11 @@
color: rgb(156 163 175 / var(--tw-text-opacity))
}

#ohdear :is(.dark .dark\:text-gray-500) {
--tw-text-opacity: 1;
color: rgb(107 114 128 / var(--tw-text-opacity))
}

#ohdear :is(.dark .dark\:text-gray-600) {
--tw-text-opacity: 1;
color: rgb(75 85 99 / var(--tw-text-opacity))
Expand All @@ -588,15 +568,6 @@
color: rgb(254 215 170 / var(--tw-text-opacity))
}

#ohdear :is(.dark .dark\:text-white) {
--tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity))
}

#ohdear :is(.dark .dark\:text-white\/50) {
color: rgb(255 255 255 / 0.5)
}

#ohdear :is(.dark .dark\:hover\:text-brand:hover) {
--tw-text-opacity: 1;
color: rgb(255 57 0 / var(--tw-text-opacity))
Expand Down
10 changes: 5 additions & 5 deletions resources/views/brokenLinks.blade.php
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@
</div>

<div>
<a href="https://ohdear.app/sites/{{config('services.oh_dear.pulse.site_id')}}/check/broken-links/report" target="_blank" class="text-xs font-bold text-gray-700 uppercase transition-colors dark:text-gray-400 dark:hover:text-brand ">
<a href="https://ohdear.app/sites/{{config('services.oh_dear.pulse.site_id')}}/check/broken-links/report" target="_blank" class="text-xs font-bold text-gray-700 uppercase transition-colors dark:text-gray-400 hover:text-brand ">
<x-ohdear-pulse::logo-ohdear class="inline-block w-10" />
</a>
</div>
Expand All @@ -35,21 +35,21 @@
@foreach ($brokenLinks as $brokenLink)
<tr class="h-2 first:h-0"></tr>
<tr wire:key="brokenLink.{{ md5($brokenLink->crawledUrl) }}">
<x-pulse::td class="px-4 ">
<x-pulse::td class="px-4 dark:bg-gray-800">
<x-ohdear-pulse::response-code :code="$brokenLink->statusCode">
{{$brokenLink->statusCode}}
</x-ohdear-pulse::response-code>
</x-pulse::td>
<x-pulse::td class="w-[29%] text-gray-700 dark:text-gray-300">
<x-pulse::td class="w-[29%] text-gray-700 dark:text-gray-300 dark:bg-gray-800">
<div class="w-full truncate">
<a target="_blank" href="{{ $brokenLink->crawledUrl }}">{{ $brokenLink->relativeCrawledUrl }}</a>
</div>
</x-pulse::td>
<x-pulse::td class="max-w-[25%] text-gray-700 truncate dark:text-gray-300">
<x-pulse::td class="max-w-[25%] text-gray-700 truncate dark:text-gray-300 dark:bg-gray-800">
<a target="_blank"
href="{{ $brokenLink->foundOnUrl }}">{{ $brokenLink->foundOnUrl }}</a>
</x-pulse::td>
<x-pulse::td class="text-gray-700 truncate dark:text-gray-300">
<x-pulse::td class="text-gray-700 truncate dark:text-gray-300 dark:bg-gray-800">
{{ $brokenLink->linkText }}
</x-pulse::td>
</tr>
Expand Down
8 changes: 4 additions & 4 deletions resources/views/cron.blade.php
Original file line number Diff line number Diff line change
Expand Up @@ -34,14 +34,14 @@
@foreach ($cronChecks as $cronCheck)
<tr class="h-2 first:h-0"></tr>
<tr wire:key="cronCheck.{{ $cronCheck->id }}">
<x-pulse::td class="px-4">
<x-pulse::td class="px-4 dark:bg-gray-800">
<code class="block text-xs text-gray-900 truncate dark:text-gray-100" title="{{ $cronCheck->name }}">
<a href="https://ohdear.app/sites/{{config('services.oh_dear.pulse.site_id')}}/check/scheduled-tasks/{{$cronCheck->id}}" target="_blank">
{{ $cronCheck->name }}
</a>
</code>
</x-pulse::td>
<x-pulse::td class="">
<x-pulse::td class="dark:bg-gray-800">
<div class="flex flex-col text-gray-700 dark:text-gray-300">
<div>
{{ $cronCheck->humanReadableLatestPingAt }}
Expand All @@ -51,7 +51,7 @@
</div>
</div>
</x-pulse::td>
<x-pulse::td class="text-gray-700 dark:text-gray-300">
<x-pulse::td class="text-gray-700 dark:text-gray-300 dark:bg-gray-800">
<div class="flex flex-col text-gray-700 dark:text-gray-300">
<div>
{{ $cronCheck->humanReadableCronExpression }}
Expand All @@ -61,7 +61,7 @@
</div>
</div>
</x-pulse::td>
<x-pulse::td class="px-4 text-right text-gray-700 dark:text-gray-300">
<x-pulse::td class="px-4 text-right text-gray-700 dark:text-gray-300 dark:bg-gray-800">
<x-ohdear-pulse::pill :class="$class ?? ''" :color="$cronCheck->latestResultLabelColor">{{ $cronCheck->latestResultLabel }}</x-ohdear-pulse::pill>
</x-pulse::td>
</tr>
Expand Down
Loading

0 comments on commit 13d86cc

Please sign in to comment.