[GitHub/WoltLab/WCF.git] / wcfsetup / install / files / style / ui / pagination.scss

.pagination__wrapper {
	display: block;
}

.pagination {
	--column-gap: 2px;

	column-gap: var(--column-gap);
	display: inline-grid;
	grid-auto-flow: column;
}

.pagination__list {
	column-gap: var(--column-gap);
	display: grid;
	grid-auto-flow: column;
}

.pagination__link {
	border-radius: 4px;
	color: var(--wcfContentText);
	display: inline-block;
	font-variant: tabular-nums;
	padding: 4px 8px;
}

.pagination__link[aria-current="page"],
body:not(.touch) .pagination__link:hover {
	background-color: var(--wcfButtonBackgroundActive);
	color: var(--wcfButtonTextActive);
}

@include screen-xs {
	.pagination__wrapper {
		text-align: center;
	}
}
Commit	Line	Data
	1	.pagination__wrapper {
	2	display: block;
	3	}
	4
	5	.pagination {
	6	--column-gap: 2px;
	7
	8	column-gap: var(--column-gap);
	9	display: inline-grid;
	10	grid-auto-flow: column;
	11	}
	12
	13	.pagination__list {
	14	column-gap: var(--column-gap);
	15	display: grid;
	16	grid-auto-flow: column;
	17	}
	18
	19	.pagination__link {
	20	border-radius: 4px;
	21	color: var(--wcfContentText);
	22	display: inline-block;
	23	font-variant: tabular-nums;
	24	padding: 4px 8px;
	25	}
	26
	27	.pagination__link[aria-current="page"],
	28	body:not(.touch) .pagination__link:hover {
	29	background-color: var(--wcfButtonBackgroundActive);
	30	color: var(--wcfButtonTextActive);
	31	}
	32
	33	@include screen-xs {
	34	.pagination__wrapper {
	35	text-align: center;
	36	}
	37	}