Learn more  » Push, build, and install  RubyGems npm packages Python packages Maven artifacts PHP packages Go Modules Bower components Debian packages RPM packages NuGet packages

jsarnowski / jsarnowski/jet-elements   php

Repository URL to install this package:

Version: 2.5.6 

/ scss / addons / _jet-table.scss

.jet-table-wrapper {
	width: 100%;
	max-width: 100%;

	.jet-table {
		margin: 0;
	}
}

.jet-table {
	width: 100%;
	max-width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	background-color: transparent;
	border: none;

	& &__cell {
		padding: 0;
		border: 1px none;
	}

	&__cell {
		transition: 0.2s;
		overflow: hidden;

		&-inner {
			display: flex;
			align-items: center;
			padding: 5px;
		}

		&-link {
			color: inherit;
		}
	}

	&__head-cell,
	&__foot-cell {
		background-color: #00b4ff;
		color: #fff;
	}

	&-header-sort {
		cursor: pointer;
	}

	&__sort-icon {
		display: inline-block;
		font: normal normal normal 14px/1 FontAwesome;
		font-size: inherit;
		text-rendering: auto;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;

		flex-shrink: 0;
		@include margin-start(5px);

		.jet-table--fa5-compat & {
			font: normal normal 900 12px/1 "Font Awesome 5 Free";
		}

		&:before {
			content: "\f0dc";

			.jet-table-header-sort--up & {
				content: "\f0de";
			}
			.jet-table-header-sort--down & {
				content: "\f0dd";
			}
		}
	}

	&__cell-content {
		display: flex;
		align-items: center;
		@include margin-start(0);
		@include margin-end(auto);
		text-align: $start;
	}

	&__cell-img {
		display: block;
		img {
			vertical-align: top;
		}
	}

	&__cell-icon {
		width: 1em;
	}

	&__cell-icon,
	&__cell-img {
		&--before:not(:only-child) {
			@include margin-end(5px);
		}

		&--after:not(:only-child) {
			order: 2;
			@include margin-start(5px);
		}
	}
}

[data-elementor-device-mode="mobile"] .jet-table-responsive-mobile,
[data-elementor-device-mode="tablet"] .jet-table-responsive-tablet,
[data-elementor-device-mode="desktop"] .jet-table-responsive-desktop {
	display: block;
	width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	-ms-overflow-style: -ms-autohiding-scrollbar;

	.jet-table {
		width: auto;
		max-width: none;
	}
}