@woosmap/ui 4.120.0 → 4.121.0

package/src/styles/website/card.styl

@@ -1,433 +0,0 @@
-.wcard
-	border .1rem solid $borderColor
-	trans()
-	br()
-	display flex
-	position relative
-	text-decoration none
-	overflow hidden
-	box-shadow 0 1.5rem 3rem $dark15
-	font-size $cardFontSize
-	line-height $cardLineHeight
-	background $light
-	color $textColor
-	cursor pointer
-	&-wrapper-link
-		width 33rem
-		margin 2rem 2rem 4rem 2rem
-		&.no-link
-			cursor default
-			.wcard
-				cursor default
-				transform unset !important
-	&-container
-		margin 0 auto
-		max-width 103rem
-		width 100%
-		display flex
-		flex-wrap wrap
-		justify-content center
-		a
-			cursor default
-			&:hover
-				.icon
-					fill $primary !important
-		.wcard--office
-			border 0
-		> :nth-child(1)
-		> :nth-child(9)
-			.wcard--office
-				background-color rgba($logo1, 90%)
-		> :nth-child(2)
-		> :nth-child(10)
-			.wcard--office
-				background-color rgba($logo2, 90%)
-		> :nth-child(3)
-		> :nth-child(11)
-			.wcard--office
-				background-color rgba($logo3, 90%)
-		> :nth-child(4)
-		> :nth-child(12)
-			.wcard--office
-				background-color rgba($logo4, 90%)
-		> :nth-child(5)
-		> :nth-child(13)
-			.wcard--office
-				background-color rgba($logo5, 90%)
-		> :nth-child(6)
-		> :nth-child(14)
-			.wcard--office
-				background-color rgba($logo6, 90%)
-		> :nth-child(7)
-		> :nth-child(15)
-			.wcard--office
-				background-color rgba($logo7, 90%)
-		> :nth-child(8)
-		> :nth-child(16)
-			.wcard--office
-				background-color rgba($logo8, 90%)
-			
-
-	.section--dark &
-	.section--color1 &
-	.section--color2 &
-	.section--color3 &
-	.section--color4 &
-	.section--color5 &
-	.section--color6 &
-	.section--color7 &
-	.section--color8 &
-		border-color $dark50
-	&:not(.wcard--featured)
-		flex-direction column
-	.category
-		font-weight 400
-		font-size $fontSizeSmall
-		margin 0 0 $cardPadding 0
-	.title
-		font-size $cardTitle
-		line-height $cardTitleLineHeight
-		font-weight 600
-		margin-bottom $cardPadding
-		min-height 7.8rem
-		overflow hidden
-		text-overflow ellipsis
-		display -webkit-box
-		-webkit-line-clamp 3
-		-webkit-box-orient vertical
-		text-shadow none
-		overflow hidden
-	
-	.image-title
-		display flex
-		align-items center
-		justify-content center
-		margin-bottom 2rem
-		width 28.8rem
-		height 20.6rem
-		img
-			fullwh()
-	.title-container
-		display flex !important
-		align-items center
-		width 100%
-		min-height 7.8rem
-		margin-bottom  2rem
-	.title-card
-		font-size $cardTitle
-		line-height $cardTitleLineHeight
-		margin-bottom 0
-		overflow hidden
-		text-overflow ellipsis
-		display -webkit-box
-		-webkit-line-clamp 3
-		-webkit-box-orient vertical
-
-	.paragraph
-		margin-bottom 0 !important
-		height 7rem
-		display -webkit-box
-		-webkit-line-clamp 3
-		-webkit-box-orient vertical
-		text-shadow none
-		overflow hidden
-	&__header
-			trans()
-			height $cardHeaderHeight
-			background-repeat no-repeat
-			background-size cover
-			background-position 50% 50%
-	&__body
-		padding $cardPadding $cardPadding 0 $cardPadding
-	&__footer
-		padding $cardPadding
-	&__boxlink
-		width 100%
-	&__link
-		.btn
-			width 100%
-			&__label
-				ellipsis()
-	&--featured
-		flex-grow 1
-		justify-content center
-		.category
-			margin 0 0 2rem 0
-			font-weight 400
-			font-size $fontSizeSmall
-		.title
-			height auto
-			font-weight 700
-			font-size $title4
-			line-height $title4 * 1.4
-			display -webkit-box
-			-webkit-line-clamp 4
-			-webkit-box-orient vertical
-			margin-bottom 3rem !important
-		.wcard
-			&__content
-				display flex
-				flex-direction column
-				flex-grow 1
-				border-left 3rem solid $logo6
-				padding 2.3rem 4rem
-				height 26.2rem
-			&__header
-				width 100%
-				max-width 52rem
-				height auto
-			&__body
-				padding 0
-				flex-grow 1
-			&__footer
-				padding 0
-	&--testimonial
-		width 46rem
-		margin 2rem 2rem 12rem 2rem
-		cursor default
-		.wcard
-			&__header
-				display flex
-				align-items center
-				justify-content center
-				flex-shrink 0
-			&__content
-				padding 2rem 4rem
-				height 100%
-			&__face
-				br(50)
-				sq(12)
-				border .2rem solid $light
-				box-shadow 0 0 2rem $dark10
-				background-position center center
-				background-size cover
-			&__quote
-				f4()
-				font-style italic
-				font-weight 400
-				text-align center
-				min-height 14.5rem
-				margin-bottom 3rem
-				overflow hidden
-				text-overflow ellipsis
-				display -webkit-box
-				-webkit-line-clamp 5
-				-webkit-box-orient vertical
-			&__stars
-				text-align center
-				height 4.4rem
-				.icon
-					sq(3)
-					fill $logo8
-			&__footer
-				background-color $dark3
-				border-top .1rem solid $dark6
-				padding 0 4rem
-				height 12.5rem
-				display flex
-				align-items center
-				justify-content center
-				flex-shrink 0
-			&__author-name
-				font-weight 700
-				margin-bottom .6rem
-				text-align center
-			&__author-position
-				text-align center
-	&--small
-		width 28rem
-		flex-shrink 0
-		margin 0 3rem 13rem 3rem
-		background-color $light
-		border .1rem solid $dark10
-		box-shadow 0 1.5rem 3rem $dark10
-		.wcard-container--blog &
-			width 44rem
-			margin 0 3rem 6rem 3rem
-		.title
-			font-size $title5 !important
-			font-weight 500
-			line-height $title6 * 1.4  !important
-			margin-bottom 2rem
-			-webkit-line-clamp 4
-			.wcard-container--blog &
-				height 5.8rem
-				min-height auto
-				-webkit-line-clamp 2
-		.desc
-			height 15.4rem
-			text-overflow: ellipsis
-			display -webkit-box
-			overflow hidden
-			-webkit-box-orient: vertical
-			-webkit-line-clamp 6
-			.wcard-container--blog &
-				height 8.8rem
-				-webkit-line-clamp 4
-		.wcard
-			&__header
-				br(0)
-				height 13rem
-				width 100%
-				display flex
-				align-items center
-				justify-content center
-				margin-bottom 2rem
-				background-color unset
-				border 0
-				border-bottom .1rem solid $dark8
-				.wcard-container--blog &
-					height 22rem
-				img
-				svg
-					width 20rem
-			&__body
-				padding 0 2rem
-				flex-grow 1
-			&__footer
-				padding 2rem
-			&__link
-				.btn
-					color $primary
-					.icon
-						fill $primary
-		&:hover
-			&.wcard
-				position relative
-				background-color $light
-	&--demo
-		&.wcard--small
-			width 22rem
-			.title
-				display flex
-				align-items center
-				padding 2rem
-				color $secondary
-				border-bottom .1rem solid $dark10
-				margin-bottom 0
-				height 11rem
-				span
-					display -webkit-box
-					-webkit-line-clamp 3
-					-webkit-box-orient vertical
-					overflow hidden
-			.wcard
-				&__header
-					margin-bottom 0
-				&__content
-					padding-top 2rem
-				&__body
-					.paragraph
-						margin-bottom 2rem !important
-						overflow hidden
-						color $secondary
-				&__link
-					.btn
-						color $primary
-						.icon
-							fill $primary !important
-
-	&--office
-		margin 0 2rem 10rem 2rem
-		width 28rem
-		min-height 38.4rem
-		justify-content space-between
-		position relative
-		.city
-			trans()
-			fullwh()
-			z-index 0
-			position absolute
-			top 0
-			left 0
-			background-repeat no-repeat
-			background-size cover
-			opacity .2
-		.title
-			trans()
-			font-size $title5 !important
-			line-height $title5 * 1.3 !important
-			margin-bottom 1rem
-			display flex
-			align-items center
-		.wcard
-			&__header
-				trans()
-				textShadow()
-				z-index 1
-				opacity 1
-				padding 2rem 2rem 0 2rem
-				color $light
-			&__body
-				trans()
-				textShadow()
-				z-index 1
-				padding 2rem
-				color $light
-		&:hover
-			border-color transparent
-			.city
-				opacity 1
-			.wcard
-				&__header .title
-				&__body
-					opacity 0.01
-	&:not(.wcard--testimonial)
-		&:hover
-			border-color $dark15
-			box-shadow 0 1.5rem 1.6rem $dark15
-			transform translateY(-.4rem)
-			color $textColor
-			.wcard
-				&__link
-					.btn
-						color $linkColorHover !important
-						.icon
-							fill $linkColorHover !important
-
-@media screen and (min-width 1260px)
-	.wcard-container
-		max-width 100%
-
-@media screen and (max-width 960px)
-	.wcard--testimonial
-		margin 0 0 6rem 0
-
-@media screen and (max-width 768px)
-	.wcard
-		&--featured
-			flex-direction column
-			.title
-				font-size $title5  !important
-				line-height $title5 * 1.3  !important
-			.wcard
-				&__header
-					height 22rem
-					max-width 100%
-				&__content
-					height auto
-					border-top 3rem solid $logo6
-					border-left 0
-					padding 2.3rem
-		&--small
-			width auto
-			max-width unset
-			margin 0 0 5rem 0
-			.wcard-container--blog &
-				width auto
-				max-width unset
-				margin 0 0 3rem 0
-				.title
-					-webkit-line-clamp 3
-					height 8.3rem
-					margin-bottom 1rem !important
-				
-		&--testimonial
-			width 100%
-
-@media screen and (max-width 580px)
-	.wcard--demo
-		&.wcard--small
-			width auto
-	.wcard--office
-		margin 0 0 5rem 0