pages/animelist/animelist.scarlet

.anime-list-user-avatar
	position absolute
	top calc(content-padding / 2)
	left calc(content-padding / 2)

.anime-list-container
	width 100%
	max-width 800px
	margin 0 auto
	margin-bottom 1rem

.anime-list
	display grid
	grid-template-rows 40px
	grid-template-columns 100%

.anime-list-item
	table-row
	horizontal
	align-items center
	padding-right 1rem
	width 100%
	height 40px

.anime-list-item-image-container
	padding 0
	width anime-image-tiny-width

.anime-list-item-image-link
	display flex

.anime-list-item-image
	anime-list-item-image

.anime-list-item-name
	flex 1
	margin 0.5rem 1rem
	padding 0
	clip-long-text

	a
		color anime-list-item-name-color
		:hover
			color link-hover-color

.anime-list-item-episodes
	horizontal
	justify-content flex-end
	text-align right
	white-space nowrap
	flex-basis 80px
	flex-shrink 1

	:hover
		.plus-episode
			opacity 1
			pointer-events auto

.anime-list-item-episodes-watched
	flex 0.45
	horizontal
	justify-content flex-end

.plus-episode
	display inline-block
	cursor pointer
	opacity 0
	pointer-events none
	margin-left 1px
	transition opacity transition-speed ease

.plus-episode-dummy
	display inline-block
	opacity 0

.anime-list-item-episodes-separator
	flex 0.1
	opacity 0.5

.anime-list-item-episodes-max
	flex 0.3
	opacity 0.5

.anime-list-item-rating
	horizontal
	text-align right
	justify-content flex-end
	flex-basis 65px
	flex-shrink 1

// .rating-label
// 	opacity 0.5
// 	margin-right 0.2rem

.anime-list-item-actions
	display none !important

// 	// Beautify icon alignment
// 	.raw-icon
// 		margin-bottom -4px

> 740px
	.anime-list-item-actions
		display flex !important
		flex-basis 30px
		flex-shrink 1

		:empty
			display none !important

.anime-list-item-airing-date
	display none !important

> 700px
	.anime-list-title
		display block

	.anime-list-item-airing-date
		display flex !important
		text-align right
		flex-basis 150px
		flex-shrink 1
		opacity 0.8
		justify-content flex-end

	.anime-list-item-episodes
		flex-basis 130px

< 1100px
	.anime-list-item-rating
		display none !important
Anime list no longer embedded in profile 2018-03-14 19:13:20 +00:00			`.anime-list-user-avatar`
			`position absolute`
			`top calc(content-padding / 2)`
			`left calc(content-padding / 2)`

Improved anime lists 2017-06-29 21:27:21 +00:00			`.anime-list-container`
Added stylish mountable effect 2017-06-20 18:13:04 +00:00			`width 100%`
Smaller anime list 2017-11-08 16:21:56 +00:00			`max-width 800px`
Design improvements 2017-07-22 14:31:25 +00:00			`margin 0 auto`
Improved anime lists 2017-06-29 21:27:21 +00:00			`margin-bottom 1rem`

			`.anime-list`
Switched to CSS grid rendering for anime lists 2018-03-14 00:29:45 +00:00			`display grid`
			`grid-template-rows 40px`
			`grid-template-columns 100%`
Added stylish mountable effect 2017-06-20 18:13:04 +00:00
Anime episodes stored under a different table 2017-07-10 14:58:34 +00:00			`.anime-list-item`
Improved anime list rendering 2017-12-04 12:23:45 +00:00			`table-row`
Anime episodes stored under a different table 2017-07-10 14:58:34 +00:00			`horizontal`
Improved anime list rendering 2017-12-04 12:23:45 +00:00			`align-items center`
			`padding-right 1rem`
Switched to CSS grid rendering for anime lists 2018-03-14 00:29:45 +00:00			`width 100%`
			`height 40px`
Added anime cover images to lists 2017-07-21 03:09:47 +00:00
			`.anime-list-item-image-container`
			`padding 0`
Improved editor list display 2018-03-22 19:15:21 +00:00			`width anime-image-tiny-width`
Added anime cover images to lists 2017-07-21 03:09:47 +00:00
Improved anime list rendering on missing images 2018-03-03 15:14:52 +00:00			`.anime-list-item-image-link`
			`display flex`

Added anime cover images to lists 2017-07-21 03:09:47 +00:00			`.anime-list-item-image`
Improved calendar style 2018-03-08 16:36:55 +00:00			`anime-list-item-image`
Added anime cover images to lists 2017-07-21 03:09:47 +00:00
Added stylish mountable effect 2017-06-20 18:13:04 +00:00			`.anime-list-item-name`
Improved anime list 2017-06-25 12:58:27 +00:00			`flex 1`
Improved anime list rendering 2017-12-04 12:23:45 +00:00			`margin 0.5rem 1rem`
Fixed padding in anime list comparison 2018-03-05 18:01:46 +00:00			`padding 0`
Improved search 2017-07-20 12:26:43 +00:00			`clip-long-text`
Added stylish mountable effect 2017-06-20 18:13:04 +00:00
Redesign 2017-11-04 16:11:47 +00:00			`a`
Redesign 2017-11-05 05:56:09 +00:00			`color anime-list-item-name-color`
Redesign 2017-11-04 16:11:47 +00:00			`:hover`
			`color link-hover-color`

Added stylish mountable effect 2017-06-20 18:13:04 +00:00			`.anime-list-item-episodes`
Improved anime list 2017-06-25 12:58:27 +00:00			`horizontal`
			`justify-content flex-end`
			`text-align right`
			`white-space nowrap`
Improved anime list rendering 2017-12-04 12:23:45 +00:00			`flex-basis 80px`
			`flex-shrink 1`
Improved anime list 2017-06-25 12:58:27 +00:00
Improved large anime lists 2017-07-12 22:34:33 +00:00			`:hover`
			`.plus-episode`
			`opacity 1`
CSS and SW cleanup 2017-10-20 00:43:02 +00:00			`pointer-events auto`
Improved large anime lists 2017-07-12 22:34:33 +00:00
Improved anime list 2017-06-25 12:58:27 +00:00			`.anime-list-item-episodes-watched`
Improved anime list rendering 2017-12-04 12:23:45 +00:00			`flex 0.45`
Improved large anime lists 2017-07-12 22:34:33 +00:00			`horizontal`
			`justify-content flex-end`

			`.plus-episode`
			`display inline-block`
			`cursor pointer`
			`opacity 0`
Refactor 2017-10-14 10:45:22 +00:00			`pointer-events none`
Improved large anime lists 2017-07-12 22:34:33 +00:00			`margin-left 1px`
			`transition opacity transition-speed ease`
Improved anime list 2017-06-25 12:58:27 +00:00
Improved anime list rendering 2017-12-04 12:23:45 +00:00			`.plus-episode-dummy`
			`display inline-block`
			`opacity 0`

Improved anime list 2017-06-25 12:58:27 +00:00			`.anime-list-item-episodes-separator`
Improved anime list rendering 2017-12-04 12:23:45 +00:00			`flex 0.1`
Improved anime list 2017-06-25 12:58:27 +00:00			`opacity 0.5`

			`.anime-list-item-episodes-max`
Improved anime list rendering 2017-12-04 12:23:45 +00:00			`flex 0.3`
Improved anime list 2017-06-25 12:58:27 +00:00			`opacity 0.5`

Added stylish mountable effect 2017-06-20 18:13:04 +00:00			`.anime-list-item-rating`
Improved anime list rendering 2017-12-04 12:23:45 +00:00			`horizontal`
Anime episodes stored under a different table 2017-07-10 14:58:34 +00:00			`text-align right`
Added anime cover images to lists 2017-07-21 03:09:47 +00:00			`justify-content flex-end`
Improved anime list rendering 2017-12-04 12:23:45 +00:00			`flex-basis 65px`
			`flex-shrink 1`

			`// .rating-label`
			`// opacity 0.5`
			`// margin-right 0.2rem`
Improved anime list 2017-06-25 12:58:27 +00:00
			`.anime-list-item-actions`
Added user follows 2017-07-21 08:10:48 +00:00			`display none !important`
Improved anime list 2017-06-25 12:58:27 +00:00
Anime episodes stored under a different table 2017-07-10 14:58:34 +00:00			`// // Beautify icon alignment`
			`// .raw-icon`
			`// margin-bottom -4px`
Improved anime list 2017-06-25 12:58:27 +00:00
Improved mobile list 2017-07-05 00:56:50 +00:00			`> 740px`
			`.anime-list-item-actions`
Added user follows 2017-07-21 08:10:48 +00:00			`display flex !important`
Improved anime list rendering 2017-12-04 12:23:45 +00:00			`flex-basis 30px`
			`flex-shrink 1`
Added user follows 2017-07-21 08:10:48 +00:00
			`:empty`
			`display none !important`
Improved mobile list 2017-07-05 00:56:50 +00:00
Added airing dates 2017-06-29 06:32:46 +00:00			`.anime-list-item-airing-date`
Improved mobile list 2017-07-21 03:51:11 +00:00			`display none !important`
Added airing dates 2017-06-29 06:32:46 +00:00
			`> 700px`
Anime list no longer embedded in profile 2018-03-14 19:13:20 +00:00			`.anime-list-title`
			`display block`

Added airing dates 2017-06-29 06:32:46 +00:00			`.anime-list-item-airing-date`
Improved mobile list 2017-07-21 03:51:11 +00:00			`display flex !important`
Anime episodes stored under a different table 2017-07-10 14:58:34 +00:00			`text-align right`
Improved anime list rendering 2017-12-04 12:23:45 +00:00			`flex-basis 150px`
			`flex-shrink 1`
Added anime cover images to lists 2017-07-21 03:09:47 +00:00			`opacity 0.8`
			`justify-content flex-end`
Added airing dates 2017-06-29 06:32:46 +00:00
Improved anime list rendering 2017-12-04 12:23:45 +00:00			`.anime-list-item-episodes`
			`flex-basis 130px`

Improved anime list 2017-06-25 12:58:27 +00:00			`< 1100px`
			`.anime-list-item-rating`
Switched to CSS grid rendering for anime lists 2018-03-14 00:29:45 +00:00			`display none !important`