mirror of
https://github.com/aljazceru/btcpayserver.git
synced 2025-12-31 04:34:26 +01:00
Sums up and adds to the comments made in #1175. I wasn't sure where to put these kinds of docs, as tehy are code related and not end user facing. Let's discuss whether or not this fits in here or should become part of the docs repo. fix
111 lines
3.8 KiB
CSS
111 lines
3.8 KiB
CSS
:root {
|
|
/* General color definitions */
|
|
--btcpay-brand-light: #CEDC21;
|
|
--btcpay-brand-medium: #51B13E;
|
|
--btcpay-brand-dark: #137547;
|
|
--btcpay-brand-darker: #0F3B21;
|
|
--btcpay-brand-darkest: #05120a;
|
|
|
|
/* Color definitions for specific purposes - map the general colors or define additional ones */
|
|
--btcpay-color-white: #fff;
|
|
--btcpay-color-black: #000;
|
|
|
|
--btcpay-color-neutral-100: #f8f9fa;
|
|
--btcpay-color-neutral-200: #e9ecef;
|
|
--btcpay-color-neutral-300: #dee2e6;
|
|
--btcpay-color-neutral-400: #ced4da;
|
|
--btcpay-color-neutral-500: #adb5bd;
|
|
--btcpay-color-neutral-600: #6c757d;
|
|
--btcpay-color-neutral-700: #495057;
|
|
--btcpay-color-neutral-800: #343a40;
|
|
--btcpay-color-neutral-900: #212529;
|
|
|
|
--btcpay-color-primary: #329f80; /* Usage: Text color */
|
|
--btcpay-color-primary-backdrop: rgba(81, 173, 147, 0.25); /* Usage: Backgrounds, borders, shadows */
|
|
--btcpay-color-primary-accent: #267861; /* Usage: Background on Focus/Hover */
|
|
--btcpay-color-secondary: var(--btcpay-color-neutral-600);
|
|
--btcpay-color-secondary-backdrop: rgba(130, 138, 145, 0.25);
|
|
--btcpay-color-secondary-accent: var(--btcpay-color-neutral-800);
|
|
--btcpay-color-success: #329f80;
|
|
--btcpay-color-success-backdrop: rgba(72, 180, 97, 0.25);
|
|
--btcpay-color-success-accent: #1e7e34;
|
|
--btcpay-color-info: #17a2b8;
|
|
--btcpay-color-info-backdrop: rgba(58, 176, 195, 0.25);
|
|
--btcpay-color-info-accent: #117a8b;
|
|
--btcpay-color-warning: #ffc107;
|
|
--btcpay-color-warning-backdrop: #fff3cd;
|
|
--btcpay-color-warning-accent: #d39e00;
|
|
--btcpay-color-danger: #dc3545;
|
|
--btcpay-color-danger-backdrop: rgba(225, 83, 97, 0.25);
|
|
--btcpay-color-danger-accent: #bd2130;
|
|
--btcpay-color-light: var(--btcpay-color-neutral-200);
|
|
--btcpay-color-light-backdrop: var(--btcpay-color-neutral-200);
|
|
--btcpay-color-light-accent: var(--btcpay-color-neutral-100);
|
|
--btcpay-color-dark: var(--btcpay-color-neutral-800);
|
|
--btcpay-color-dark-backdrop: var(--btcpay-color-neutral-800);
|
|
--btcpay-color-dark-accent: var(--btcpay-color-neutral-900);
|
|
|
|
/* Color definitions for specific sections - try to reuse colors defined above */
|
|
--btcpay-bg-body: var(--btcpay-color-neutral-100);
|
|
--btcpay-bg-dark: var(--btcpay-brand-darker);
|
|
--btcpay-bg-tile: var(--btcpay-color-white);
|
|
--btcpay-bg-cta: var(--btcpay-bg-dark);
|
|
|
|
--btcpay-body-color: var(--btcpay-color-neutral-900);
|
|
--btcpay-body-color-link: var(--btcpay-color-primary);
|
|
--btcpay-body-color-link-accent: var(--btcpay-color-primary-accent);
|
|
|
|
--btcpay-bg-nav-link-active: #d9f7ef;
|
|
|
|
--btcpay-preformatted-text-color: var(--btcpay-color-neutral-900);
|
|
|
|
--btcpay-font-size-base: 14px;
|
|
--btcpay-font-family-head: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
|
|
--btcpay-font-family-base: 'Helvetica Neue', Arial, sans-serif;
|
|
--btcpay-font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
|
}
|
|
|
|
/* Bootstrap modifications */
|
|
html {
|
|
font-size: var(--btcpay-font-size-base);
|
|
}
|
|
|
|
.bg-dark {
|
|
background-color: var(--btcpay-bg-dark) !important;
|
|
}
|
|
|
|
.table-sm {
|
|
margin: 1.5rem 0;
|
|
background: var(--btcpay-color-white);
|
|
border: 1px solid var(--btcpay-color-neutral-300);
|
|
border-radius: 4px;
|
|
border-collapse: separate !important;
|
|
border-spacing: 0px !important;
|
|
}
|
|
|
|
.table-sm thead > tr {
|
|
height: 40px;
|
|
}
|
|
|
|
.table-sm thead th {
|
|
border-bottom: none;
|
|
border-top: none;
|
|
font-size: 1.0rem;
|
|
}
|
|
|
|
.table-sm th,
|
|
.table-sm td {
|
|
padding: 8px 12px;
|
|
vertical-align: middle;
|
|
font-size: 0.92rem;
|
|
}
|
|
|
|
.table-sm tbody tr:hover {
|
|
background-color: var(--btcpay-color-neutral-100);
|
|
}
|
|
|
|
.removetopborder tr:first-child th,
|
|
.removetopborder tr:first-child td {
|
|
border-top: none;
|
|
}
|