vega-frontend-monorepo/apps/governance/src/styles.css

140 lines
3.1 KiB
CSS

@import 'ag-grid-community/styles/ag-grid.css';
@import 'ag-grid-community/styles/ag-theme-balham.css';
@tailwind base;
@tailwind components;
@tailwind utilities;
@layer base {
*,
*::before,
*::after {
box-sizing: border-box;
}
h1 {
@apply text-2xl text-white uppercase mb-4;
}
h2 {
@apply text-xl text-white mb-4;
}
p {
@apply mb-2 text-neutral-400;
}
}
@layer components {
.border-default {
@apply border-vega-dark-200;
}
}
/* AG GRID - Do not edit without updating other global stylesheets for each app */
.vega-ag-grid .ag-root-wrapper {
border: solid 0px;
}
.vega-ag-grid .ag-react-container {
overflow: hidden;
text-overflow: ellipsis;
}
.vega-ag-grid .ag-cell,
.vega-ag-grid .ag-full-width-row .ag-cell-wrapper.ag-row-group {
line-height: calc(min(var(--ag-line-height, 26px), 26px) - 4px);
}
.vega-ag-grid .ag-row,
.vega-ag-grid .ag-cell {
border-width: 0;
}
/* Dark variables */
.ag-theme-balham-dark {
--ag-background-color: theme(colors.black);
--ag-border-color: theme(colors.neutral[700]);
--ag-header-background-color: theme(colors.black);
--ag-odd-row-background-color: theme(colors.black);
--ag-header-column-separator-color: theme(colors.neutral[600]);
--ag-row-border-color: theme(colors.black);
--ag-row-hover-color: theme(colors.neutral[800]);
}
.validators-table .ag-theme-balham-dark .ag-body-horizontal-scroll {
opacity: 0.75;
}
.validators-table .ag-theme-balham-dark *:hover {
cursor: pointer;
}
/* Styles required to (effectively) un-override the
* reset styles so that the Proposal description fields
* render as you'd expect them to.
*
* Notes:
* - image embeds are disabled, so no styles are required
* - strong may not be required
* - skipHTML is enabled, so no nested HTML will be rendered. Only
* . valid markdown
*/
.dark .react-markdown-container,
.dark .react-markdown-container li,
.dark .react-markdown-container p {
color: #fff;
}
.react-markdown-container strong {
font-weight: bold;
}
.react-markdown-container ol {
margin-left: 1em;
}
.react-markdown-container li {
margin-left: 1em;
padding-left: 1em;
}
.react-markdown-container ol li {
list-style: decimal;
}
.react-markdown-container ul li {
list-style: circle;
}
.react-markdown-container a {
text-decoration: underline;
}
.jsondiffpatch-delta,
.jsondiffpatch-delta pre {
font-family: 'Roboto Mono', monospace !important;
}
.jsondiffpatch-delta pre {
padding: 0 0.25em !important;
}
.jsondiffpatch-added .jsondiffpatch-property-name,
.jsondiffpatch-added .jsondiffpatch-value pre,
.jsondiffpatch-modified .jsondiffpatch-right-value pre,
.jsondiffpatch-textdiff-added {
background: theme(colors.vega.green[650]) !important;
color: theme(colors.white) !important;
}
.jsondiffpatch-deleted .jsondiffpatch-property-name,
.jsondiffpatch-deleted pre,
.jsondiffpatch-modified .jsondiffpatch-left-value pre,
.jsondiffpatch-textdiff-deleted {
background: theme(colors.vega.pink[650]) !important;
color: theme(colors.white) !important;
}
.jsondiffpatch-moved .jsondiffpatch-moved-destination {
background: theme(colors.vega.yellow[350]) !important;
color: theme(colors.vega.dark[200]) !important;
}