├── preview.png ├── assets ├── img │ ├── favicon.png │ ├── about-perfil.png │ ├── home-perfil.png │ ├── projects-1.png │ ├── projects-2.png │ ├── projects-3.png │ ├── projects-4.png │ ├── projects-5.png │ ├── testimonial-1.png │ ├── testimonial-2.png │ ├── testimonial-3.png │ └── testimonial-4.png ├── pdf │ └── Anid-Cv.pdf ├── js │ ├── main.js │ ├── scrollreveal.min.js │ └── swiper-bundle.min.js └── css │ ├── styles.css │ └── swiper-bundle.min.css ├── README.md ├── index.html └── Text Responsive portfolio Anid.txt /preview.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bedimcode/responsive-portfolio-website-Anid/HEAD/preview.png -------------------------------------------------------------------------------- /assets/img/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bedimcode/responsive-portfolio-website-Anid/HEAD/assets/img/favicon.png -------------------------------------------------------------------------------- /assets/pdf/Anid-Cv.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bedimcode/responsive-portfolio-website-Anid/HEAD/assets/pdf/Anid-Cv.pdf -------------------------------------------------------------------------------- /assets/img/about-perfil.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bedimcode/responsive-portfolio-website-Anid/HEAD/assets/img/about-perfil.png -------------------------------------------------------------------------------- /assets/img/home-perfil.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bedimcode/responsive-portfolio-website-Anid/HEAD/assets/img/home-perfil.png -------------------------------------------------------------------------------- /assets/img/projects-1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bedimcode/responsive-portfolio-website-Anid/HEAD/assets/img/projects-1.png -------------------------------------------------------------------------------- /assets/img/projects-2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bedimcode/responsive-portfolio-website-Anid/HEAD/assets/img/projects-2.png -------------------------------------------------------------------------------- /assets/img/projects-3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bedimcode/responsive-portfolio-website-Anid/HEAD/assets/img/projects-3.png -------------------------------------------------------------------------------- /assets/img/projects-4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bedimcode/responsive-portfolio-website-Anid/HEAD/assets/img/projects-4.png -------------------------------------------------------------------------------- /assets/img/projects-5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bedimcode/responsive-portfolio-website-Anid/HEAD/assets/img/projects-5.png -------------------------------------------------------------------------------- /assets/img/testimonial-1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bedimcode/responsive-portfolio-website-Anid/HEAD/assets/img/testimonial-1.png -------------------------------------------------------------------------------- /assets/img/testimonial-2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bedimcode/responsive-portfolio-website-Anid/HEAD/assets/img/testimonial-2.png -------------------------------------------------------------------------------- /assets/img/testimonial-3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bedimcode/responsive-portfolio-website-Anid/HEAD/assets/img/testimonial-3.png -------------------------------------------------------------------------------- /assets/img/testimonial-4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bedimcode/responsive-portfolio-website-Anid/HEAD/assets/img/testimonial-4.png -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Responsive Portfolio Website Anid 2 | ## [Watch it on youtube](https://youtu.be/qxxanKFR7js) 3 | ### Responsive Portfolio Website Anid 4 | 5 | - Responsive Portfolio Website Using HTML CSS And JavaScript 6 | - Contains animations when scrolling. 7 | - Smooth scrolling in each section. 8 | - Contains a beautiful dark theme. 9 | - The color of the project can be customized. 10 | - Custom cursor & animated shapes. 11 | - Slide-out projects, tabbed sections, & a copy email button. 12 | - Developed first with the Mobile First methodology, then for desktop. 13 | - Compatible with all mobile devices and with a beautiful and pleasant user interface. 14 | 15 | 💙 Join the channel to see more videos like this. [Bedimcode](https://www.youtube.com/@Bedimcode) 16 | 17 |  18 | -------------------------------------------------------------------------------- /assets/js/main.js: -------------------------------------------------------------------------------- 1 | /*=============== HOME SPLIT TEXT ===============*/ 2 | 3 | 4 | /*=============== SWIPER PROJECTS ===============*/ 5 | 6 | 7 | /*=============== WORK TABS ===============*/ 8 | 9 | 10 | /*=============== SERVICES ACCORDION ===============*/ 11 | 12 | 13 | /*=============== TESTIMONIALS OF DUPLICATE CARDS ===============*/ 14 | 15 | 16 | /*=============== COPY EMAIL IN CONTACT ===============*/ 17 | 18 | 19 | /*=============== CURRENT YEAR OF THE FOOTER ===============*/ 20 | 21 | 22 | /*=============== SCROLL SECTIONS ACTIVE LINK ===============*/ 23 | 24 | 25 | /*=============== CUSTOM CURSOR ===============*/ 26 | 27 | 28 | /* Hide custom cursor on links */ 29 | 30 | 31 | /*=============== SCROLL REVEAL ANIMATION ===============*/ 32 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 |
4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 |1&&m.push(e.virtualSize-r)}if(o&&s.loop){const t=g[0]+x;if(s.slidesPerGroup>1){const a=Math.ceil((e.virtual.slidesBefore+e.virtual.slidesAfter)/s.slidesPerGroup),i=t*s.slidesPerGroup;for(let e=0;e!(s.cssMode&&!s.loop)||t!==c.length-1)).forEach((e=>{e.style[t]=`${x}px`}))}if(s.centeredSlides&&s.centeredSlidesBounds){let e=0;g.forEach((t=>{e+=t+(x||0)})),e-=x;const t=e>r?e-r:0;m=m.map((e=>e<=0?-v:e>t?t+w:e))}if(s.centerInsufficientSlides){let e=0;g.forEach((t=>{e+=t+(x||0)})),e-=x;const t=(s.slidesOffsetBefore||0)+(s.slidesOffsetAfter||0);if(e+t 0?(r._cssModeVirtualInitialSet=!0,requestAnimationFrame((()=>{h[e?"scrollLeft":"scrollTop"]=s}))):h[e?"scrollLeft":"scrollTop"]=s,y&&requestAnimationFrame((()=>{r.wrapperEl.style.scrollSnapType="",r._immediateVirtual=!1}));else{if(!r.support.smoothScroll)return m({swiper:r,targetPosition:s,side:e?"left":"top"}),!0;h.scrollTo({[e?"left":"top"]:s,behavior:"smooth"})}return!0}const E=$().isSafari;return y&&!i&&E&&r.isElement&&r.virtual.update(!1,!1,n),r.setTransition(t),r.setTranslate(w),r.updateActiveIndex(n),r.updateSlidesClasses(),r.emit("beforeTransitionStart",t,a),r.transitionStart(s,b),0===t?r.transitionEnd(s,b):r.animating||(r.animating=!0,r.onSlideToWrapperTransitionEnd||(r.onSlideToWrapperTransitionEnd=function(e){r&&!r.destroyed&&e.target===this&&(r.wrapperEl.removeEventListener("transitionend",r.onSlideToWrapperTransitionEnd),r.onSlideToWrapperTransitionEnd=null,delete r.onSlideToWrapperTransitionEnd,r.transitionEnd(s,b))}),r.wrapperEl.addEventListener("transitionend",r.onSlideToWrapperTransitionEnd)),!0},slideToLoop:function(e,t,s,a){if(void 0===e&&(e=0),void 0===s&&(s=!0),"string"==typeof e){e=parseInt(e,10)}const i=this;if(i.destroyed)return;void 0===t&&(t=i.params.speed);const r=i.grid&&i.params.grid&&i.params.grid.rows>1;let n=e;if(i.params.loop)if(i.virtual&&i.params.virtual.enabled)n+=i.virtual.slidesBefore;else{let e;if(r){const t=n*i.params.grid.rows;e=i.slides.find((e=>1*e.getAttribute("data-swiper-slide-index")===t)).column}else e=i.getSlideIndexByData(n);const t=r?Math.ceil(i.slides.length/i.params.grid.rows):i.slides.length,{centeredSlides:s}=i.params;let l=i.params.slidesPerView;"auto"===l?l=i.slidesPerViewDynamic():(l=Math.ceil(parseFloat(i.params.slidesPerView,10)),s&&l%2==0&&(l+=1));let o=t-e1){const e=[];return n.querySelectorAll(t.el).forEach((s=>{const a=p({},t,{el:s});e.push(new re(a))})),e}const l=this;l.__swiper__=!0,l.support=z(),l.device=A({userAgent:t.userAgent}),l.browser=$(),l.eventsListeners={},l.eventsAnyListeners=[],l.modules=[...l.__modules__],t.modules&&Array.isArray(t.modules)&&l.modules.push(...t.modules);const o={};l.modules.forEach((e=>{e({params:t,swiper:l,extendParams:se(t,o),on:l.on.bind(l),once:l.once.bind(l),off:l.off.bind(l),emit:l.emit.bind(l)})}));const d=p({},te,o);return l.params=p({},d,ie,t),l.originalParams=p({},l.params),l.passedParams=p({},t),l.params&&l.params.on&&Object.keys(l.params.on).forEach((e=>{l.on(e,l.params.on[e])})),l.params&&l.params.onAny&&l.onAny(l.params.onAny),Object.assign(l,{enabled:l.params.enabled,el:e,classNames:[],slides:[],slidesGrid:[],snapGrid:[],slidesSizesGrid:[],isHorizontal:()=>"horizontal"===l.params.direction,isVertical:()=>"vertical"===l.params.direction,activeIndex:0,realIndex:0,isBeginning:!0,isEnd:!1,translate:0,previousTranslate:0,progress:0,velocity:0,animating:!1,cssOverflowAdjustment(){return Math.trunc(this.translate/2**23)*2**23},allowSlideNext:l.params.allowSlideNext,allowSlidePrev:l.params.allowSlidePrev,touchEventsData:{isTouched:void 0,isMoved:void 0,allowTouchCallbacks:void 0,touchStartTime:void 0,isScrolling:void 0,currentTranslate:void 0,startTranslate:void 0,allowThresholdMove:void 0,focusableElements:l.params.focusableElements,lastClickTime:0,clickTimeout:void 0,velocities:[],allowMomentumBounce:void 0,startMoving:void 0,pointerId:null,touchId:null},allowClick:!0,allowTouchMove:l.params.allowTouchMove,touches:{startX:0,startY:0,currentX:0,currentY:0,diff:0},imagesToLoad:[],imagesLoaded:0}),l.emit("_swiper"),l.params.init&&l.init(),l}getDirectionLabel(e){return this.isHorizontal()?e:{width:"height","margin-top":"margin-left","margin-bottom ":"margin-right","margin-left":"margin-top","margin-right":"margin-bottom","padding-left":"padding-top","padding-right":"padding-bottom",marginRight:"marginBottom"}[e]}getSlideIndex(e){const{slidesEl:t,params:s}=this,a=y(f(t,`.${s.slideClass}, swiper-slide`)[0]);return y(e)-a}getSlideIndexByData(e){return this.getSlideIndex(this.slides.find((t=>1*t.getAttribute("data-swiper-slide-index")===e)))}getSlideIndexWhenGrid(e){return this.grid&&this.params.grid&&this.params.grid.rows>1&&("column"===this.params.grid.fill?e=Math.floor(e/this.params.grid.rows):"row"===this.params.grid.fill&&(e%=Math.ceil(this.slides.length/this.params.grid.rows))),e}recalcSlides(){const{slidesEl:e,params:t}=this;this.slides=f(e,`.${t.slideClass}, swiper-slide`)}enable(){const e=this;e.enabled||(e.enabled=!0,e.params.grabCursor&&e.setGrabCursor(),e.emit("enable"))}disable(){const e=this;e.enabled&&(e.enabled=!1,e.params.grabCursor&&e.unsetGrabCursor(),e.emit("disable"))}setProgress(e,t){const s=this;e=Math.min(Math.max(e,0),1);const a=s.minTranslate(),i=(s.maxTranslate()-a)*e+a;s.translateTo(i,void 0===t?0:t),s.updateActiveIndex(),s.updateSlidesClasses()}emitContainerClasses(){const e=this;if(!e.params._emitClasses||!e.el)return;const t=e.el.className.split(" ").filter((t=>0===t.indexOf("swiper")||0===t.indexOf(e.params.containerModifierClass)));e.emit("_containerClasses",t.join(" "))}getSlideClasses(e){const t=this;return t.destroyed?"":e.className.split(" ").filter((e=>0===e.indexOf("swiper-slide")||0===e.indexOf(t.params.slideClass))).join(" ")}emitSlidesClasses(){const e=this;if(!e.params._emitClasses||!e.el)return;const t=[];e.slides.forEach((s=>{const a=e.getSlideClasses(s);t.push({slideEl:s,classNames:a}),e.emit("_slideClass",s,a)})),e.emit("_slideClasses",t)}slidesPerViewDynamic(e,t){void 0===e&&(e="current"),void 0===t&&(t=!1);const{params:s,slides:a,slidesGrid:i,slidesSizesGrid:r,size:n,activeIndex:l}=this;let o=1;if("number"==typeof s.slidesPerView)return s.slidesPerView;if(s.centeredSlides){let e,t=a[l]?Math.ceil(a[l].swiperSlideSize):0;for(let s=l+1;sT){const t=I(e);s.slides.filter((e=>e.matches(`.${s.params.slideClass}[data-swiper-slide-index="${t}"], swiper-slide[data-swiper-slide-index="${t}"]`))).forEach((e=>{e.remove()}))}const z=o?-g.length:0,A=o?2*g.length:g.length;for(let t=z;t=S&&t<=T){const s=I(t);void 0===h||e?L.push(s):(t>h&&L.push(s),tC&&(u=C),m