<commit_before>/*---

A div that's hidden on mobile, and appears at tablet

```
<div class="hidden visible--tablet sg-panel"><code>hidden--tablet visible--desktop</code></div>
```

A div that's visible on mobile, hidden at tablet, and visible again at desktop

```
<div class="hidden--tablet visible--desktop sg-panel"><code>hidden--tablet visible--desktop</code></div>
```

Visible classes can also be inline and inline-block. Just use classes such as `visible-inline-block--tablet`.

*/

.hidden {
	@include hidden;
}

.visible {
	@include visible;
}

.visible-inline {
	@include visible('inline');
}

.visible-inline-block {
	@include visible('inline-block');
}

.visible-td {
	@include visible('table-cell');
}

@each $name, $min-width in $breakpoints {

	@include mq($name) {

		.hidden--#{$name} {
			@include hidden;
		}

		.visible--#{$name} {
			@include visible;
		}

		.visible-inline--#{$name} {
			@include visible('inline');
		}

		.visible-inline-block--#{$name} {
			@include visible('inline-block');
		}

		.visible-td--#{$name} {
			@include visible('table-cell');
		}

	}

}<commit_msg>Updates visible classes for consistency with other breakpoint classes.<commit_after>/*---

A div that's hidden on mobile, and appears at tablet

```
<div class="hidden visible--tablet sg-panel"><code>hidden--tablet visible--desktop</code></div>
```

A div that's visible on mobile, hidden at tablet, and visible again at desktop

```
<div class="hidden--tablet visible--desktop sg-panel"><code>hidden--tablet visible--desktop</code></div>
```

Visible classes can also be inline and inline-block. Just use classes such as `visible--tablet-inline-block`.

*/

.hidden {
	@include hidden;
}

.visible {
	@include visible;

	&--inline {
		@include visible('inline');
	}

	&--inline-block {
		@include visible('inline-block');
	}

	&--td {
		@include visible('table-cell');
	}
}

@each $name, $min-width in $breakpoints {

	@include mq($name) {
		.hidden--#{$name} {
			@include hidden;
		}

		.visible--#{$name} {
			@include visible;
		}

		.visible--#{$name}-inline {
			@include visible('inline');
		}

		.visible--#{$name}-inline-block {
			@include visible('inline-block');
		}

		.visible--#{$name}-td {
			@include visible('table-cell');
		}
	}

}
{'fraction_non_alphanumeric': 0.18617021276595744, 'fraction_numerical': 0.0, 'mean_word_length': 3.523046092184369, 'pattern_counts': {'":': 0, '<': 19, '<?xml version=': 0, '>': 19, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4416048', 'n_tokens_mistral': 828, 'n_tokens_neox': 736, 'n_words': 180}