styles/tabs.scarlet

const tab-padding-x = 1rem

.tab
	horizontal
	align-items center
	color text-color
	padding 0.5rem tab-padding-x
	background-color tab-background
	border ui-border
	border-left none
	white-space nowrap

	:hover
		color text-color
		background-color tab-hover-background
		cursor pointer

	:active
		transform none

	&.active
		background-color tab-active-background
		color tab-active-color

	:first-child
		border-left ui-border
		border-top-left-radius ui-element-border-radius
		border-bottom-left-radius ui-element-border-radius

	:last-child
		border-top-right-radius ui-element-border-radius
		border-bottom-right-radius ui-element-border-radius

< 920px
	.tab
		padding 0.75rem tab-padding-x

		.padded-icon
			margin-right 0

	.tab-text
		display none

.tabs
	horizontal
	justify-content center
	margin content-padding calc(content-padding / 4)
	margin-top 0

.tab-groups
	horizontal
	justify-content center
Improved tab size on mobile devices 2019-08-30 07:51:18 +00:00			`const tab-padding-x = 1rem`

Changed forum-tags to tabs 2017-07-03 13:34:50 +00:00			`.tab`
Use web components for SVG icons 2019-08-30 07:04:28 +00:00			`horizontal`
			`align-items center`
Design updates 2017-07-23 03:51:00 +00:00			`color text-color`
Improved tab size on mobile devices 2019-08-30 07:51:18 +00:00			`padding 0.5rem tab-padding-x`
Redesign 2017-11-04 16:11:47 +00:00			`background-color tab-background`
Design updates 2017-07-23 03:51:00 +00:00			`border ui-border`
			`border-left none`
Design improvements 2017-07-22 14:31:25 +00:00			`white-space nowrap`
Changed forum-tags to tabs 2017-07-03 13:34:50 +00:00
Design updates 2017-07-23 03:51:00 +00:00			`:hover`
			`color text-color`
Redesign 2017-11-04 16:11:47 +00:00			`background-color tab-hover-background`
Some style changes 2017-11-05 19:39:19 +00:00			`cursor pointer`
Design updates 2017-07-23 03:51:00 +00:00
			`:active`
Redesign 2017-07-22 13:04:54 +00:00			`transform none`
Design updates 2017-07-23 03:51:00 +00:00
Design improvements 2017-07-22 14:31:25 +00:00			`&.active`
Redesign 2017-11-04 16:11:47 +00:00			`background-color tab-active-background`
			`color tab-active-color`
Design improvements 2017-07-22 14:31:25 +00:00
			`:first-child`
			`border-left ui-border`
Icon update 2017-11-04 21:23:07 +00:00			`border-top-left-radius ui-element-border-radius`
			`border-bottom-left-radius ui-element-border-radius`

			`:last-child`
			`border-top-right-radius ui-element-border-radius`
			`border-bottom-right-radius ui-element-border-radius`
Changed forum-tags to tabs 2017-07-03 13:34:50 +00:00
			`< 920px`
			`.tab`
Improved tab size on mobile devices 2019-08-30 07:51:18 +00:00			`padding 0.75rem tab-padding-x`

Removed old icon references 2019-08-30 07:22:08 +00:00			`.padded-icon`
Changed forum-tags to tabs 2017-07-03 13:34:50 +00:00			`margin-right 0`
Added tab groups 2018-03-13 01:31:01 +00:00
Changed forum-tags to tabs 2017-07-03 13:34:50 +00:00			`.tab-text`
			`display none`

			`.tabs`
Redesign 2017-07-22 13:04:54 +00:00			`horizontal`
Design improvements 2017-07-22 14:31:25 +00:00			`justify-content center`
Added tab groups 2018-03-13 01:31:01 +00:00			`margin content-padding calc(content-padding / 4)`
			`margin-top 0`

			`.tab-groups`
			`horizontal`
			`justify-content center`