HEX
Server: Microsoft-IIS/8.5
System: Windows NT YDAWBH120 6.3 build 9600 (Windows Server 2012 R2 Standard Edition) AMD64
User: tentjecom_web (0)
PHP: 7.4.14
Disabled: NONE
Upload Files
File: D:/HostingSpaces/SBogers95/rentman.io/resources/assets/sass/site/8-Scopes/_scopes.text.scss
/**
 * All text elements that can be added by the user through a CMS
 */


.s-text {

	// Smaller heading on mobile
	//@include mq($max: $header-large-bp) {
	//	& > h1 {
	//		@include font(x2-large);
	//	}
	//	& > h2 {
	//		@include font(x-large);
	//	}
	//	& > h3 {
	//		@include font(mid-large);
	//	}
	//	& > h4 {
	//		@include font(mid);
	//	}
	//}

	// First the owl selector for setting a default vertical rhythm
	& > * + * {
		margin-top: 1rem;

		&.c-text-button {
			margin-top: 2.5rem;
		}
	}

	& > h1,
	& > h2,
	& > h3,
	& > h4,
	& > h5,
	& > h6 {
		margin-bottom: 1.5rem;
		color: palette(secondary);
	}

	p > strong {
		color: palette(secondary);
	}

	& > ul:not([class]) {
		list-style: none;

		& > li {
			position: relative;
			margin-left: -1.125em;
			padding-left: 1.125em;

			&::before {
				content: "\2022";
				position: absolute;
				top: 6px;
				left: 0;
				font-size: 0.875em;
				line-height: 18px;
				color: palette(secondary);
			}
		}
	}

	& > ol:not([class]) {
		list-style: none;
		counter-reset: ol-counter;

		& > li {
			counter-increment: ol-counter;
			position: relative;
			margin-left: -1.125em;
			padding-left: 1.8em;

			&::before {
				@include font(small, $weight: 700);
				content: counter(ol-counter) ". ";
				position: absolute;
				top: 5px;
				left: 0;
				width: 1.275em;
				text-align: right;
				font-size: 0.75em;
				line-height: 18px;
				color: palette(secondary);
			}
		}
	}

	p.is-large {
		@include font(large, 42);
	}

	p.is-semi-large {
		@include font(large, 42, 700);
	}

	p.is-intro {
		@include font(sl-large, 42);
	}

	.on-dark & {

		color: rgba(white, 0.8);

		> h1,
		> h2,
		> h3,
		> h4,
		> h5,
		> h6 {
			color: white;
		}

		p > strong {
			color: white;
		}

		& > ul:not([class]) {
			& > li {
				&::before {
					color: white;
				}
			}
		}

		& > ol:not([class]) {
			& > li {
				&::before {
					color: white;
				}
			}
		}
	}
}

.s-text--primary {
	@include font-family(primary);
}

.s-text--large {
	@include font-size(s-mid);
}

.s-text--mid {
	@include font-size(mid);
}