style.scss

// Bootstrap variables customisation
// Fonts & Typo
$link-decoration: none;
$text-muted: var(--text-secondary-color);
$font-family-base: Montserrat, Helvetica, Arial, serif;
$small-font-size: 70%;

// Badges
$badge-font-size: 0.7em;

// Tables;
$table-border-color: var(--background-color-primary);
$table-bg: var(--background-color-primary);
$table-color: var(--text-primary-color);
$table-hover-bg: rgba(0, 0, 255, 0.075);

// Breadcrumb
$breadcrumb-bg: var(--background-color-secondary);
$breadcrumb-active-color: var(--text-primary-color);
$breadcrumb-divider-color: var(--text-primary-color);

// List-groups
$list-group-bg: var(--background-color-secondary);
$list-group-active-bg: rgba(0, 0, 255, 0.075);
$list-group-active-color: var(--text-primary-color);
$list-group-color: var(--text-primary-color);

// Cards
$card-bg: var(--background-color-secondary);

// Mark
$mark-padding: 0.2em 0;
$mark-bg: yellow;

// Colors
$info: #0a8299;

@import "font";
@import "bootstrap";

.badge.bg-warning {
	color: var(--bs-dark);
}

.table {
	&-fixed {
		table-layout: fixed;
	}

	& > :not(:first-child) {
		border-top: none;
	}

	&.sortable thead {
		tr {
			border-left: 1px solid var(--text-primary-color);
		}

		th {
			border-right: 1px solid;
			border-top: 1px solid;
			border-bottom: 1px solid;
		}
	}
	tbody tr > * {
		vertical-align: middle;
	}

	&-hover tbody tr {
		cursor: pointer;
	}

	.td-date {
		width: 165px;
	}
}

.list-group-item {
	&-action:not(.active) {
		&:hover {
			background: rgba(0, 0, 255, 0.075);
			color: var(--text-primary-color);
		}
	}

	.menu-item {
		transition: left 0.3s ease-in-out;
		left: 0;

		&::before {
			content: "›";
			position: relative;
			left: -0.5em;
		}

		&:hover {
			left: 0.5em;
		}
	}
}

.icon {
	width: 1.15rem;
}