diff --git a/submissions/hackclub browser buddy/hello.html b/submissions/hackclub browser buddy/hello.html new file mode 100644 index 00000000..b2590d8a --- /dev/null +++ b/submissions/hackclub browser buddy/hello.html @@ -0,0 +1,20 @@ + + + +
+

Welcome to the
FunHacks!

+ Have fun while waiting! + + Made with 🧡 by Abdelrahman Aref (Panda) + +
+
+ category: Hackclub! + FunHacks no. + Teens have made things that launched into space! 🚀 + In 2022, Hack Club partnered with SpaceX to send student-made projects into orbit. + +
+ + + diff --git a/submissions/hackclub browser buddy/hello_extensions.png b/submissions/hackclub browser buddy/hello_extensions.png new file mode 100644 index 00000000..63ea0d20 Binary files /dev/null and b/submissions/hackclub browser buddy/hello_extensions.png differ diff --git a/submissions/hackclub browser buddy/icon-rounded.png b/submissions/hackclub browser buddy/icon-rounded.png new file mode 100644 index 00000000..a7bc5e26 Binary files /dev/null and b/submissions/hackclub browser buddy/icon-rounded.png differ diff --git a/submissions/hackclub browser buddy/manifest.json b/submissions/hackclub browser buddy/manifest.json new file mode 100644 index 00000000..19bffbcb --- /dev/null +++ b/submissions/hackclub browser buddy/manifest.json @@ -0,0 +1,10 @@ +{ + "name": "FunHacks", + "description": "A memes generator and fun facts for the hackclub", + "version": "1.0", + "manifest_version": 3, + "action": { + "default_popup": "hello.html", + "default_icon": "./hello_extensions.png" + } +} diff --git a/submissions/hackclub browser buddy/popup.js b/submissions/hackclub browser buddy/popup.js new file mode 100644 index 00000000..7d7309ad --- /dev/null +++ b/submissions/hackclub browser buddy/popup.js @@ -0,0 +1,21 @@ +let start_button = document.getElementById("start-button"); +let next_button = document.getElementById("next-button"); +let content_div = document.getElementById("content-div"); +let main_div = document.getElementById("main-div"); +let facts_content = document.getElementById("fact-content"); +let fact_number = document.getElementById("fact-number"); +let i = 0; +let facts_list = ["Hack Club welcomes beginners. Many students start with zero experience and learn everything with the help of others.", "Hack Club is for high school students only! It’s a global community where teenagers learn coding together — no adults running the show.", "Everything is open source — you can see and edit real code. Even Hack Club’s own website and tools are public on GitHub, so you can learn by looking at real projects.", "You can build real websites, games, and apps with others. Hack Club has tutorials like Workshops that teach you how to make your first site, game, or app.", "Hack Club helps you host real hackathons (for free!). They’ll even help you get sponsors and manage money legally through something called Hack Club Bank."] +start_button.onclick = function(){ + content_div.style.display = "block"; + main_div.style.display = "none"; + +} +next_button.onclick = function(){ + + facts_content.innerHTML = facts_list[i]; + i++; + if(i == 5){ + i = 0; + } +} \ No newline at end of file diff --git a/submissions/hackclub browser buddy/style.css b/submissions/hackclub browser buddy/style.css new file mode 100644 index 00000000..8309b60a --- /dev/null +++ b/submissions/hackclub browser buddy/style.css @@ -0,0 +1,101 @@ +body{ + width: 300px; + height: 300px; +} +.title{ + position: absolute; + font-size: 25px; + font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif; + font-weight: 500; + margin-top: 80px; + margin-left: 50px; +} +.title-name{ + font-family: 'Courier New', Courier, monospace; + font-weight: 800; + font-size: 28px; + color: orangered; + margin-left: 80px; +} +#start-button{ + position: absolute; + width: 180px; + height: 45px; + background-color: transparent; + border: 2px solid black; + margin-top: 185px; + margin-left: 60px; + border-radius: 15px; + transition: 0.7s ease; + cursor: pointer; +} +#start-button:hover{ + background-color: orangered; + color: whitesmoke; + border-color: rgb(187, 50, 0); +} +.funhacks-descrbtion{ + position: absolute; + margin-top: 160px; + margin-left: 50px; + font-family: 'Courier New', Courier, monospace; + font-size: 15px; + font-weight: 700; +} +#content-div{ + display: none; + position: absolute; + width: 100%; + height: 100%; +} +#category-name{ + position: absolute; + margin-top: 10px; + margin-left: 10px; + font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; + font-size: 15px; +} +#fact-number-text{ + position: absolute; + margin-top: 50px; + margin-left: 100px; + font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; + font-size: 15px; +} +#fact-number{ + position: absolute; +} +#fact-content{ + position: absolute; + width: 300px; + height: 100%; + margin-top: 50px; + margin-left: -185px; + font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; + font-size: 15px; + font-weight: 50; +} +#next-button{ + position: absolute ; + width: 180px; + height: 45px; + background-color: transparent; + border: 2px solid black; + margin-top: 165px; + margin-left: -125px; + border-radius: 15px; + transition: 0.7s ease; + cursor: pointer; +} +#next-button:hover{ + background-color: orangered; + color: whitesmoke; + border-color: rgb(187, 50, 0); +} +.footer-text{ + position: absolute; + margin-top: 260px; + margin-left: 30px; + font-family: 'Courier New', Courier, monospace; + font-size: 10px; +} \ No newline at end of file