diff --git a/assets/css/santosh-magar.css b/assets/css/santosh-magar.css index f9260f8..a06a3e9 100644 --- a/assets/css/santosh-magar.css +++ b/assets/css/santosh-magar.css @@ -16,6 +16,12 @@ li { list-style: none; } +img, +video { + max-width: 100%; + height: auto; +} + .header-combine { display: flex; padding: 10px 0; @@ -272,7 +278,7 @@ a { /* ---------------- section :: about content - ----------------*/ #about { - background-color: #B4C1D0; + background-color: #f3f9ed; } div.about-head:nth-child(2) { @@ -569,7 +575,7 @@ div.about-head:nth-child(2) { font-weight: bold; font-family: 'Playfair Display', serif; line-height: 1.2; - color: #3298DB; + color: #2f2f2f; } #portfolio .details h5 { @@ -580,42 +586,51 @@ div.about-head:nth-child(2) { .portfolio-list { display: flex; + justify-content: space-between; flex-direction: row; flex-wrap: wrap; - gap: 30px; + gap: 24px; margin-top: 24px; margin-bottom: 24px; } .portfolio-item { display: flex; + justify-content: space-between; + flex-wrap: wrap; flex-direction: column; - flex: 0 0 22%; + flex: 0 1 calc(25% - 24px); background-color: white; border-radius: 7px; overflow: hidden; box-shadow: 0 0 6px 6px rgb(171 171 171 / 15%); } -.portfolio-item:hover{ + +.portfolio-item:hover { box-shadow: 0 0 12px 12px rgb(72 72 72 / 15%); } .portfolio-item-thumb { - height: 130px; cursor: pointer; position: relative; + height: 160px; + overflow: hidden; } .portfolio-item-thumb img { height: 100%; + width: 100%; object-fit: cover; + object-position: center; } -.overlay{ - position: absolute; + +.overlay { + position: absolute; background: rgba(0, 0, 0, 0.5); - width: 100%; - height: 100%; + width: 100%; + height: 100%; } + .portfolio-thumb-overlay { position: absolute; bottom: 0; @@ -640,7 +655,7 @@ div.about-head:nth-child(2) { } .portfolio-item-title { - margin: auto; + margin: 0 auto; padding: 16px 0; } @@ -651,7 +666,66 @@ div.about-head:nth-child(2) { padding: 20px 0; } +.portfolio-item-detail { + position: fixed; + background: rgba(0, 0, 0, 0.5); + top: 0; + left: 0; + width: 100%; + height: 100%; + z-index: 99; +} + +.portfolio-item-detail .container { + max-width: 750px; + overflow: hidden; +} + +.portfolio-item-detail .detail { + background-color: whitesmoke; + display: flex; + justify-content: center; + flex-direction: column; + margin: auto; + margin-top: 100px; + padding: 24px; +} + +.portfolio-item-detail .close { + cursor: pointer; + color: white; + opacity: 1; + margin-top: 70px; +} + +.portfolio-detail-title a { + text-decoration: none; + font-weight: 600; + font-size: 18px; + color: #303030; +} + +.portfolio-detail-content { + margin-top: 12px; +} + +@media screen and (max-width: 990px) { + .portfolio-item { + flex: 0 1 calc(33% - 24px); + } +} + +@media screen and (max-width: 765px) { + .portfolio-item { + flex: 0 1 calc(50% - 24px); + } +} +@media screen and (max-width: 500px) { + .portfolio-item { + flex: 0 1 calc(100% - 24px); + } +} /*---------------- section :: contact content ----------------------- */ @@ -760,15 +834,15 @@ div.about-head:nth-child(2) { font-size: 20px; } -.info_hide { +.hide { display: none; } -.email_addr>.ri-error-warning-line:hover+.info_hide { +.email_addr>.ri-error-warning-line:hover+.hide { display: block; } -.phone_addr>.ri-error-warning-line:hover+.info_hide { +.phone_addr>.ri-error-warning-line:hover+.hide { display: block; } diff --git a/assets/images/portfolio/osc.png b/assets/images/portfolio/osc.png new file mode 100644 index 0000000..ab83786 Binary files /dev/null and b/assets/images/portfolio/osc.png differ diff --git a/assets/js/santosh-magar-js.js b/assets/js/santosh-magar-js.js index 4c917d5..31a7f9c 100644 --- a/assets/js/santosh-magar-js.js +++ b/assets/js/santosh-magar-js.js @@ -97,4 +97,24 @@ $(document).ready(function () { }); -// ------------------------------------------------------------------------------------------------------------------------- +// ---------------------- portfolio section ------------------------------------------- +$('.portfolio-item').on('click', function (e) { + e.stopPropagation(); + var detail = $(this).find('.portfolio-item-detail'); + if (detail.length) { + detail.toggleClass("hide") + if ($(this).find('.portfolio-item-detail').hasClass("hide")) { + $("body").css('overflow', ""); + } else { + $("body").css('overflow', "hidden"); + } + } else { + var href = $(this).find('a').attr("href"); + window.open(href, '_blank'); + } +}); +$('.portfolio-item-detail .detail').on('click', function (e) { + e.stopPropagation(); +}) +// ------------------------------------------------------------------------------------- + diff --git a/index.html b/index.html index 5d66661..af7b01f 100644 --- a/index.html +++ b/index.html @@ -163,17 +163,12 @@

About me

- I am an enthusiastic web developer based in Kathmandu, Nepal, with a - rich experience of over 3.5 years in web application development. I - completed my Bachelor of Engineering in Information Technology [BE-IT] - from NCIT in 2019. Since then, I have been heavily involved in web - development. -

-

- I am skilled and experienced web developer specialization in PHP, Moodle - and WordPress, with good knowledge in PHP, MySql, HTML, CSS, JavaScript - to develop websites. I am expertise in developing Moodle and WordPress - theme, plugin and other functions within the project. + I am a passionate, skilled, and experienced web developer specializing + in PHP, Moodle, and WordPress, with a comprehensive + understanding of PHP, MySQL, HTML, CSS, and JavaScript to create dynamic + and responsive websites. I excel in managing the entire + lifecycle of web application systems, from development and testing to + ongoing maintenance.

@@ -273,15 +268,7 @@

My Experience

target="_blank">https://www.fiverr.com/santoshtmp

-
-

Self php project on "ausadipasal" : is a pharmacy management system. -
Let's look at - ausadipasal DEMO -

-
-
+
@@ -312,20 +299,24 @@
Jan 2021 -
-

Software Engineer I (e-Learning)

+

Software Engineer

    -
  1. Configure moodle site administration.
    2. -
  2. Customize/develop necessary moodle plugin and theme.
    3. -
  3. Manage moodle website course structure and users roles.
    4. -
  4. Develop SCORM, H5P eLearning and other activity.
    5. -
  5. Develop document and give guideline on using LMS sites.
    6. +
  6. Developed and maintained web application in multiple programming + languages, such as PHP, Moodle, + Wordpress and JavaScript
    7. +
  7. Developed REST APIs and integrate APIs for WordPress and Moodle + sites
    8. +
  8. Developed theme and plugin from scratch according to project.
    9. +
  9. Developed clean url routing for Moodle custom pages
    10. +
  10. Develop and manage site content like LMS Quiz, H5P, SCORM and + Elementor pages.
-
Oct 2020 -
+
Nov 2020 – Jun 2021
@@ -337,24 +328,17 @@
Oct 2020 -

Moodle Developer and Administration

    -
  1. Configure moodle site administration, along with users permission, - course setting - and other
    2. -
  2. Configure plugin, theme and site settings, also modify moodle - block layout using - CSS, HTML, JS and PHP.
    3. -
  3. Develop h5p, pages, quizzes, assignment and many more interactive - eLearning - content.
    4. -
  4. Manage LMS site, user and course reports.
    5. -
  5. Develop document and give guideline on using LMS sites.
    6. +
  6. Developed Moodle LMS that improved tracking and reporting of + chimpvine LMS.
    7. +
  7. Configure LMS plugin, theme and LMS settings.
    8. +
  8. Develop and manage LMS content like Quiz and H5P
-
Aug - Nov 2020
+
Aug 2020 – Oct 2020
@@ -363,15 +347,12 @@
Aug - Nov 2020
-

Website Tester & Intern

+

Internship

    -
  1. OMN website testing for usability and functionality issues then - create FRD to - improve the system.
    2. -
  2. Learn and gather knowledge on Figma prototype.
    3. -
  3. Manual test on chatbot that could answer student queries which was - develop on - Python RASA framework.
    4. +
  4. Conduct comprehensive website testing on OMN for usability and + functionality issues, aiming to enhance the + system. Additionally, actively engaging in tasks related to Moodle + LMS..
@@ -470,57 +451,143 @@

Portfolio

class="ri-file-download-line">
-
+
-

View

+

Explore

- Fiverr- Freelance + Fiverr - Freelance
-
+
+
+
X
+
+
+ + Fiverr - Freelance + +
+
+

+ Handle different fiverr projects + + https://www.fiverr.com/santoshtmp + +

+
+
+
+
- img -

View

+
+

Explore

- - NDRRMA LMS + + CSC Skill-lab LMS
-
+
+
+
X
+
+
+ +
+
+
    +
  • Developed custom theme and plugin from scratch.
    • +
  • Developed REST APIs for LMS to maintain tracking and + reporting.
    • +
  • Login and sing up through https://careerservicelab.com/ + main site API.
    • +
  • Developed the moodle clean routing for custom pages
    • +
+

Visit the site https://courses.careerservicelab.com/

+
+
+
+
- img -

View

+ img +

Explore

- Wplus LMS + + MuAN KMP + +
+
+
+
X
+
+
+ + MuAN KMP + +
+
+
    +
  • Developed REST APIs for MuAN KMP knowledge resources part.
    • +
  • Developed KMP WP custom post type, with KMP filter feature.
    • +
+

Visit the site https://muannepal.org.np/kmp/

+
+
+
-
- img -

View

+ img +

Explore

- - MuAN KMP - + Wplus LMS +
+
+
+
X
+
+
+
+ Wplus LMS +
+
+
+
    +
  • Developed custom theme and plugin from scratch.
    • +
  • Integrate PayPal Enrollment method
    • +
+

viste the site https://course.wplus.org/

+
+
+
-
- + View All Portfolio
@@ -599,7 +666,7 @@

For Work / General Inquiry.

For Work / General Inquiry.
diff --git a/portfolio/index.html b/portfolio/index.html index ee08c93..1342a41 100644 --- a/portfolio/index.html +++ b/portfolio/index.html @@ -6,7 +6,7 @@ + content="santosh magar, santoshtmp, PHP, MOODLE ,WordPress ,LMS , Web developer"> @@ -42,9 +42,9 @@ + /*to prevent Firefox FOUC, this must be here*/ + let FF_FOUC_FIX; + @@ -99,149 +99,259 @@
-
+

Portfolio

Download CV
-
+
-

View

+

Explore

- Fiverr- Freelance + Fiverr - Freelance
-
+
+
+
X
+
+
+ + Fiverr - Freelance + +
+
+

+ Handle different fiverr projects + + https://www.fiverr.com/santoshtmp + +

+
+
+
+
- img -

View

+
+

Explore

- - Chimpvine Nepal + + CSC Skill-lab LMS
-
+
+
+
X
+
+
+ +
+
+
    +
  • Developed custom theme and plugin from scratch.
    • +
  • Developed REST APIs for LMS to maintain tracking and + reporting.
    • +
  • Login and sing up through https://careerservicelab.com/ + main site API.
    • +
  • Developed the moodle clean routing for custom pages
    • +
+

Visit the site https://courses.careerservicelab.com/

+
+
+
+
- img -

View

+ img +

Explore

- ausadipasal + + MuAN KMP + +
+
+
+
X
+
+
+ + MuAN KMP + +
+
+
    +
  • Developed REST APIs for MuAN KMP knowledge resources part.
    • +
  • Developed KMP WP custom post type, with KMP filter feature.
    • +
+

Visit the site https://muannepal.org.np/kmp/

+
+
+
-
-
-
-

View

+ img +

Explore

- NASC LMS + Wplus LMS +
+
+
+
X
+
+
+
+ Wplus LMS +
+
+
+
    +
  • Developed custom theme and plugin from scratch.
    • +
  • Integrate PayPal Enrollment method
    • +
+

viste the site https://course.wplus.org/

+
+
+
-
-
-

View

- img + img +

Explore

- - EELMS LMS - + NMWWS NP
-
- img -

View

+ img +

Explore

+
- - Internal Audit LMS - + OSC +
+
+
+
X
+
+
+
+ OSC +
+
+
+

+
+
+
-
- img -

View

+

Explore

+ img
- - NDRRMA LMS + + EELMS LMS
-
-
- img -

View

+ img +

Explore

- NMWWS NP + + NDRRMA LMS +
-
-

View

+ img +

Explore

- OSC + + Internal Audit LMS + +
+
+
+
X
+
+
+ +
+
+

+
+
+
-
- img -

View

+ img +

Explore

- Wplus LMS + + Chimpvine Nepal +
-
-
-

View

+ img +

Explore

- - CSC Skill-lab LMS - + Ausadipasal github
-
- img -

View

+
+

Explore

- - MuAN KMP - + NASC LMS
-
@@ -319,22 +429,12 @@

For Work / General Inquiry.

-