Skip to content

Commit 9f9619f

Browse files
jen67jen67
authored
Merge pull request #23 from jen67/newapp
added more functions
2 parents 83e37aa + 57bb50c commit 9f9619f

File tree

9 files changed

+120
-65
lines changed

9 files changed

+120
-65
lines changed

‎fylo-landing-page/dist/css/styles.css

Lines changed: 18 additions & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎fylo-landing-page/dist/css/styles.css.map

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎fylo-landing-page/images/arrow1.svg

Lines changed: 20 additions & 0 deletions
Loading

‎fylo-landing-page/index.html

Lines changed: 28 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@ <h1>Stay productive, wherever you are</h1>
6363
live collaboration. No email attachments required!
6464
</p>
6565

66-
<p class="arrow-link">See how Fylo works <img src="./images/icon-arrow.svg" alt="Arrow icon"></p>
66+
<p class="arrow-link">See how Fylo works <img src="./images/icon-arrow.svg" alt="Arrow icon"></p>
6767

6868
<div class="card">
6969
<img src="./images/icon-quotes.svg" alt="Image of quotes" class="quotes">
@@ -125,38 +125,34 @@ <h1>Get early access today</h1>
125125
</div>
126126
</div>
127127

128-
<div class="footer-images">
129-
130-
<div>
131-
<svg xmlns="http://www.w3.org/2000/svg" width="448" height="832" viewBox="0 0 896 1664">
132-
<path fill="#FFFFFF"
133-
d="M895 12v264H738q-86 0-116 36t-30 108v189h293l-39 296H592v759H286V905H31V609h255V391q0-186 104-288.5T667 0q147 0 228 12z" />
134-
</svg>
135-
</div>
136-
137-
138-
<div>
139-
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512" fill="white">
140-
<path
141-
d="M496,109.5a201.8,201.8,0,0,1-56.55,15.3,97.51,97.51,0,0,0,43.33-53.6,197.74,197.74,0,0,1-62.56,23.5A99.14,99.14,0,0,0,348.31,64c-54.42,0-98.46,43.4-98.46,96.9a93.21,93.21,0,0,0,2.54,22.1,280.7,280.7,0,0,1-203-101.3A95.69,95.69,0,0,0,36,130.4C36,164,53.53,193.7,80,211.1A97.5,97.5,0,0,1,35.22,199v1.2c0,47,34,86.1,79,95a100.76,100.76,0,0,1-25.94,3.4,94.38,94.38,0,0,1-18.51-1.8c12.51,38.5,48.92,66.5,92.05,67.3A199.59,199.59,0,0,1,39.5,405.6,203,203,0,0,1,16,404.2,278.68,278.68,0,0,0,166.74,448c181.36,0,280.44-147.7,280.44-275.8,0-4.2-.11-8.4-.31-12.5A198.48,198.48,0,0,0,496,109.5Z" />
142-
</svg>
143-
</div>
144-
145-
<div>
146-
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512">
147-
<rect width="100%" height="100%" fill="none" />
148-
<path
149-
d="M349.33,69.33a93.62,93.62,0,0,1,93.34,93.34V349.33a93.62,93.62,0,0,1-93.34,93.34H162.67a93.62,93.62,0,0,1-93.34-93.34V162.67a93.62,93.62,0,0,1,93.34-93.34H349.33m0-37.33H162.67C90.8,32,32,90.8,32,162.67V349.33C32,421.2,90.8,480,162.67,480H349.33C421.2,480,480,421.2,480,349.33V162.67C480,90.8,421.2,32,349.33,32Z"
150-
stroke="white" fill="white" stroke-width="10" />
151-
<path d="M377.33,162.67a28,28,0,1,1,28-28A27.94,27.94,0,0,1,377.33,162.67Z" stroke="white" fill="white"
152-
stroke-width="10" />
153-
<path
154-
d="M256,181.33A74.67,74.67,0,1,1,181.33,256,74.75,74.75,0,0,1,256,181.33M256,144A112,112,0,1,0,368,256,112,112,0,0,0,256,144Z"
155-
stroke="white" fill="white" stroke-width="10" />
156-
</svg>
157-
</div>
158-
128+
<div class="footer-images">
129+
<div class="svg-container">
130+
<svg xmlns="http://www.w3.org/2000/svg" width="448" height="832" viewBox="0 0 896 1664">
131+
<path
132+
d="M895 12v264H738q-86 0-116 36t-30 108v189h293l-39 296H592v759H286V905H31V609h255V391q0-186 104-288.5T667 0q147 0 228 12z" />
133+
</svg>
159134
</div>
135+
136+
<div class="svg-container">
137+
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512">
138+
<path
139+
d="M496,109.5a201.8,201.8,0,0,1-56.55,15.3,97.51,97.51,0,0,0,43.33-53.6,197.74,197.74,0,0,1-62.56,23.5A99.14,99.14,0,0,0,348.31,64c-54.42,0-98.46,43.4-98.46,96.9a93.21,93.21,0,0,0,2.54,22.1,280.7,280.7,0,0,1-203-101.3A95.69,95.69,0,0,0,36,130.4C36,164,53.53,193.7,80,211.1A97.5,97.5,0,0,1,35.22,199v1.2c0,47,34,86.1,79,95a100.76,100.76,0,0,1-25.94,3.4,94.38,94.38,0,0,1-18.51-1.8c12.51,38.5,48.92,66.5,92.05,67.3A199.59,199.59,0,0,1,39.5,405.6,203,203,0,0,1,16,404.2,278.68,278.68,0,0,0,166.74,448c181.36,0,280.44-147.7,280.44-275.8,0-4.2-.11-8.4-.31-12.5A198.48,198.48,0,0,0,496,109.5Z" />
140+
</svg>
141+
</div>
142+
143+
<div class="svg-container">
144+
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512">
145+
<rect width="100%" height="100%" fill="none" />
146+
<path
147+
d="M349.33,69.33a93.62,93.62,0,0,1,93.34,93.34V349.33a93.62,93.62,0,0,1-93.34,93.34H162.67a93.62,93.62,0,0,1-93.34-93.34V162.67a93.62,93.62,0,0,1,93.34-93.34H349.33m0-37.33H162.67C90.8,32,32,90.8,32,162.67V349.33C32,421.2,90.8,480,162.67,480H349.33C421.2,480,480,421.2,480,349.33V162.67C480,90.8,421.2,32,349.33,32Z"
148+
stroke="none" stroke-width="10" />
149+
<path d="M377.33,162.67a28,28,0,1,1,28-28A27.94,27.94,0,0,1,377.33,162.67Z" stroke="none" stroke-width="10" />
150+
<path
151+
d="M256,181.33A74.67,74.67,0,1,1,181.33,256,74.75,74.75,0,0,1,256,181.33M256,144A112,112,0,1,0,368,256,112,112,0,0,0,256,144Z"
152+
stroke="none" stroke-width="10" />
153+
</svg>
154+
</div>
155+
</div>
160156

161157
<p class="attribution">
162158
Challenge by <a href="https://www.frontendmentor.io?ref=challenge" target="_blank">Frontend Mentor</a>.

‎fylo-landing-page/src/scss/base/_variables.scss

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,3 +8,4 @@ $paragraph: hsl(249, 8%, 53%);
88
$Light-Gray: hsl(0, 0%, 75%);
99
$bg-color: hsl(250, 75%, 98%);
1010
$btn-hover: hsl(221, 100%, 71%);
11+
$arrow-link-hover: hsl(171, 60%, 83%);

‎fylo-landing-page/src/scss/components/_footer.scss/_contact.scss

Lines changed: 10 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -37,14 +37,10 @@ padding: 3rem 2rem;
3737
font-weight: 400;
3838
line-height: 1.5rem;
3939
letter-spacing: 0.05rem;
40-
}
41-
42-
4340

41+
42+
}
4443
}
45-
46-
47-
4844
}
4945

5046
.footer-links {
@@ -53,14 +49,18 @@ padding: 3rem 2rem;
5349
gap: 1rem;
5450
margin-top: 3rem;
5551
color: white;
52+
cursor: pointer;
53+
transition: color 0.4s ease-in-out;
5654

5755

5856
p{
5957
line-height: 1.6rem;
60-
font-size: 0.9rem;
58+
font-size: 0.9rem;
59+
&:hover {
60+
color: $Bright-Blue;
61+
62+
}
6163
}
62-
63-
6464
}
6565

6666

@@ -72,9 +72,6 @@ padding: 3rem 2rem;
7272
}
7373

7474
.attribution a {
75-
color:$paragraph;
75+
color:$paragraph;
7676
}
77-
78-
79-
8077
}

‎fylo-landing-page/src/scss/components/_footer.scss/_social-ions.scss

Lines changed: 16 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,8 +18,22 @@ footer{
1818
svg {
1919
width: 20px;
2020
height: 20px;
21-
fill: white;
21+
fill: white;
22+
2223
}
24+
25+
26+
27+
&:hover, svg:hover{
28+
fill: $Bright-Blue;
29+
border-color:$Bright-Blue;
30+
31+
}
32+
transition: border-color 0.4s ease-in-out,
33+
fill 0.2s ease-in-out;
34+
2335
}
36+
37+
2438
}
25-
}
39+
}

‎fylo-landing-page/src/scss/components/main.scss/_section2.scss

Lines changed: 24 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -34,24 +34,33 @@ main{
3434
color: $paragraph;
3535
}
3636

37-
.arrow-link {
38-
display: flex;
39-
align-items: center;
40-
justify-content: center;
41-
gap: 0.6rem;
42-
color: $Moderate-Cyan;
43-
border-bottom: 2px solid $Moderate-Cyan;
44-
width: 188px;
45-
margin: 2rem auto 3.5rem;
46-
img{
47-
width: 30px;
48-
}
49-
50-
}
37+
.arrow-link {
38+
display: flex;
39+
align-items: center;
40+
justify-content: center;
41+
gap: 0.6rem;
42+
color: $Moderate-Cyan;
43+
border-bottom: 2px solid $Moderate-Cyan;
44+
width: 187px;
45+
margin: 2rem auto 3.5rem;
46+
47+
img {
48+
width: 30px;
49+
}
50+
51+
&:hover {
52+
color: $arrow-link-hover;
53+
border-bottom: 2px solid $arrow-link-hover;
54+
55+
img:hover {
56+
content: url(/images/arrow1.svg);
57+
}
58+
}
59+
}
5160

5261

5362
.card{
54-
margin: 3rem auto;
63+
margin: 3rem auto;
5564
background-color: white;
5665
padding: 2rem 1rem;
5766
display: flex;

‎fylo-landing-page/src/scss/styles.scss

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,4 +7,5 @@
77
@import './components/main.scss/section2';
88
@import './components/main.scss/section3';
99
@import './components/_footer.scss/contact';
10-
@import './components/_footer.scss/social-ions';
10+
@import './components/_footer.scss/social-ions';
11+
@import './ultilities/responsive';

0 commit comments

Comments
 (0)