diff --git a/src/common/rssService.js b/src/common/rssService.js new file mode 100644 index 0000000..174ba62 --- /dev/null +++ b/src/common/rssService.js @@ -0,0 +1,18 @@ +import axios from 'axios'; +import xml2js from 'xml2js'; + +class RssService { + async getRssFeed(url) { + try { + const response = await axios.get(url); + const result = await xml2js.parseStringPromise(response.data, { mergeAttrs: true }); + return result.rss.channel[0].item; + } catch (error) { + console.error('Error fetching RSS feed:', error); + return []; + } + } +} + +const rssService = new RssService(); +export default rssService; \ No newline at end of file diff --git a/src/common/translationService.js b/src/common/translationService.js new file mode 100644 index 0000000..85e5133 --- /dev/null +++ b/src/common/translationService.js @@ -0,0 +1,8 @@ +class TranslationService { + getTranslation(translations, key, currentLanguage) { + return translations.map(t => t[key]?.[currentLanguage] || '').join(''); + } + } + + const translationService = new TranslationService(); + export default translationService; \ No newline at end of file diff --git a/src/components/Software/About.jsx b/src/components/Software/About.jsx index 0884b94..13e4c28 100644 --- a/src/components/Software/About.jsx +++ b/src/components/Software/About.jsx @@ -3,6 +3,7 @@ import { Link } from 'gatsby'; import api from '../../common/api'; import { LanguageContext } from 'context/LanguageContext'; import UrlHelper from '../../common/urlHelper'; +import translationService from '../../common/translationService'; // Importa el servicio de traducción const About = () => { const { currentLanguage } = useContext(LanguageContext); @@ -22,8 +23,6 @@ const About = () => { fetchData(); }, [currentLanguage]); - const getTranslation = (translations, key) => translations.map(t => t[key][currentLanguage]).join(''); - return (
@@ -44,20 +43,20 @@ const About = () => {
-
+
- {getTranslation(dataAbout.translations, 'about_title2')} + {translationService.getTranslation(dataAbout.translations, 'about_title2',currentLanguage)}
- {getTranslation(dataAbout.translations, 'about_title3')} + {translationService.getTranslation(dataAbout.translations, 'about_title3',currentLanguage)}
- {getTranslation(dataAbout.translations, 'about_title4')} + {translationService.getTranslation(dataAbout.translations, 'about_title4',currentLanguage)}
- {getTranslation(dataAbout.translations, 'more_about')} + {translationService.getTranslation(dataAbout.translations, 'more_about',currentLanguage)}
@@ -69,11 +68,11 @@ const About = () => {
-
+
- {getTranslation(dataAbout.translations, 'about_title6')} + {translationService.getTranslation(dataAbout.translations, 'about_title6',currentLanguage)}
    { @@ -81,7 +80,7 @@ const About = () => { }
- {getTranslation(dataAbout.translations, 'about_title7')} + {translationService.getTranslation(dataAbout.translations, 'about_title7',currentLanguage)}
diff --git a/src/components/Software/Header.jsx b/src/components/Software/Header.jsx index 83d7c26..07db6f3 100644 --- a/src/components/Software/Header.jsx +++ b/src/components/Software/Header.jsx @@ -1,6 +1,7 @@ import React, { useEffect, useState, useContext } from 'react'; import api from '../../common/api'; import { LanguageContext } from '../../context/LanguageContext'; +import translationService from '../../common/translationService'; const Header = () => { const { currentLanguage } = useContext(LanguageContext); const [headers, setHeaders] = useState([]); @@ -16,7 +17,6 @@ const Header = () => { fetchData(); }, [], [currentLanguage]); - const getTranslation = (headers, key) => headers.map(t => t[key][currentLanguage]).join(''); return (
@@ -25,27 +25,27 @@ const Header = () => {
-

+

-
{getTranslation(headers, 'header_2')}{getTranslation(headers, 'header_3')}
+
{translationService.getTranslation(headers, 'header_2',currentLanguage)}{translationService.getTranslation(headers, 'header_3',currentLanguage)}
- +
diff --git a/src/components/Software/Pricing.jsx b/src/components/Software/Pricing.jsx index 94fdf64..2bfdf0b 100644 --- a/src/components/Software/Pricing.jsx +++ b/src/components/Software/Pricing.jsx @@ -1,18 +1,18 @@ -import React,{ useEffect, useState,useContext } from 'react'; +import React, { useEffect, useState, useContext } from 'react'; import { Link } from 'gatsby'; import { LanguageContext } from '../../context/LanguageContext'; import api from '../../common/api'; - +import translationService from '../../common/translationService'; const Pricing = () => { const { currentLanguage } = useContext(LanguageContext); - const [plansData, setPlansData] = useState({ plans: [], text_traductions: {} }); + const [plansData, setPlansData] = useState({ plans: [], text_traductions: [] }); useEffect(() => { const fetchData = async () => { try { - const response = await api.get('plan','plans.json'); + const response = await api.get('plan', 'plans.json'); setPlansData(response); } catch (error) { console.error(error); @@ -20,14 +20,14 @@ const Pricing = () => { }; fetchData(); - }, []); + }, [],[currentLanguage]); const { plans, text_traductions } = plansData; if (!plansData || plansData.length === 0) { return
Loading...
; } - + return (
@@ -36,16 +36,16 @@ const Pricing = () => {
-

{text_traductions.title && text_traductions.title[currentLanguage]} {text_traductions.title2 && text_traductions.title2[currentLanguage]}

+

{translationService.getTranslation(text_traductions, 'title',currentLanguage)} {translationService.getTranslation(text_traductions, 'title2',currentLanguage)}

- {text_traductions.subtitle1 && text_traductions.subtitle1[currentLanguage]} + {translationService.getTranslation(text_traductions, 'subtitle1',currentLanguage)} - {text_traductions.subtitle2 && text_traductions.subtitle2[currentLanguage]}
{text_traductions.contact && text_traductions.contact[currentLanguage]} {text_traductions.us_now && text_traductions.us_now[currentLanguage]} + {translationService.getTranslation(text_traductions, 'subtitle2',currentLanguage)}
{translationService.getTranslation(text_traductions, 'contact',currentLanguage)} {translationService.getTranslation(text_traductions, 'us_now',currentLanguage)} - {text_traductions.our_services_button && text_traductions.our_services_button[currentLanguage]} + {translationService.getTranslation(text_traductions, 'our_services_button',currentLanguage)}
@@ -55,15 +55,15 @@ const Pricing = () => { { plans.map((plan, i) => (
-
+
-

{ plan.title } { plan.recommended && {text_traductions.recommend && text_traductions.recommend[currentLanguage]} }

- { plan.description } +

{plan.title} {plan.recommended && {translationService.getTranslation(text_traductions, 'recommended',currentLanguage)}}

+ {plan.description}
-
{ plan.price }
- {text_traductions.per_month && text_traductions.per_month[currentLanguage]} +
{plan.price}
+ {translationService.getTranslation(text_traductions, 'per_month',currentLanguage)}
@@ -72,14 +72,14 @@ const Pricing = () => { plan.features.map((feature, i) => (
  • - { feature } + {feature}
    • )) }
    - {text_traductions.get_started_now && text_traductions.get_started_now[currentLanguage]} + {translationService.getTranslation(text_traductions, 'get_started_now',currentLanguage)}
    diff --git a/src/components/Software/Projects.jsx b/src/components/Software/Projects.jsx index c584c42..ae6ba34 100644 --- a/src/components/Software/Projects.jsx +++ b/src/components/Software/Projects.jsx @@ -1,20 +1,37 @@ -import React from 'react'; +import React, {useEffect, useState, useContext } from 'react'; import { Link } from 'gatsby'; -import projects from 'data/Software/projects.json'; -import { useIntl } from "gatsby-plugin-intl"; +import api from '../../common/api'; +import { LanguageContext } from "../../context/LanguageContext"; +import translationService from '../../common/translationService'; // Importa el servicio de traducción const Projects = () => { - const intl = useIntl(); + + const { currentLanguage } = useContext(LanguageContext); + const [projectsData, setProjectsData] = useState({ projects: [], titles: [] }); + + + useEffect(() => { + const fetchData = async () => { + try { + const response = await api.get('project', 'projects.json'); + setProjectsData(response); + } catch (error) { + console.error(error); + } + }; + + fetchData(); + }, [],[currentLanguage]); return (
    -

    {intl.formatMessage({ id: "our_featured" })} {intl.formatMessage({ id: "projects" })}

    +

    {translationService.getTranslation(projectsData.titles, 'our_featured',currentLanguage)} {translationService.getTranslation(projectsData.titles, 'projects',currentLanguage)}

    { - projects.map((project, i) => ( + projectsData.projects.map((project, i) => (
    @@ -31,7 +48,7 @@ const Projects = () => {
    - {intl.formatMessage({ id: "see_all_projects" })} + {translationService.getTranslation(projectsData.titles, 'see_all_projects',currentLanguage)}
    diff --git a/src/components/Software/Testimonials.jsx b/src/components/Software/Testimonials.jsx index dfbc30c..229ba18 100644 --- a/src/components/Software/Testimonials.jsx +++ b/src/components/Software/Testimonials.jsx @@ -1,25 +1,26 @@ -import React , { useEffect, useState }from 'react'; +import React , { useEffect, useState,useContext }from 'react'; import { Swiper, SwiperSlide } from 'swiper/react'; import SwiperCore, { Pagination, Navigation, Autoplay } from 'swiper'; -import { useIntl } from "gatsby-plugin-intl"; -//import testimonials from 'data/Software/testimonials.json'; import api from '../../common/api'; +import { LanguageContext } from 'context/LanguageContext'; +import translationService from '../../common/translationService'; import "swiper/css"; import 'swiper/css/autoplay'; import 'swiper/css/navigation'; import 'swiper/css/pagination'; +// Importa el servicio de traducción SwiperCore.use([Pagination, Navigation, Autoplay]); const Testimonials = () => { - const intl = useIntl(); - const [testimonials, setTestimonials] = useState([]); + const { currentLanguage } = useContext(LanguageContext); + const [testimonials, setTestimonials] = useState({testimonials:[],traductions:[]}); useEffect(() => { const fetchData = async () => { try { - const response = await api.get('testimonials', 'testimonials.json'); + const response = await api.get('testimonial', 'testimonials.json'); setTestimonials(response); } catch (error) { console.error(error); @@ -27,13 +28,13 @@ const Testimonials = () => { }; fetchData(); - }, []); + }, [],[currentLanguage]); return (
    -

    {intl.formatMessage({ id: "loved_thousands" })} {intl.formatMessage({ id: "clients" })}

    +

    {translationService.getTranslation(testimonials.traductions, 'loved_thousands',currentLanguage)} {translationService.getTranslation(testimonials.traductions, 'clients',currentLanguage)}

    { }} > { - testimonials.map((testimonial, index) => ( + testimonials.testimonials.map((testimonial, index) => (
    diff --git a/src/styles/preloader.css b/src/styles/preloader.css index b3e5bf7..3411be6 100644 --- a/src/styles/preloader.css +++ b/src/styles/preloader.css @@ -59,10 +59,10 @@ left: 0; height: 50%; width: 100%; - background: -webkit-gradient(linear, left top, right top, from(#0c3df4), to(#02b5ff)); - background: -webkit-linear-gradient(left, #0c3df4 0%, #02b5ff 100%); - background: -o-linear-gradient(left, #0c3df4 0%, #02b5ff 100%); - background: linear-gradient(to right, #0c3df4 0%, #02b5ff 100%); + background: -webkit-gradient(linear, left top, right top, from(#4a00e1), to(#8169f1)); + background: -webkit-linear-gradient(left, #4a00e1 0%, #8169f1 100%); + background: -o-linear-gradient(left, #4a00e1 0%, #8169f1 100%); + background: linear-gradient(to right, #4a00e1 0%, #8169f1 100%); -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1); -o-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1); transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1); } diff --git a/static/assets/css/common/_global.css b/static/assets/css/common/_global.css index eb97bd7..6abfbd1 100644 --- a/static/assets/css/common/_global.css +++ b/static/assets/css/common/_global.css @@ -314,10 +314,10 @@ small.text { left: 0; height: 50%; width: 100%; - background: -webkit-gradient(linear, left top, right top, from(#0c3df4), to(#02b5ff)); - background: -webkit-linear-gradient(left, #0c3df4 0%, #02b5ff 100%); - background: -o-linear-gradient(left, #0c3df4 0%, #02b5ff 100%); - background: linear-gradient(to right, #0c3df4 0%, #02b5ff 100%); + background: -webkit-gradient(linear, left top, right top, from(#4a00e1), to(#8169f1)); + background: -webkit-linear-gradient(left, #4a00e1 0%, #8169f1 100%); + background: -o-linear-gradient(left, #4a00e1 0%, #8169f1 100%); + background: linear-gradient(to right, #4a00e1 0%, #8169f1 100%); -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1); -o-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1); transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1); } diff --git a/static/assets/css/style.css b/static/assets/css/style.css index 6c1f757..bc98802 100644 --- a/static/assets/css/style.css +++ b/static/assets/css/style.css @@ -90,7 +90,7 @@ TABLE OF CONTENTS:- --color-yellowGreen:#cef54b; --color-gray:#eef4f8; --color-gray2:#f0eff5; - --color-main-grad: linear-gradient(to right, #0c3df4 0%, #02b5ff 100%); } + --color-main-grad: linear-gradient(to right, #4a00e1 0%, #8169f1 100%); } .color-main { color: var(--color-main) !important; } @@ -665,10 +665,10 @@ small.text { left: 0; height: 50%; width: 100%; - background: -webkit-gradient(linear, left top, right top, from(#0c3df4), to(#02b5ff)); - background: -webkit-linear-gradient(left, #0c3df4 0%, #02b5ff 100%); - background: -o-linear-gradient(left, #0c3df4 0%, #02b5ff 100%); - background: linear-gradient(to right, #0c3df4 0%, #02b5ff 100%); + background: -webkit-gradient(linear, left top, right top, from(#4a00e1), to(#8169f1)); + background: -webkit-linear-gradient(left, #4a00e1 0%, #8169f1 100%); + background: -o-linear-gradient(left, #4a00e1 0%, #8169f1 100%); + background: linear-gradient(to right, #4a00e1 0%, #8169f1 100%); -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1); -o-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1); transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1); } @@ -1426,10 +1426,10 @@ small.text { width: 150%; height: 100%; z-index: 1; - background: -webkit-gradient(linear, left top, right top, color-stop(10%, #0c3df4), color-stop(45%, #02b5ff), color-stop(#02b5ff), to(#0c3df4)); - background: -webkit-linear-gradient(left, #0c3df4 10%, #02b5ff 45%, #02b5ff, #0c3df4); - background: -o-linear-gradient(left, #0c3df4 10%, #02b5ff 45%, #02b5ff, #0c3df4); - background: linear-gradient(to right, #0c3df4 10%, #02b5ff 45%, #02b5ff, #0c3df4); + background: -webkit-gradient(linear, left top, right top, color-stop(10%, #4a00e1), color-stop(45%, #8169f1), color-stop(#8169f1), to(#4a00e1)); + background: -webkit-linear-gradient(left, #4a00e1 10%, #8169f1 45%, #8169f1, #4a00e1); + background: -o-linear-gradient(left, #4a00e1 10%, #8169f1 45%, #8169f1, #4a00e1); + background: linear-gradient(to right, #4a00e1 10%, #8169f1 45%, #8169f1, #4a00e1); -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } diff --git a/static/assets/img/logo_light.svg b/static/assets/img/logo_light.svg index df46dee..eea9149 100644 --- a/static/assets/img/logo_light.svg +++ b/static/assets/img/logo_light.svg @@ -18,7 +18,7 @@ } .cls-3 { - fill: #0c3df4; + fill: #4a00e1; fill-rule: evenodd; filter: url(#filter); } diff --git a/static/data/plans.json b/static/data/plans.json index 9e96fba..43d9893 100644 --- a/static/data/plans.json +++ b/static/data/plans.json @@ -1,71 +1,70 @@ { - "plan":{ - "plans": [ - { - "title": "Standard", - "description": "Basic features", - "price": "$29", - "features": [ - "3 Projects", - "6 Months Support & SEO", - "Basic Dashboard" - ] - }, - { - "title": "Pro", - "recommended": true, - "description": "Premium features", - "price": "$59", - "features": [ - "Unlimited Projects", - "Lifetime Support & SEO Experts Consult", - "Advance Dashboard", - "Data Security & Backup", - "Cloud Hosting & Domain" - ] - } -], -"text_traductions":{ - "our_services_button":{ - "es":"Nuestros Servicios", - "en":"Our Services" + "plan": { + "plans": [ + { + "title": "Standard", + "description": "Basic features", + "price": "$29", + "features": ["3 Projects", "6 Months Support & SEO", "Basic Dashboard"] }, - "subtitle1":{ - "en":"Kick-start your project with our pricing plan. We handle all the practical aspects related to hiring and hosting your team at our premises, thus saving you half a cost and a lot of efforts. Lorem ispum dolor sit amet", - "es":"Inicie su proyecto con nuestro plan de precios. Nos encargamos de todos los aspectos prácticos relacionados con la contratación y el alojamiento de su equipo en nuestras instalaciones, ahorrándole así la mitad de los costos y muchos esfuerzos. Lorem ispum dolor sit amet" + { + "title": "Pro", + "recommended": true, + "description": "Premium features", + "price": "$59", + "features": [ + "Unlimited Projects", + "Lifetime Support & SEO Experts Consult", + "Advance Dashboard", + "Data Security & Backup", + "Cloud Hosting & Domain" + ] + } + ], + "text_traductions": [ + { + "our_services_button": { + "es": "Nuestros Servicios", + "en": "Our Services" }, - "subtitle2":{ - "en":"Not find your plan, need a tailored-plan? ", - "es":"No encuentre su plan, necesita un plan ajustado? " - }, - "contact":{ - "en":"Contact", - "es":"Contacte" - }, - "us_now":{ - "en":"us now!", - "es":"con nosotros!" - }, - "title2":{ - "es":"Accesible", - "en":"Price" - }, - "title":{ - "es":"Precio", - "en":"Affordable" - }, - "recommend":{ - "es":"Recomendado", - "en":"Recomended" - }, - "per_month":{ - "es":"por mes", - "en":"per month" - }, - "get_started_now":{ - "es":"Comience ahora", - "en":"Get Started Now" - } + "subtitle1": { + "en": "Kick-start your project with our pricing plan. We handle all the practical aspects related to hiring and hosting your team at our premises, thus saving you half a cost and a lot of efforts. Lorem ispum dolor sit amet", + "es": "Inicie su proyecto con nuestro plan de precios. Nos encargamos de todos los aspectos prácticos relacionados con la contratación y el alojamiento de su equipo en nuestras instalaciones, ahorrándole así la mitad de los costos y muchos esfuerzos. Lorem ispum dolor sit amet" + }, + "subtitle2": { + "en": "Not find your plan, need a tailored-plan? ", + "es": "No encuentre su plan, necesita un plan ajustado? " + }, + "contact": { + "en": "Contact", + "es": "Contacte" + }, + "us_now": { + "en": "us now!", + "es": "con nosotros!" + }, + "title2": { + "es": "Accesible", + "en": "Price" + }, + "title": { + "es": "Precio", + "en": "Affordable" + }, + "recommend": { + "es": "Recomendado", + "en": "Recomended" + }, + "per_month": { + "es": "por mes", + "en": "per month" + }, + "get_started_now": { + "es": "Comience ahora", + "en": "Get Started Now" + } + } + ] + } } -} -} + diff --git a/static/data/projects.json b/static/data/projects.json index c578f79..13ce6bc 100644 --- a/static/data/projects.json +++ b/static/data/projects.json @@ -1,26 +1,46 @@ -[ - { - "image": "/assets/img/projects/3.png", - "title": "Catty Boxes NFT Blockchain", - "description": "Game Development", - "link":"http://surteloya.com" - }, - { - "image": "/assets/img/projects/4.png", - "title": "Catty Boxes NFT Blockchain", - "description": "Game Development", - "link":"http://surteloya.com" - }, - { - "image": "/assets/img/projects/5.png", - "title": "Catty Boxes NFT Blockchain", - "description": "Game Development", - "link":"http://surteloya.com" - }, - { - "image": "/assets/img/projects/6.png", - "title": "Catty Boxes NFT Blockchain", - "description": "Game Development", - "link":"http://surteloya.com" +{ + "project": { + "projects": [ + { + "image": "/assets/img/projects/3.png", + "title": "Catty Boxes NFT Blockchain", + "description": "Game Development", + "link": "http://surteloya.com" + }, + { + "image": "/assets/img/projects/4.png", + "title": "Catty Boxes NFT Blockchain", + "description": "Game Development", + "link": "http://surteloya.com" + }, + { + "image": "/assets/img/projects/5.png", + "title": "Catty Boxes NFT Blockchain", + "description": "Game Development", + "link": "http://surteloya.com" + }, + { + "image": "/assets/img/projects/6.png", + "title": "Catty Boxes NFT Blockchain", + "description": "Game Development", + "link": "http://surteloya.com" + } + ], + "titles": [ + { + "our_featured": { + "es": "nuestros destacados", + "en": "our featured" + }, + "projects": { + "es": "proyectos", + "en": "projects" + }, + "see_all_projects":{ + "es": "ver todos los proyectos", + "en": "see all projects" + } + } + ] } -] \ No newline at end of file +} diff --git a/static/data/testimonials.json b/static/data/testimonials.json index de5e386..e086106 100644 --- a/static/data/testimonials.json +++ b/static/data/testimonials.json @@ -1,5 +1,6 @@ { - "testimonials": [ + "testimonial": { + "testimonials": [ { "text": "“We encountered a problem with processing big data and after only 1 week, all fixed, professional, fast & affordable price!”", "image": "/assets/img/testimonials/testi.jpeg", @@ -24,5 +25,18 @@ "author": "Cesar Mendivil", "positon": "Product Management at Invisionapp" } + ], + "traductions": [ + { + "clients":{ + "es":"Clientes", + "en":"Clients" + }, + "loved_thousands":{ + "es":"Amado por muchos", + "en":"Loved by thousands" + } + } ] +} } \ No newline at end of file diff --git a/static/landing-preview/css/preview-style.css b/static/landing-preview/css/preview-style.css index 68b7497..3dc80e0 100644 --- a/static/landing-preview/css/preview-style.css +++ b/static/landing-preview/css/preview-style.css @@ -69,10 +69,10 @@ h5, h6 { top: 0; width: 100%; height: 2px; - background: -webkit-gradient(linear, left top, right top, color-stop(10%, #0c3df4), color-stop(45%, #02b5ff)); - background: -webkit-linear-gradient(left, #0c3df4 10%, #02b5ff 45%); - background: -o-linear-gradient(left, #0c3df4 10%, #02b5ff 45%); - background: linear-gradient(to right, #0c3df4 10%, #02b5ff 45%); } + background: -webkit-gradient(linear, left top, right top, color-stop(10%, #4a00e1), color-stop(45%, #8169f1)); + background: -webkit-linear-gradient(left, #4a00e1 10%, #8169f1 45%); + background: -o-linear-gradient(left, #4a00e1 10%, #8169f1 45%); + background: linear-gradient(to right, #4a00e1 10%, #8169f1 45%); } .nav-preview .dropDown .dropDownMenu .dropdown-items { position: relative; text-transform: capitalize;