Skip to content
Snippets Groups Projects
_layout-content.scss 2.54 KiB
Newer Older
$sg-news-headline-underline-width: 35px;
$sg-news-chevron-color: var(--component-color-primary-background, $black-base);
.sg-slide-layout-2 {
	.sg-slide-track,
	.sg-slide-container {
		background: transparent;
	}

	.main-content & {
		.sg-slide-next,
		.sg-slide-prev {
			width: 40px;
			background: transparent;
			display: flex;
		}

		.sg-slide-next {
			right: -5px;

			.fa-angle-right {
				@include inline-svg($icon-chevron, $sg-news-chevron-color);
			}
		}

		.sg-slide-prev {
			left: -5px;

			.fa-angle-left {
				@include inline-svg($icon-chevron, $sg-news-chevron-color);
			}
		}
	}

	.sg-slide-dots {
		display: none;
		position: relative;
		width: auto	!important; // stylelint-disable-line

		@media (min-width: $screen-sm) {
			display: block;
		}
	&[data-current-columns="3"] {
		.sg-slide-dots__indicator {
			&:not(:nth-child(3n+1)) {
				display: none;
			}
		}

		.sg-slide:not(:nth-child(3n+1)) {
			border-left: 1px solid $sg-news-border-color;
		}
	&[data-current-columns="2"] {
		.sg-slide-dots__indicator {
			&:not(:nth-child(2n+1)) {
				display: none;
			}
		}
		.sg-slide:not(:nth-child(2n+1)) {
			border-left: 1px solid $sg-news-border-color;
		}
	}

	a {
		&:hover,
		&:focus {
			text-decoration: none;
		}
	}

	.sg-slide-news-content {
		margin-bottom: 16px;
		padding: 0 50px
	}

	.tx-sgnews-teaser-description {
		text-align: justify;
	}

	.tx-sgnews-teaser-title {
		margin-bottom: 10px !important; //stylelint-disable-line

		&::after {
			display: block;
			content: '';
			width: $sg-news-headline-underline-width;
			height: #{$sg-news-headline-underline-width / 6};
			background: $sg-news-foreground-color;
		}
	}

	.tx-sgnews-teaser-meta {
		color: var(--component-color-foreground);
		// stylelint-disable declaration-no-important
		font-size: 1em !important;
		text-align: left !important;
		// stylelint-enable
		margin: -10px 0 5px;
		display: flex;
		flex-wrap: wrap;

		.date::before {
			@include inline-svg($icon-regular-calendar-alt, $black-base);
			width: 9px;
			height: 10px;
			margin: 0;
		}

		.author::before {
			@include inline-svg($icon-solid-user, $black-base);
			width: 9px;
			height: 10px;
			margin: 0;
		}

		.category::before {
			@include inline-svg($icon-solid-tag, $black-base);
			content: '';
			display: inline-block;
			width: 9px;
			height: 10px;
			margin: 0;
		}
		.tags::before {
			@include inline-svg($icon-solid-tags, $black-base);
			content: '';
			display: inline-block;
			width: 9px;
			height: 10px;
			margin: 0;
		}

		> span:not(:last-child) {
			margin-right: 15px;
		}
	}