Files
supabase/apps/studio/styles/react-data-grid-logs.css
T
Ivan Vasilov 308cd791a2 chore: Prep work for migrating to Tailwind v4 (#45285)
This PR preps the monorepo for a migration to Tailwind v4:
- Bump all Tailwind dependencies and libraries to the latest possible
version, while still compatible with Tailwind 3.
- Cleans up obsolete Tailwind 3 specific options and configs.
- Cleans up unused CSS files and fixes the CSS imports.
- Migrates all `important` uses in `@apply` lines to using the `!`
prefix.
- Move `typography.css` to the `config` package and import it from the
apps.
- Migrated all occurrences of `flex-grow`, `flex-shrink`,
`overflow-clip` and `overflow-ellipsis` since they're deprecated and
will be removed in Tailwind 4.
- Make the default theme object typesafe in the `ui` package.
- Migrate all `bg-opacity`, `border-opacity`, `ring-opacity` and
`divider-opacity` to the new format where they're declared as part of
the property color.
- Bump and unify all imports of `postcss` dependency.
2026-04-28 11:33:53 +02:00

120 lines
2.1 KiB
CSS

.data-grid--simple-logs {
.rdg {
overflow-x: auto;
min-width: 0;
}
.rdg-cell,
.rdg-cell span {
@apply text-foreground-light font-normal;
border-left: none;
border-right: none;
overflow: visible;
text-overflow: clip;
}
.rdg-cell {
display: flex;
align-items: center;
}
.rdg-cell:first-child {
@apply pl-5;
}
.rdg-cell:last-child {
@apply pr-5;
}
.rdg-row {
&.rdg-row--focused {
@apply border-r border-brand;
border-right-width: 4px;
}
&.rdg-row--focused .rdg-cell,
&.rdg-row--focused .rdg-cell span {
@apply !text-foreground;
}
}
}
.data-grid--logs-explorer {
@apply pb-12;
.rdg {
overflow-x: auto;
min-width: 0;
}
.rdg-cell,
.rdg-cell span {
@apply !text-foreground-light !font-normal;
overflow: visible;
text-overflow: clip;
}
.rdg-cell {
display: flex;
align-items: center;
}
.rdg-cell:first-child {
@apply pl-5;
}
.rdg-cell:last-child {
@apply pr-5;
}
.rdg-row {
&.rdg-row--focused {
@apply border-r border-brand;
border-right-width: 4px;
}
&.rdg-row--focused .rdg-cell,
&.rdg-row--focused .rdg-cell span {
@apply !text-foreground-light !font-semibold;
}
}
}
.syntax-highlight {
counter-reset: line-numbering;
font-family: Menlo, Monaco, monospace;
color: hsl(var(--foreground-lighter));
word-break: break-word;
}
.syntax-highlight .line::before {
content: counter(line-numbering);
counter-increment: line-numbering;
padding-right: 0px;
display: inline-block;
color: hsl(var(--border-stronger));
/* space after numbers */
width: 2rem;
text-align: left;
}
.logs-shimmering-loader {
animation: shimmer 1.5s infinite linear;
background: linear-gradient(
to right,
hsl(var(--background-default)) 0%,
hsl(var(--brand-default)) 25%,
hsl(var(--brand-300)) 35%,
hsl(var(--background-default)) 45%,
hsl(var(--background-surface-100)) 75%
);
background-size: 3000px 100%;
}
@keyframes logsShimmer {
0% {
background-position: -1000px 0;
}
50% {
background-position: 1000px 0;
}
}