Skip to content

Commit

Permalink
Merge remote-tracking branch 'origin/master' into animations
Browse files Browse the repository at this point in the history 
# Conflicts:
#	src/pages/index.jsx
#	src/styles/blocks/button.scss
#	src/styles/blocks/intro.scss
  • Loading branch information
@dergachevm
dergachevm committed Oct 1, 2024
2 parents 216d5b7 + 0d4a7cb commit 603db23
Show file tree
Hide file tree
Showing 23 changed files with 540 additions and 270 deletions.
Binary file added public/assets/images/intro-video-mob.mp4
View file
Binary file not shown.
Binary file added public/assets/images/intro-video.mp4
View file
Binary file not shown.
Binary file removed public/assets/images/process/00.jpg
View file
Binary file not shown.
Binary file modified public/assets/images/process/00.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/assets/images/process/01.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file removed public/assets/images/process/02.jpg
View file
Binary file not shown.
Binary file modified public/assets/images/process/02.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file removed public/assets/images/process/04.jpg
View file
Binary file not shown.
Binary file modified public/assets/images/process/04.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
12 changes: 6 additions & 6 deletions src/components/Footer.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@ const Footer = ({}) => {
</div>
</div>

<div class="form__field">
<div class="form__field form__field--controls">
<button class="form__button button" type='submit'><span>Subscribe</span></button>
</div>
</div>
Expand All @@ -63,23 +63,23 @@ const Footer = ({}) => {
<div class="footer__socials">
<div class="socials">
<a href="" class="socials__link" target="_blank">
<svg class="svg-icon" viewBox="0 0 40 40" width="40" height="40" style="width: 40rem; height: 40rem;"><use xlink:href="#svg-x"></use></svg>
<svg class="svg-icon" viewBox="0 0 40 40" width="40" height="40"><use xlink:href="#svg-x"></use></svg>
</a>

<a href="" class="socials__link" target="_blank">
<svg class="svg-icon" viewBox="0 0 40 40" width="40" height="40" style="width: 40rem; height: 40rem;"><use xlink:href="#svg-discord"></use></svg>
<svg class="svg-icon" viewBox="0 0 40 40" width="40" height="40"><use xlink:href="#svg-discord"></use></svg>
</a>

<a href="" class="socials__link" target="_blank">
<svg class="svg-icon" viewBox="0 0 40 40" width="40" height="40" style="width: 40rem; height: 40rem;"><use xlink:href="#svg-instagram"></use></svg>
<svg class="svg-icon" viewBox="0 0 40 40" width="40" height="40"><use xlink:href="#svg-instagram"></use></svg>
</a>

<a href="" class="socials__link" target="_blank">
<svg class="svg-icon" viewBox="0 0 40 40" width="40" height="40" style="width: 40rem; height: 40rem;"><use xlink:href="#svg-tiktok"></use></svg>
<svg class="svg-icon" viewBox="0 0 40 40" width="40" height="40"><use xlink:href="#svg-tiktok"></use></svg>
</a>

<a href="" class="socials__link" target="_blank">
<svg class="svg-icon" viewBox="0 0 40 40" width="40" height="40" style="width: 40rem; height: 40rem;"><use xlink:href="#svg-arch"></use></svg>
<svg class="svg-icon" viewBox="0 0 40 40" width="40" height="40"><use xlink:href="#svg-arch"></use></svg>
</a>
</div>
</div>
Expand Down
263 changes: 116 additions & 147 deletions src/pages/index.jsx
View file

Large diffs are not rendered by default.

121 changes: 87 additions & 34 deletions src/styles/blocks/about.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,11 @@
}

&__block {
position: relative;
margin-top: 100rem;
display: flex;
flex-flow: row wrap;
gap: 32rem;

&:first-child {
margin-top: 0;
Expand All @@ -27,29 +31,21 @@
justify-content: center;
}

&__col {
&--img {
position: absolute;
top: 0;
right: 0;
&__image {
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 0;

img {
margin-left: auto;
}
}
}
}

&:nth-of-type(2n) {
.about {
&__row {
flex-direction: row-reverse;
}

&__col {
&--img {
@include grid-offset-right(1,12);
@include grid-offset-left(0,12);
}
}

&__main {
text-align: right;
align-items: flex-end;
Expand All @@ -58,29 +54,22 @@
}
}

&__row {
@include grid-row();
position: relative;
&__title {
margin-bottom: 100rem;
width: 100%;
}

&__col {
@include grid-col(6,12);

&--title {
@include grid-offset-right(6,12);
}
&__image {
width: calc(50% - var(--grid-gap));

&--img {
@include grid-col(5,12);
@include grid-offset-left(1,12);
img {
width: 100%;
max-width: 659rem;
}
}

&__title {
margin-bottom: 100rem;
}

&__main {
width: calc(50% - var(--grid-gap));
display: flex;
flex-direction: column;
gap: 48rem;
Expand Down Expand Up @@ -108,11 +97,75 @@
width: 100%;
}
}

}

@media only screen and (max-width: $small) {
.about {
&__wrap {}
&__wrap {
padding: 64rem 0;
}

&__title {
margin-bottom: 0;
text-align: center;
}

&__block {
margin-top: 64rem;

&:first-child {
.about {
&__image {
position: static;
transform: translateY(0);
}

&__logo {
width: 200rem;
height: auto;
}
}
}

&:nth-of-type(2n) {
.about {
&__main {
text-align: left;
align-items: flex-start;
}
}
}
}

&__image {
width: 100%;

img {
margin: 0 auto;
}
}

&__main {
width: 100%;
gap: 32rem;
}

&__logo {
margin: 0 auto;
}
}

.about-partners {
&__list {
justify-content: flex-start;
}
}
}

@media only screen and (max-width: $xsmall) {
.about-partners {
&__item {
flex-basis: calc(50% - 12rem);
}
}
}
66 changes: 63 additions & 3 deletions src/styles/blocks/button.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,12 +18,12 @@
background-color: $violet;
padding: 12rem 20rem;
border-radius: 30rem;
transition: opacity .3s, color .3s, background-color .3s;
@include body-m();
transition: opacity .3s;
// transition: opacity .3s;
}

.button-play {
overflow: hidden;
position: relative;
display: flex;
align-items: center;
Expand Down Expand Up @@ -85,13 +85,51 @@
background-color: #2C2B5D;
border-radius: 50%;
transition: background-color .3s;
/* transition: color .3s;
&::before,
&::after {
content: '';
display: block;
background-color: $yellow;
position: absolute;
top: 50%;
left: 50%;
width: 100%;
height: 100%;
transform: translate(-50%, -50%);
border-radius: 50%;
z-index: 1;
opacity: 0;
transition: opacity .3s;
}
&::before {
filter: blur(50rem);
-webkit-filter: blur(50rem);
}
.svg-icon {
position: relative;
z-index: 2;
&--icon {
width: 105rem;
height: 43rem;
}
&--text {
width: 101rem;
height: 38rem;
} */
}
}

@media only screen and (hover: hover) {
.button {
&:hover {
opacity: .7;
color: $violet;
background-color: $yellow;
}
}

Expand All @@ -103,11 +141,33 @@

&::before {
animation-play-state: running;
/*
color: $violet;
&::before,
&::after {
opacity: 1;
*/
}
}
}
}

@media only screen and (max-width: $small) {
.button-play {
min-width: 179rem;
padding: 54rem 51rem;

.svg-icon {
&--icon {
width: 72rem;
height: auto;
}

&--text {
width: 68rem;
height: auto;
}
}
}
}
47 changes: 43 additions & 4 deletions src/styles/blocks/footer.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,14 +52,13 @@

&__link {
display: inline-block;
@include body-m();
font-weight: 700;
transition: opacity .3s;
@include body-m();
}

&__socials {
display: flex;
justify-content: flex-end;
text-align: right;

.socials {
flex-wrap: wrap;
Expand All @@ -78,5 +77,45 @@
}

@media only screen and (max-width: $small) {
.footer {}
.footer {
&__wrap {
padding: 48rem 0;
}

&__col {
margin-top: 48rem;
@include grid-col(12,12);

&:first-child {
margin-top: 0;
}
}

&__logos {
flex-direction: row;
justify-content: space-between;
}

&__logo {
.svg-icon {
width: 120rem;
height: auto;
}

span {
font-size: 14rem;
}
}

&__item {
margin-top: 32rem;
}

&__socials {
.socials {
width: 100%;
justify-content: space-between;
}
}
}
}
Loading

0 comments on commit 603db23

Please sign in to comment.