🎨 update style

This commit is contained in:
Tykayn 2023-07-06 18:16:59 +02:00 committed by tykayn
parent 752c30f89e
commit 0c54a81f5f
3 changed files with 304 additions and 240 deletions

File diff suppressed because one or more lines are too long

View File

@ -1,6 +1,227 @@
/**
responsive land custom
*/
@media all and (max-width: 600px) {
.burger-menu span, .circle-right, .circle-left, .arrow-left, .arrow-right {
display: none;
}
#transactionnal_webdesign .title, #content_first, #for_all_your {
font-size: 2rem;
}
#welcome h2 {
font-size: 4rem;
}
#content_all .columns {
max-width: 100vw;
}
.flip-container + .flip-container {
margin-top: 40vh !important;
}
#transactionnal_webdesign {
.description {
font-size: 5rem !important;
padding-top: 4rem;
}
.sub-title {
font-weight: 600;
font-size: 5rem;
}
min-height: 160vh;
}
section#carry {
.description {
margin-top: 3vh;
font-size: 5rem;
}
.computer-block {
margin-top: 32vh;
}
}
#carry .bubbles p {
&:nth-of-type(1) {
left: -7%;
top: -93rem;
}
&:nth-of-type(2) {
left: 36%;
top: -112rem;
}
&:nth-of-type(3) {
left: -10vw;
}
}
#kyc {
.description2 {
font-size: 3rem;
padding: 0 1rem;
}
.title {
font-size: 5rem;
line-height: 1em;
}
.bubbles {
.bubble {
span {
margin-left: 0;
}
&:nth-of-type(2) {
margin-left: -2rem;
}
}
margin-top: -200vw;
}
}
#china {
height: 200vh;
.top {
font-size: 3rem;
margin-bottom: 1rem;
}
}
#we_develop {
.title {
font-size: 3rem;
}
.circle {
&.circle-left {
left: 1vw;
}
&.circle-right {
right: 1vw;
}
}
.long_term {
margin-right: 5rem;
margin-top: -37rem;
}
.quick {
left: 4rem;
top: 97rem;
}
}
#full_creative .title {
padding: 1rem;
font-size: 5rem;
}
#our_team {
margin-top: 30rem;
padding-bottom: 20rem;
.title {
font-size: 10rem;
line-height: 7rem;
}
.sub-category {
margin-bottom: 10rem;
padding-left: 0rem;
}
}
#china_achievements {
padding: 1rem;
margin-top: 950vw;
.big-number {
font-size: 8rem;
}
}
#baozun_group {
margin-top: 1126vw;
.title {
padding-top: 25vh;
}
margin: 0 0;
position: relative;
top: 1000vw;
}
#coming_soon, .credits {
margin: 0 0;
position: relative;
top: 1000vw;
}
#popover {
margin-top: 132vw;
}
/**
flipping part
*/
#flipping_zone {
margin-top: -100vh;
position: static;
}
.flip-container {
position: relative;
+ .flip-container {
margin-top: 40vh;
}
.container-text {
z-index: 1;
left: 10vw;
}
.text-title {
margin-top: 0;
}
.phone-container {
left: 42vw;
top: 5vh;
}
&.flip-from-left {
.container-text {
left: 10vw;
top: 0;
}
.phone-container {
left: 10vw;
top: 10vh;
}
}
}
}
@media all and (min-width: 1440px) {
section {
@ -17,6 +238,9 @@ responsive land custom
top: 10vh;
}
}
#popover, #portfolio {
height: 130vh;
}
#transactional_webdesign {
.sub-title {
font-size: 4.8rem;
@ -46,6 +270,7 @@ responsive land custom
#transactionnal_webdesign {
padding-top: 0;
.description {
padding-top: 5rem;
}
@ -54,4 +279,82 @@ responsive land custom
#carry .bubbles {
margin-top: -50vh;
}
#china {
.block-items {
.block-item {
&:nth-of-type(1) {
background: url("/assets/img/block_pillar_1.png") no-repeat 0 20%;
}
//&:nth-of-type(2) {
// background: url("/assets/img/block_pillar_2.png") no-repeat 0 20%;
//}
//&:nth-of-type(3) {
// background: url("/assets/img/block_pillar_3.png") no-repeat 0 20%;
//}
//&:nth-of-type(4) {
// background: url("/assets/img/block_pillar_4.png") no-repeat 0 20%;
//}
}
}
}
#we_develop {
height: 200vh;
.circle {
&.circle-right {
right: 25vw;
}
&.circle-left {
left: 25vw;
}
}
}
#full_creative, #our_team {
min-height: 175vh;
}
}
@media all and (min-width: 1900px) {
.flip-container .container-text{
left: 600px;
}
#carry {
min-height: 220vh;
}
#we_develop {
height: 200vh;
}
#main_title_container h2 {
margin-top: 0;
}
#china .columns{
margin-top: -6vh;
}
#our_team{
min-height: 200vh;
}
#china_achievements {
margin-top: 0;
padding: 1rem 172px 0;
.counter-block .text-description{
font-size: 1rem;
}
}
#full_creative {
min-height: 100vh;
}
}

View File

@ -1,223 +1,6 @@
/**
responsive land custom
*/
@media all and (max-width: 600px) {
.burger-menu span, .circle-right, .circle-left, .arrow-left, .arrow-right {
display: none;
}
#transactionnal_webdesign .title, #content_first, #for_all_your {
font-size: 2rem;
}
#welcome h2 {
font-size: 4rem;
}
#content_all .columns {
max-width: 100vw;
}
.flip-container + .flip-container {
margin-top: 40vh !important;
}
#transactionnal_webdesign {
.description {
font-size: 5rem !important;
padding-top: 4rem;
}
.sub-title {
font-weight: 600;
font-size: 5rem;
}
min-height: 160vh;
}
section#carry {
.description {
margin-top: 3vh;
font-size: 5rem;
}
.computer-block {
margin-top: 32vh;
}
}
#carry .bubbles p {
&:nth-of-type(1) {
left: -7%;
top: -93rem;
}
&:nth-of-type(2) {
left: 36%;
top: -112rem;
}
&:nth-of-type(3) {
left: -10vw;
}
}
#kyc {
.description2 {
font-size: 3rem;
padding: 0 1rem;
}
.title {
font-size: 5rem;
line-height: 1em;
}
.bubbles {
.bubble {
span {
margin-left: 0;
}
&:nth-of-type(2) {
margin-left: -2rem;
}
}
margin-top: -200vw;
}
}
#china {
height: 200vh;
.top {
font-size: 3rem;
margin-bottom: 1rem;
}
}
#we_develop {
.title {
font-size: 3rem;
}
.circle {
&.circle-left {
left: 1vw;
}
&.circle-right {
right: 1vw;
}
}
.long_term {
margin-right: 5rem;
margin-top: -37rem;
}
.quick {
left: 4rem;
top: 97rem;
}
}
#full_creative .title {
padding: 1rem;
font-size: 5rem;
}
#our_team {
margin-top: 30rem;
padding-bottom: 20rem;
.title {
font-size: 10rem;
line-height: 7rem;
}
.sub-category {
margin-bottom: 10rem;
padding-left: 0rem;
}
}
#china_achievements {
padding: 1rem;
margin-top: 950vw;
.big-number {
font-size: 8rem;
}
}
#baozun_group {
margin-top: 1126vw;
.title {
padding-top: 25vh;
}
margin: 0 0;
position: relative;
top: 1000vw;
}
#coming_soon, .credits {
margin: 0 0;
position: relative;
top: 1000vw;
}
#popover {
margin-top: 132vw;
}
/**
flipping part
*/
#flipping_zone {
margin-top: -100vh;
position: static;
}
.flip-container {
position: relative;
+ .flip-container {
margin-top: 40vh;
}
.container-text {
z-index: 1;
left: 10vw;
}
.text-title {
margin-top: 0;
}
.phone-container {
left: 42vw;
top: 5vh;
}
&.flip-from-left {
.container-text {
left: 10vw;
top: 0;
}
.phone-container {
left: 10vw;
top: 10vh;
}
}
}
}
@media all and (max-width: 1023px) {
#main_title_container h2 {
@ -676,25 +459,3 @@ responsive land custom
/*margin-top: 0*/
}
}
@media all and (min-width: 1900px) {
#we_develop {
height: 150vh;
}
#main_title_container h2 {
margin-top: 0;
}
#china_achievements {
margin-top: 0;
padding: 1rem 172px 0;
}
#full_creative {
min-height: 100vh;
}
}