File tree Expand file tree Collapse file tree 24 files changed +47
-47
lines changed
026-double vertical slider
038-mobile tab navigation
047-testimonial box switcher
056-image comparison slider
078-speak number guessing game
079-creative agency website Expand file tree Collapse file tree 24 files changed +47
-47
lines changed Original file line number Diff line number Diff line change @@ -44,7 +44,7 @@ <h1>Amazing Article</h1>
4444 </ p >
4545 < h2 > My Subtitle</ h2 >
4646 < img
47- src ="https://images.unsplash.com/photo-1610308354580-0108c064a578?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1& auto=format&fit=crop&w=2100&q=80 "
47+ src ="https://images.unsplash.com/photo-1610308354580-0108c064a578?auto=format&fit=crop&w=2100&q=80 "
4848 />
4949 < p >
5050 Lorem ipsum dolor sit, amet consectetur adipisicing elit. Corrupti
Original file line number Diff line number Diff line change 1616
1717.bg {
1818 /* Use a Different Background Image */
19- background : url ("https://images.unsplash.com/photo-1734779336398-167995aeaf1c?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1& auto=format&fit=crop&w=2100&q=80" )
19+ background : url ("https://images.unsplash.com/photo-1734779336398-167995aeaf1c?auto=format&fit=crop&w=2100&q=80" )
2020 no-repeat center center / cover;
2121 position : absolute;
2222 top : -30px ;
Original file line number Diff line number Diff line change 8080.split .left {
8181 left : 0 ;
8282 /* Use New Background Images */
83- background : url ("https://images.unsplash.com/photo-1542914119-8da84e777eb4?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D& auto=format&fit=crop&w=1762&q=80" )
83+ background : url ("https://images.unsplash.com/photo-1542914119-8da84e777eb4?auto=format&fit=crop&w=1762&q=80" )
8484 no-repeat center / cover;
8585}
8686
9595.split .right {
9696 right : 0 ;
9797 /* Use New Background Images */
98- background : url ("https://images.unsplash.com/photo-1464822759023-fed622ff2c3b?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1& auto=format&fit=crop&w=1350&q=80" )
98+ background : url ("https://images.unsplash.com/photo-1464822759023-fed622ff2c3b?auto=format&fit=crop&w=1350&q=80" )
9999 no-repeat center / cover;
100100}
101101
Original file line number Diff line number Diff line change 1717 < div
1818 class ="slide active "
1919 style ="
20- background-image: url('https://images.unsplash.com/photo-1610620746460-de78cf3d1705?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1& auto=format&fit=crop&w=2100&q=80');
20+ background-image: url('https://images.unsplash.com/photo-1610620746460-de78cf3d1705?auto=format&fit=crop&w=2100&q=80');
2121 "
2222 > </ div >
2323 < div
2424 class ="slide "
2525 style ="
26- background-image: url('https://images.unsplash.com/photo-1609589079958-8192b9cdab91?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D& auto=format&fit=crop&w=2100&q=80');
26+ background-image: url('https://images.unsplash.com/photo-1609589079958-8192b9cdab91?auto=format&fit=crop&w=2100&q=80');
2727 "
2828 > </ div >
2929 < div
3030 class ="slide "
3131 style ="
32- background-image: url('https://images.unsplash.com/photo-1605718665998-85fbd49c5eff?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D& auto=format&fit=crop&w=2100&q=80');
32+ background-image: url('https://images.unsplash.com/photo-1605718665998-85fbd49c5eff?auto=format&fit=crop&w=2100&q=80');
3333 "
3434 > </ div >
3535 < div
3636 class ="slide "
3737 style ="
38- background-image: url('https://images.unsplash.com/photo-1609589079852-0b1c745a71ec?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1& auto=format&fit=crop&w=2100&q=80');
38+ background-image: url('https://images.unsplash.com/photo-1609589079852-0b1c745a71ec?auto=format&fit=crop&w=2100&q=80');
3939 "
4040 > </ div >
4141 < div
4242 class ="slide "
4343 style ="
44- background-image: url('https://images.unsplash.com/photo-1604916010805-18ea15fa6d32?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1& auto=format&fit=crop&w=2100&q=80');
44+ background-image: url('https://images.unsplash.com/photo-1604916010805-18ea15fa6d32?auto=format&fit=crop&w=2100&q=80');
4545 "
4646 > </ div >
4747 <!-- Add Another Slide -->
4848 < div
4949 class ="slide "
5050 style ="
51- background-image: url('https://images.unsplash.com/photo-1501785888041-af3ef285b470?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1& auto=format&fit=crop&w=2100&q=80');
51+ background-image: url('https://images.unsplash.com/photo-1501785888041-af3ef285b470?auto=format&fit=crop&w=2100&q=80');
5252 "
5353 > </ div >
5454 < button class ="arrow left-arrow " id ="left ">
Original file line number Diff line number Diff line change 2222
2323.fill {
2424 /* Change the Draggable Image */
25- background-image : url ("https://images.unsplash.com/photo-1484723091739-30a097e8f929?w=150&dpr=1&h=150&auto=format&fit=crop&q=60&ixid=M3wxMjA3fDB8MXxhbGx8fHx8fHx8fHwxNzUwODUzMzI4fA&ixlib=rb-4.1.0 " );
25+ background-image : url ("https://images.unsplash.com/photo-1484723091739-30a097e8f929?w=150&dpr=1&h=150&auto=format&fit=crop&q=60" );
2626 height : 145px ;
2727 width : 145px ;
2828 cursor : pointer;
Original file line number Diff line number Diff line change @@ -26,7 +26,7 @@ const animated_bg_texts = document.querySelectorAll(".animated-bg-text");
2626// // Change the "Loaded" Content
2727// const getData = () => {
2828// header.innerHTML =
29- // '<img src="https://images.unsplash.com/photo-1522542550221-31fd19575a2d?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1& auto=format&fit=crop&w=750&q=80" alt="" />';
29+ // '<img src="https://images.unsplash.com/photo-1522542550221-31fd19575a2d?auto=format&fit=crop&w=750&q=80" alt="" />';
3030// title.innerHTML = "The Future of Web Development";
3131// excerpt.innerHTML =
3232// "Exploring emerging technologies and trends that will shape how we build websites";
Original file line number Diff line number Diff line change 7373}
7474
7575.hero {
76- background-image : url ("https://images.unsplash.com/photo-1554744512-d6c603f27c54?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1& auto=format&fit=crop&w=1200&q=80" );
76+ background-image : url ("https://images.unsplash.com/photo-1554744512-d6c603f27c54?auto=format&fit=crop&w=1200&q=80" );
7777 background-repeat : no-repeat;
7878 background-size : cover;
7979 background-position : bottom center;
Original file line number Diff line number Diff line change @@ -36,22 +36,22 @@ <h1>Sydney</h1>
3636 < div class ="right-slide ">
3737 < div
3838 style ="
39- background-image: url('https://images.unsplash.com/photo-1528072164453-f4e8ef0d475a?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D& auto=format&fit=crop&w=1350&q=80');
39+ background-image: url('https://images.unsplash.com/photo-1528072164453-f4e8ef0d475a?auto=format&fit=crop&w=1350&q=80');
4040 "
4141 > </ div >
4242 < div
4343 style ="
44- background-image: url('https://images.unsplash.com/photo-1540959733332-eab4deabeeaf?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1& auto=format&fit=crop&w=1050&q=80');
44+ background-image: url('https://images.unsplash.com/photo-1540959733332-eab4deabeeaf?auto=format&fit=crop&w=1050&q=80');
4545 "
4646 > </ div >
4747 < div
4848 style ="
49- background-image: url('https://images.unsplash.com/photo-1485871981521-5b1fd3805eee?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D& auto=format&fit=crop&w=1350&q=80');
49+ background-image: url('https://images.unsplash.com/photo-1485871981521-5b1fd3805eee?auto=format&fit=crop&w=1350&q=80');
5050 "
5151 > </ div >
5252 < div
5353 style ="
54- background-image: url('https://images.unsplash.com/photo-1502602898657-3e91760cbb34?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1& auto=format&fit=crop&w=1350&q=80');
54+ background-image: url('https://images.unsplash.com/photo-1502602898657-3e91760cbb34?auto=format&fit=crop&w=1350&q=80');
5555 "
5656 > </ div >
5757 </ div >
Original file line number Diff line number Diff line change @@ -40,7 +40,7 @@ small {
4040.loveMe {
4141 height : 440px ;
4242 width : 300px ;
43- background : url ("https://images.unsplash.com/photo-1597540103960-2a6528f09ae9?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1& auto=format&fit=crop&w=321&q=80" )
43+ background : url ("https://images.unsplash.com/photo-1597540103960-2a6528f09ae9?auto=format&fit=crop&w=321&q=80" )
4444 no-repeat center center/cover;
4545 margin : auto;
4646 cursor : pointer;
Original file line number Diff line number Diff line change 1010 < div class ="carousel ">
1111 < div class ="image-container " id ="images ">
1212 < img
13- src ="https://images.unsplash.com/photo-1611072566310-7b7bfeca4582?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1& auto=format&fit=crop&w=752&q=80 "
13+ src ="https://images.unsplash.com/photo-1611072566310-7b7bfeca4582?auto=format&fit=crop&w=752&q=80 "
1414 alt ="first-image "
1515 />
1616 < img
17- src ="https://images.unsplash.com/photo-1611072488486-0cae417b73e4?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1& auto=format&fit=crop&w=752&q=80 "
17+ src ="https://images.unsplash.com/photo-1611072488486-0cae417b73e4?auto=format&fit=crop&w=752&q=80 "
1818 alt ="second-image "
1919 />
2020 < img
21- src ="https://images.unsplash.com/photo-1611072652569-bffa64d83763?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1& auto=format&fit=crop&w=752&q=80 "
21+ src ="https://images.unsplash.com/photo-1611072652569-bffa64d83763?auto=format&fit=crop&w=752&q=80 "
2222 alt ="third-image "
2323 />
2424 < img
25- src ="https://images.unsplash.com/photo-1611072652955-5705ec8f91eb?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1& auto=format&fit=crop&w=752&q=80 "
25+ src ="https://images.unsplash.com/photo-1611072652955-5705ec8f91eb?auto=format&fit=crop&w=752&q=80 "
2626 alt ="fourth-image "
2727 />
2828 </ div >
You can’t perform that action at this time.
0 commit comments