Veams/plugin-media-query-handler

Automate the breakpoint output to head

Closed this issue · 1 comments

Not an issue, it's improvement (hopefully)

from:

head {
	font-family: desktop;

	@include bp(1024px) {
		font-family: tablet-l;
	}

	@include bp(768px) {
		font-family: tablet-p;
	}

	@include bp(657px) {
		font-family: mobile-l;
	}

	@include bp(480px) {
		font-family: mobile-p;
	}

	@include bp(360px) {
		font-family: mobile-s;
	}
}

to:

head {

	@if ($min-width) {
		font-family: unquote(nth(nth($breakpoints, 1), 1));
	} @else {
		font-family: unquote(nth(nth($breakpoints, length($breakpoints)), 1));
	}


	@each $breakpoint in $breakpoints {
		$name: nth($breakpoint, 1);
		$size: nth($breakpoint, 2);

		@include bp($size) {
			font-family: unquote($name);
		}
	}
}

thx for the improvement ... great work!