import SkillCard from "./SkillCard.jsx";
import "../styles/Skills.css";

function Skills() {
    return (
        <section id="skills-section">
            <h1>Skills</h1>
            <div id="languages" className="skill-category">
                <h2>Languages</h2>
                <div className="skills">
                    <SkillCard text="Python"/>
                    <SkillCard text="Java"/>
                    <SkillCard text="C++"/>
                    <SkillCard text="HTML"/>
                    <SkillCard text="CSS"/>
                    <SkillCard text="JavaScript"/>
                    <SkillCard text="PHP"/>
                    <SkillCard text="SQL"/>
                </div>
            </div>
            <div id="librairies" className="skill-category">
                <h2>Librairies</h2>
                <div className="skills">
                    <SkillCard text="React"/>
                </div>
            </div>
            <div id="tools" className="skill-category">
                <h2>Tools</h2>
                <div className="skills">
                    <SkillCard text="Git"/>
                </div>
            </div>
        </section>
    )
}


export default Skills