pages/anime/anime.scarlet

.anime
	vertical
	width 100%
	max-width 1700px
	margin 0 auto

.anime-main-column
	vertical
	flex 1

.anime-side-column
	sidebar

> 1250px
	.anime
		horizontal

	.anime-side-column
		sidebar-medium

> 1400px
	.anime-side-column
		sidebar-big

.anime-header
	vertical

.anime-title
	text-align center
	margin-bottom 0.5rem

> 800px
	.anime-header
		horizontal
		page-header

	.anime-title
		text-align left

	.anime-alternative-title
		text-align left

	.anime-summary-footer-container
		vertical
		flex 1
		justify-content flex-end
		align-items flex-end

	.anime-summary-footer
		width 100%
		display flex
		justify-content space-between
		align-items center

		button,
		.button
			margin 0.25rem

.anime-info-table
	vertical
	margin 0

	tr
		horizontal

.anime-info-key
	flex 1

.anime-info-value
	text-align right

.anime-section
	margin-top 1rem

	:first-child
		margin-top 0 !important

.anime-section-name
	font-weight bold

.anime-image-container
	vertical
	justify-content flex-start
	align-items center

.anime-start-date
	font-size 0.7rem
	line-height 1.7em
	opacity 0.65
	margin-top 0.5rem

.anime-cover-image
	width anime-image-large-width
	height anime-image-large-height
	border-radius ui-element-border-radius

	default-transition
	object-fit cover

	saturate-up
	shadow-up

.anime-summary
	// ...

.anime-info
	vertical
	flex 1

.space
	width content-padding
	height content-padding

.anime-alternative-title
	font-size 0.9em
	margin-top 0
	margin-bottom 0.5rem
	text-align center
	font-weight normal
	line-height content-line-height

	.japanese
		color anime-alternative-title-color !important

.anime-actions
	horizontal
	justify-content center

.anime-widget
	margin-top 0.6rem
	margin-bottom 0.4rem

.anime-rating
	// ...

.anime-friends
	.user-avatars
		justify-content flex-start

.relations
	horizontal-wrap

.relation
	vertical
	align-items center
	padding 0.5rem

.relation-type
	font-size 0.7rem
	margin-top 0.1rem

.relation-image
	width 100px
	height 141px
	border-radius ui-element-border-radius
	object-fit cover
	default-transition
	shadow-up
Redesign 2017-11-03 17:10:31 +00:00			`.anime`
Redesign 2017-11-04 07:45:39 +00:00			`vertical`
Fixed anime width bug 2018-03-09 00:06:43 +00:00			`width 100%`
Optimize anime page for 3440x1400 screens 2018-03-08 15:25:22 +00:00			`max-width 1700px`
			`margin 0 auto`
Redesign 2017-11-04 07:45:39 +00:00
			`.anime-main-column`
			`vertical`
			`flex 1`

			`.anime-side-column`
Simplified sidebar creation 2017-11-29 15:29:30 +00:00			`sidebar`
Redesign 2017-11-04 07:45:39 +00:00
Smaller font for laptop sizes 2017-11-08 14:50:48 +00:00			`> 1250px`
Redesign 2017-11-04 07:45:39 +00:00			`.anime`
			`horizontal`

			`.anime-side-column`
Simplified sidebar creation 2017-11-29 15:29:30 +00:00			`sidebar-medium`
Smaller font for laptop sizes 2017-11-08 14:50:48 +00:00
			`> 1400px`
			`.anime-side-column`
Simplified sidebar creation 2017-11-29 15:29:30 +00:00			`sidebar-big`
Redesign 2017-11-03 17:10:31 +00:00
Translated the basic style files to scarlet 2016-11-28 16:06:00 +00:00			`.anime-header`
Redesign 2017-11-03 17:10:31 +00:00			`vertical`
Translated the basic style files to scarlet 2016-11-28 16:06:00 +00:00
Redesign 2017-11-03 17:10:31 +00:00			`.anime-title`
			`text-align center`
			`margin-bottom 0.5rem`

			`> 800px`
Everything is scarlet now 2016-12-01 15:27:53 +00:00			`.anime-header`
Redesign 2017-11-03 17:10:31 +00:00			`horizontal`
Improved character page design 2018-04-24 02:16:11 +00:00			`page-header`
Smaller font for laptop sizes 2017-11-08 14:50:48 +00:00
Redesign 2017-11-03 17:10:31 +00:00			`.anime-title`
			`text-align left`
Everything is scarlet now 2016-12-01 15:27:53 +00:00
Redesign 2017-11-04 07:45:39 +00:00			`.anime-alternative-title`
			`text-align left`

Style improvements for genres 2017-11-29 23:54:09 +00:00			`.anime-summary-footer-container`
			`vertical`
			`flex 1`
			`justify-content flex-end`
			`align-items flex-end`

Added genres to anime pages 2017-11-29 23:48:02 +00:00			`.anime-summary-footer`
Style improvements for genres 2017-11-29 23:54:09 +00:00			`width 100%`
Added genres to anime pages 2017-11-29 23:48:02 +00:00			`display flex`
			`justify-content space-between`
			`align-items center`
Redesign 2017-11-05 10:02:31 +00:00
			`button,`
			`.button`
Style improvements for genres 2017-11-29 23:54:09 +00:00			`margin 0.25rem`
Redesign 2017-11-05 10:02:31 +00:00
Redesign 2017-11-04 07:45:39 +00:00			`.anime-info-table`
Improved tooltips 2018-04-18 14:27:08 +00:00			`vertical`
Redesign 2017-11-04 07:45:39 +00:00			`margin 0`
Redesign 2017-11-04 10:09:19 +00:00
Improved tooltips 2018-04-18 14:27:08 +00:00			`tr`
			`horizontal`

			`.anime-info-key`
			`flex 1`

Redesign 2017-11-04 10:09:19 +00:00			`.anime-info-value`
			`text-align right`
Redesign 2017-11-04 07:45:39 +00:00
			`.anime-section`
			`margin-top 1rem`

			`:first-child`
			`margin-top 0 !important`

Everything is scarlet now 2016-12-01 15:27:53 +00:00			`.anime-section-name`
			`font-weight bold`

Translated the basic style files to scarlet 2016-11-28 16:06:00 +00:00			`.anime-image-container`
Implemented anime relations 2017-10-17 14:58:28 +00:00			`vertical`
			`justify-content flex-start`
			`align-items center`

			`.anime-start-date`
			`font-size 0.7rem`
			`line-height 1.7em`
			`opacity 0.65`
			`margin-top 0.5rem`
Translated the basic style files to scarlet 2016-11-28 16:06:00 +00:00
Improved scarlet styles 2016-11-29 15:50:50 +00:00			`.anime-cover-image`
Use variables for image sizes 2018-03-20 03:05:54 +00:00			`width anime-image-large-width`
			`height anime-image-large-height`
Added Hall of Fame 2018-03-27 19:08:26 +00:00			`border-radius ui-element-border-radius`
Smaller font for laptop sizes 2017-11-08 14:50:48 +00:00
Improved styles 2016-11-30 15:29:36 +00:00			`default-transition`
Translated the basic style files to scarlet 2016-11-28 16:06:00 +00:00			`object-fit cover`

Improved styles 2016-11-30 12:33:11 +00:00			`saturate-up`
			`shadow-up`
Redesign 2017-11-03 17:10:31 +00:00
			`.anime-summary`
			`// ...`

Translated the basic style files to scarlet 2016-11-28 16:06:00 +00:00			`.anime-info`
Using mixins now 2016-11-29 03:37:36 +00:00			`vertical`
Improved styles 2016-11-30 12:33:11 +00:00			`flex 1`
Improved styles 2016-11-30 15:29:36 +00:00
			`.space`
			`width content-padding`
			`height content-padding`
Translated the basic style files to scarlet 2016-11-28 16:06:00 +00:00
			`.anime-alternative-title`
			`font-size 0.9em`
Improved meta data 2017-07-06 19:38:19 +00:00			`margin-top 0`
Improved anime page styles 2016-12-02 06:31:09 +00:00			`margin-bottom 0.5rem`
Redesign 2017-11-04 07:45:39 +00:00			`text-align center`
Improved meta data 2017-07-06 19:38:19 +00:00			`font-weight normal`
			`line-height content-line-height`
Smaller font for laptop sizes 2017-11-08 14:50:48 +00:00
Japanese title tokenizer 2017-07-11 14:54:17 +00:00			`.japanese`
Redesign 2017-11-04 07:45:39 +00:00			`color anime-alternative-title-color !important`
Translated the basic style files to scarlet 2016-11-28 16:06:00 +00:00
Implemented anime list basics 2017-06-08 19:54:39 +00:00			`.anime-actions`
Improved search results 2017-11-05 08:55:42 +00:00			`horizontal`
Redesign 2017-11-05 10:02:31 +00:00			`justify-content center`
Redesign 2017-11-03 17:10:31 +00:00
Added stylish mountable effect 2017-06-20 18:13:04 +00:00			`.anime-widget`
			`margin-top 0.6rem`
			`margin-bottom 0.4rem`

Improved tooltips 2018-04-18 14:27:08 +00:00			`.anime-rating`
			`// ...`
Implemented ratings UI 2017-06-08 09:51:34 +00:00
Show friends on anime 2017-07-21 09:25:53 +00:00			`.anime-friends`
			`.user-avatars`
			`justify-content flex-start`

Translated the basic style files to scarlet 2016-11-28 16:06:00 +00:00			`.relations`
Using mixins now 2016-11-29 03:37:36 +00:00			`horizontal-wrap`
Translated the basic style files to scarlet 2016-11-28 16:06:00 +00:00
			`.relation`
Using mixins now 2016-11-29 03:37:36 +00:00			`vertical`
Translated the basic style files to scarlet 2016-11-28 16:06:00 +00:00			`align-items center`
			`padding 0.5rem`

Using mixins now 2016-11-29 03:37:36 +00:00			`.relation-type`
			`font-size 0.7rem`
			`margin-top 0.1rem`

Translated the basic style files to scarlet 2016-11-28 16:06:00 +00:00			`.relation-image`
			`width 100px`
Improved styles 2016-11-30 15:29:36 +00:00			`height 141px`
Added Hall of Fame 2018-03-27 19:08:26 +00:00			`border-radius ui-element-border-radius`
Improved styles 2016-11-30 15:29:36 +00:00			`object-fit cover`
			`default-transition`
Everything is scarlet now 2016-12-01 15:27:53 +00:00			`shadow-up`