fosc
/
fosc.space
1
0
Fork 0
Code Issues 0 Releases 0 Activity
Our webpage
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
105 Commits
1 Branch
18MB
Branch: master
Branches Tags
${ item.name }
Create branch ${ searchTerm }
from 'master'
${ noResults }
fosc.space/index.html

382 lines
15KB
Raw Permalink Blame History 

  1. <!DOCTYPE html>

  2. <html lang="en">

  3. 

  4. <!-- ****************************** -->

  5. <!-- * Ah shit, here we go again. * -->

  6. <!-- ****************************** -->

  7. 

  8. <head>

  9.   <meta charset="utf-8">

  10.   <title>FOSC - Free Open Source Club</title>

  11. 

  12.   <meta name="description" content="FOSC: Hackerspace located at Universidad Politecnica de Cartagena (UPCT)">

  13.   <meta name="viewport" content="width=device-width, initial-scale=1">

  14. 

  15.   <link rel="stylesheet" type="text/css" href="css/main.css">

  16.   <link href="https://fonts.googleapis.com/css?family=Fira+Sans&display=swap" rel="stylesheet">

  17. 

  18.   <script src="js/modernizer.js"></script>

  19.   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

  20. </head>

  21. 

  22. <body>

  23. 

  24.   <header>

  25.     <section class="navigation">

  26.       <div class="nav-container">

  27.         <div class="brand">

  28.           <picture>

  29.             <source type="image/webp" data-srcset="img/Logo-invert.webp">

  30.             <source type="image/png" data-srcset="img/Logo-invert.png">

  31.             <img alt="FOSC Logo" class="lazy" data-src="img/Logo-invert.png" style="width: 100px;">

  32.           </picture>

  33.         </div>

  34.         <nav>

  35.           <div class="nav-mobile"><span id="nav-toggle" href="#!"><span></span></span></div>

  36.           <ul class="nav-list">

  37.             <li>

  38.               <a href="https://blog.fosc.space"><span class="iconify" data-icon="mdi:notebook"></span> Blog</a>

  39.             </li>

  40.             <li>

  41.               <a href="https://gallery.fosc.space"><span class="iconify" data-icon="mdi:image"></span> Gallery</a>

  42.             </li>

  43.             <li>

  44.               <a href="https://download.fosc.space"><span class="iconify" data-icon="mdi:download"></span> Downloads</a>

  45.             </li>

  46.             <li>

  47.               <a href="#contact"><span class="iconify" data-icon="mdi:account"></span> Contact</a>

  48.             </li>

  49.             <li>

  50.               <a href="#!"><span class="iconify" data-icon="mdi:cogs"></span> Services</a>

  51.               <ul class="nav-dropdown">

  52.                 <li>

  53.                   <a href="https://cloud.fosc.space"><span class="iconify" data-icon="mdi:cloud"></span> Cloud</a>

  54.                 </li>

  55.                 <li>

  56.                   <a href="https://doc.fosc.space"><span class="iconify" data-icon="mdi:text"></span> Wiki</a>

  57.                 </li>

  58.                 <li>

  59.                   <a href="https://rss.fosc.space"><span class="iconify" data-icon="mdi:rss"></span> RSS</a>

  60.                 </li>

  61.                 <li>

  62.                   <a href="https://netdata.fosc.space"><span class="iconify" data-icon="mdi:finance"></span> NetData</a>

  63.                 </li>

  64.                 <li>

  65.                   <a href="https://analytics.fosc.space"><span class="iconify" data-icon="mdi:google-analytics"></span>

  66.                     Analytics</a>

  67.                 </li>

  68.                 <li>

  69.                   <a href="https://git.fosc.space"><span class="iconify" data-icon="mdi:git"></span> Stolen Code</a>

  70.                 </li>

  71.                 <li>

  72.                   <a href="https://services.fosc.space"><span class="iconify" data-icon="mdi:bookmark-plus"></span> More</a>

  73.                 </li>

  74.               </ul>

  75.             </li>

  76.           </ul>

  77.         </nav>

  78.       </div>

  79.     </section>

  80. 

  81.     <script>

  82.       (function ($) {

  83.         $(function () { // DOM ready

  84.           // If a link has a dropdown, add sub menu toggle.

  85.           $('nav ul li a:not(:only-child)').click(function (e) {

  86.             $(this).siblings('.nav-dropdown').toggle();

  87.             // Close one dropdown when selecting another

  88.             $('.nav-dropdown').not($(this).siblings()).hide();

  89.             e.stopPropagation();

  90.           });

  91.           // Clicking away from dropdown will remove the dropdown class

  92.           $('html').click(function () {

  93.             $('.nav-dropdown').hide();

  94.           });

  95.           // Toggle open and close nav styles on click

  96.           $('#nav-toggle').click(function () {

  97.             $('nav ul').slideToggle();

  98.           });

  99.           // Hamburger to X toggle

  100.           $('#nav-toggle').on('click', function () {

  101.             this.classList.toggle('active');

  102.           });

  103.         }); // end DOM ready

  104.       })(jQuery);

  105.     </script>

  106.   </header>

  107. 

  108.   <div class="hero">

  109.     <h1>Welcome to <span class="color">FOSC</span></h1>

  110.     <h3>Hackerspace located at Polytechnic University of Cartagena</h3>

  111.     <hr>

  112.   </div>

  113. 

  114.   <div class="fosc">

  115.     <h1>What is FOSC?</h1>

  116.     <hr>

  117.     <h3>We are a student association focused on expanding free software and hacker culture</h3>

  118.   </div>

  119. 

  120.   <div class="bgallery">

  121.     <div class="gallery">

  122.       <div class="column-gallery">

  123.         <picture>

  124.           <source type="image/webp" data-srcset="img/junction2018.webp">

  125.           <source type="image/jpeg" data-srcset="img/junction2018.jpg">

  126.           <img class="lazy" data-src="img/junction2018.jpg" alt="Winners at Junction 2018">

  127.         </picture>

  128.         <picture>

  129.           <source type="image/webp" data-srcset="img/santi.webp">

  130.           <source type="image/jpeg" data-srcset="img/santi.jpg">

  131.           <img class="lazy" data-src="img/santi.jpg" alt="Explaining MCU glitching at Makers Murcia">

  132.         </picture>

  133.         <picture>

  134.           <source type="image/webp" data-srcset="img/kids.webp">

  135.           <source type="image/jpeg" data-srcset="img/kids.jpg">

  136.           <img class="lazy" data-src="img/kids.jpg" alt="Showing 3D printing at Semana de la Ciencia">

  137.         </picture>

  138.         <picture>

  139.           <source type="image/webp" data-srcset="img/sec.webp">

  140.           <source type="image/jpeg" data-srcset="img/sec.jpg">

  141.           <img class="lazy" data-src="img/sec.jpg" alt="More Semana de la Ciencia">

  142.         </picture>

  143.         <picture>

  144.           <source type="image/webp" data-srcset="img/junction2018-1.webp">

  145.           <source type="image/jpeg" data-srcset="img/junction2018-1.jpg">

  146.           <img class="lazy" data-src="img/junction2018-1.jpg" alt="Hacking at Junction 2018">

  147.         </picture>

  148.       </div>

  149. 

  150.       <div class="column-gallery">

  151.         <picture>

  152.           <source type="image/webp" data-srcset="img/app.webp">

  153.           <source type="image/jpeg" data-srcset="img/app.jpg">

  154.           <img class="lazy" data-src="img/app.jpg" alt="Speaking for Puertas Violetas app">

  155.         </picture>

  156.         <picture>

  157.           <source type="image/webp" data-srcset="img/bitup.webp">

  158.           <source type="image/jpeg" data-srcset="img/bitup.jpg">

  159.           <img class="lazy" data-src="img/bitup.jpg" alt="Giving an ESP32 hacking talk at BITUP 2019">

  160.         </picture>

  161.         <picture>

  162.           <source type="image/webp" data-srcset="img/soldadura.webp">

  163.           <source type="image/jpeg" data-srcset="img/soldadura.jpg">

  164.           <img class="lazy" data-src="img/soldadura.jpg" alt="Learning to solder">

  165.         </picture>

  166.         <picture>

  167.           <source type="image/webp" data-srcset="img/hacking.webp">

  168.           <source type="image/jpeg" data-srcset="img/hacking.jpg">

  169.           <img class="lazy" data-src="img/hacking.jpg" alt="Installing Coreboot open firmware into a Thinkpad x230">

  170.         </picture>

  171.         <picture>

  172.           <source type="image/webp" data-srcset="img/junction2019-1.webp">

  173.           <source type="image/jpeg" data-srcset="img/junction2019-1.jpg">

  174.           <img class="lazy" data-src="img/junction2019-1.jpg" alt="Posing at Junction 2019">

  175.         </picture>

  176.       </div>

  177. 

  178.       <div class="column-gallery">

  179.         <picture>

  180.           <source type="image/webp" data-srcset="img/pepemod.webp">

  181.           <source type="image/jpeg" data-srcset="img/pepemod.jpg">

  182.           <img class="lazy" data-src="img/pepemod.jpg" alt="Soldering Nitrocaster's adapter board to a Thinkpad x230">

  183.         </picture>

  184.         <picture>

  185.           <source type="image/webp" data-srcset="img/atresmedia.webp">

  186.           <source type="image/jpeg" data-srcset="img/atresmedia.jpg">

  187.           <img class="lazy" data-src="img/atresmedia.jpg" alt="Having fun in Atresmedia">

  188.         </picture>

  189.         <picture>

  190.           <source type="image/webp" data-srcset="img/junction2019.webp">

  191.           <source type="image/jpeg" data-srcset="img/junction2019.jpg">

  192.           <img class="lazy" data-src="img/junction2019.jpg" alt="Hacking at Junction 2019">

  193.         </picture>

  194.         <picture>

  195.           <source type="image/webp" data-srcset="img/printer3d.webp">

  196.           <source type="image/jpeg" data-srcset="img/printer3d.jpg">

  197.           <img class="lazy" data-src="img/printer3d-1.jpg" alt="3D printer, 3D printing">

  198.         </picture>

  199.       </div>

  200. 

  201.       <div class="column-gallery">

  202.         <picture>

  203.           <source type="image/webp" data-srcset="img/flp1.webp">

  204.           <source type="image/jpeg" data-srcset="img/flp1.jpg">

  205.           <img class="lazy" data-src="img/flp1.jpg" alt="First FOSC LAN Party">

  206.         </picture>

  207.         <picture>

  208.           <source type="image/webp" data-srcset="img/soldadura1.webp">

  209.           <source type="image/jpeg" data-srcset="img/soldadura1.jpg">

  210.           <img class="lazy" data-src="img/soldadura1.jpg" alt="Soldering workshop">

  211.         </picture>

  212.         <picture>

  213.           <source type="image/webp" data-srcset="img/nn1.webp">

  214.           <source type="image/jpeg" data-srcset="img/nn1.jpg">

  215.           <img class="lazy" data-src="img/nn1.jpg" alt="Giving an open firmware talk at Navaja Negra 2019">

  216.         </picture>

  217.         <picture>

  218.           <source type="image/webp" data-srcset="img/fosc2.webp">

  219.           <source type="image/jpeg" data-srcset="img/fosc2.jpg">

  220.           <img class="lazy" data-src="img/fosc2-1.jpg" alt="Showing some stuff during Cable Amarillo">

  221.         </picture>

  222.       </div>

  223.     </div>

  224.   </div>

  225. 

  226.   <div class="mgallery">

  227.     <h3>Linux, hackathons, courses, talks, server systems administration, open software, firmware and hardware!</h3>

  228.   </div>

  229. 

  230.   <div id="services">

  231.     <div class="services">

  232.       <h1>OUR SERVICES</h1>

  233.       <p>We believe in self hosting! Our members can enjoy many different applications which run from our servers.</p>

  234. 

  235.       <p>Here we show a few ones, but there are much more.</p>

  236.     </div>

  237. 

  238.     <div class="tabla">

  239.       <div class="column">

  240.         <a href="https://cloud.fosc.space">

  241.           <picture>

  242.             <source type="image/webp" data-srcset="icons/cloud-computing.webp">

  243.             <source type="image/png" data-srcset="icons/cloud-computing.png">

  244.             <img class="lazy" data-src="icons/cloud-computing.png" alt="Cloud">

  245.           </picture>

  246.         </a>

  247.         <h4>Cloud</h4>

  248.       </div>

  249. 

  250.       <div class="column">

  251.         <a href="https://doc.fosc.space">

  252.           <picture>

  253.             <source type="image/webp" data-srcset="icons/book.webp">

  254.             <source type="image/png" data-srcset="icons/book.png">

  255.             <img class="lazy" data-src="icons/book.png" alt="Wiki">

  256.           </picture>

  257.         </a>

  258.         <h4>Wiki</h4>

  259.       </div>

  260. 

  261.       <div class="column">

  262.         <a href="https://rss.fosc.space">

  263.           <picture>

  264.             <source type="image/webp" data-srcset="icons/rss2.webp">

  265.             <source type="image/png" data-srcset="icons/rss2.png">

  266.             <img class="lazy" data-src="icons/rss2.png" alt="RSS">

  267.           </picture>

  268.         </a>

  269.         <h4>RSS</h4>

  270.       </div>

  271.     </div>

  272. 

  273.     <div class="tabla tabla2">

  274.       <div class="column">

  275.         <a href="https://netdata.fosc.space">

  276.           <picture>

  277.             <source type="image/webp" data-srcset="icons/chart.webp">

  278.             <source type="image/png" data-srcset="icons/chart.png">

  279.             <img class="lazy" data-src="icons/chart.png" alt="NetData">

  280.           </picture>

  281.         </a>

  282.         <h4>NetData</h4>

  283.       </div>

  284. 

  285.       <div class="column">

  286.         <a href="https://analytics.fosc.space">

  287.           <picture>

  288.             <source type="image/webp" data-srcset="icons/analytics.webp">

  289.             <source type="image/png" data-srcset="icons/analytics.png">

  290.             <img class="lazy" data-src="icons/analytics.png" alt="Analytics">

  291.           </picture>

  292.         </a>

  293.         <h4>Analytics</h4>

  294.       </div>

  295. 

  296.       <div class="column">

  297.         <a href="https://git.fosc.space">

  298.           <picture>

  299.             <source type="image/webp" data-srcset="icons/gitea.webp">

  300.             <source type="image/png" data-srcset="icons/gitea.png">

  301.             <img class="lazy" data-src="icons/gitea.png" alt="Gitea">

  302.           </picture>

  303.         </a>

  304.         <h4>Stolen Code</h4>

  305.       </div>

  306.     </div>

  307.   </div>

  308. 

  309.   <div class="members" id="contact">

  310. 

  311.     <h1>We're looking for new members!</h1>

  312. 

  313.     <div class="shape">

  314.       <div class="cmembers cmembers1">

  315. 

  316.         <h4>How do I become a member?</h4>

  317.         <hr>

  318. 

  319.         <p>You become a member by either coming to our physical hackerspace often<br><br>

  320.           If you've been coming a lot to the space, it's likely that you will be asked to become a formal

  321.           member.<br><br>

  322.           <b>Even if you are not a member, if the lights are on, you are free to come and hack inside.</b>

  323.         </p>

  324. 

  325.       </div>

  326. 

  327.       <div class="cmembers cmembers2">

  328. 

  329.         <h4>Tell us anything</h4>

  330.         <hr>

  331. 

  332.         <div class="contact_methods">

  333.           <p><span class="iconify" data-icon="mdi:twitter" style="color: #2196f3"></span> <a

  334.               href="https://twitter.com/foscupct">Contact us on Twitter</a></p>

  335.           <br>

  336.           <p><span class="iconify" data-icon="mdi:email" style="color: #f32821;"></span> <a

  337.               href="mailto:contact@fosc.space">Send us an email</a></p>

  338.         </div>

  339. 

  340.         <div class="button">

  341.           <button onclick="document.getElementById('mapButton').style.animation = 'rainbow 1s linear infinite'"

  342.             id="mapButton">Or just come in</button>

  343.         </div>

  344. 

  345.       </div>

  346.     </div>

  347. 

  348.     <div class="map">

  349.       <iframe id="map" title="Map view of our location" frameborder="0" allowfullscreen class="lazy"

  350.         data-src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d1580.5054989176758!2d-0.9796837724532329!3d37.60190018337746!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0xd6341863c83cf8f%3A0xe24278be476b56b8!2sFOSC!5e0!3m2!1ses!2ses!4v1544058887076"></iframe>

  351.     </div>

  352. 

  353.   </div>

  354. 

  355.   <footer>

  356.     <hr>

  357.     <div class="foot-logo">

  358.       <picture>

  359.         <source type="image/webp" data-srcset="img/Logo-invert.webp">

  360.         <source type="image/png" data-srcset="img/Logo-invert.png">

  361.         <img class="lazy" data-src="img/Logo-invert.png" alt="FOSC Logo">

  362.       </picture>

  363.       <a href="https://git.fosc.space/fosc/fosc.space">WEBSITE SOURCE CODE</a>

  364.       <div class="author">

  365.         <p>Icons made by <a href="https://www.flaticon.com/authors/freepik" title="Freepik">Freepik</a> and <a

  366.             href="https://www.flaticon.com/authors/smalllikeart" title="Smalllikeart">Smalllikeart</a> from <a

  367.             href="https://www.flaticon.com/">www.flaticon.com</a>.</p>

  368.       </div>

  369.     </div>

  370.   </footer>

  371. 

  372.   <!-- With the DOM ready, lazyload all pics and swap all icons -->

  373.   <script>

  374.     window.lazyLoadOptions = {

  375.       elements_selector: ".lazy"

  376.     };

  377.   </script>

  378.   <script async src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@15.1.1/dist/lazyload.min.js"></script>

  379.   <script async src="https://code.iconify.design/1/1.0.6/iconify.min.js"></script>

  380. </body>

  381. 

  382. </html>