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.
99 Commits
1 Branch
9.3MB
Branch: master
Branches Tags
${ item.name }
Create branch ${ searchTerm }
from 'master'
${ noResults }
fosc.space/index.html

379 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.               </ul>

  72.             </li>

  73.           </ul>

  74.         </nav>

  75.       </div>

  76.     </section>

  77. 

  78.     <script>

  79.       (function ($) {

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

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

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

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

  84.             // Close one dropdown when selecting another

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

  86.             e.stopPropagation();

  87.           });

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

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

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

  91.           });

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

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

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

  95.           });

  96.           // Hamburger to X toggle

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

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

  99.           });

  100.         }); // end DOM ready

  101.       })(jQuery);

  102.     </script>

  103.   </header>

  104. 

  105.   <div class="hero">

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

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

  108.     <hr>

  109.   </div>

  110. 

  111.   <div class="fosc">

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

  113.     <hr>

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

  115.   </div>

  116. 

  117.   <div class="bgallery">

  118.     <div class="gallery">

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

  120.         <picture>

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

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

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

  124.         </picture>

  125.         <picture>

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

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

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

  129.         </picture>

  130.         <picture>

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

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

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

  134.         </picture>

  135.         <picture>

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

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

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

  139.         </picture>

  140.         <picture>

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

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

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

  144.         </picture>

  145.       </div>

  146. 

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

  148.         <picture>

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

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

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

  152.         </picture>

  153.         <picture>

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

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

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

  157.         </picture>

  158.         <picture>

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

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

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

  162.         </picture>

  163.         <picture>

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

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

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

  167.         </picture>

  168.         <picture>

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

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

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

  172.         </picture>

  173.       </div>

  174. 

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

  176.         <picture>

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

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

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

  180.         </picture>

  181.         <picture>

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

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

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

  185.         </picture>

  186.         <picture>

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

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

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

  190.         </picture>

  191.         <picture>

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

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

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

  195.         </picture>

  196.       </div>

  197. 

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

  199.         <picture>

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

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

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

  203.         </picture>

  204.         <picture>

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

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

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

  208.         </picture>

  209.         <picture>

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

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

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

  213.         </picture>

  214.         <picture>

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

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

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

  218.         </picture>

  219.       </div>

  220.     </div>

  221.   </div>

  222. 

  223.   <div class="mgallery">

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

  225.   </div>

  226. 

  227.   <div id="services">

  228.     <div class="services">

  229.       <h1>OUR SERVICES</h1>

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

  231. 

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

  233.     </div>

  234. 

  235.     <div class="tabla">

  236.       <div class="column">

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

  238.           <picture>

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

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

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

  242.           </picture>

  243.         </a>

  244.         <h4>Cloud</h4>

  245.       </div>

  246. 

  247.       <div class="column">

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

  249.           <picture>

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

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

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

  253.           </picture>

  254.         </a>

  255.         <h4>Wiki</h4>

  256.       </div>

  257. 

  258.       <div class="column">

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

  260.           <picture>

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

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

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

  264.           </picture>

  265.         </a>

  266.         <h4>RSS</h4>

  267.       </div>

  268.     </div>

  269. 

  270.     <div class="tabla tabla2">

  271.       <div class="column">

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

  273.           <picture>

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

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

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

  277.           </picture>

  278.         </a>

  279.         <h4>NetData</h4>

  280.       </div>

  281. 

  282.       <div class="column">

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

  284.           <picture>

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

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

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

  288.           </picture>

  289.         </a>

  290.         <h4>Analytics</h4>

  291.       </div>

  292. 

  293.       <div class="column">

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

  295.           <picture>

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

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

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

  299.           </picture>

  300.         </a>

  301.         <h4>Stolen Code</h4>

  302.       </div>

  303.     </div>

  304.   </div>

  305. 

  306.   <div class="members">

  307. 

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

  309. 

  310.     <div class="shape">

  311.       <div class="cmembers cmembers1">

  312. 

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

  314.         <hr>

  315. 

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

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

  318.           member.<br><br>

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

  320.         </p>

  321. 

  322.       </div>

  323. 

  324.       <div class="cmembers cmembers2">

  325. 

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

  327.         <hr>

  328. 

  329.         <div class="contact_methods">

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

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

  332.           <br>

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

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

  335.         </div>

  336. 

  337.         <div class="button">

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

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

  340.         </div>

  341. 

  342.       </div>

  343.     </div>

  344. 

  345.     <div class="map">

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

  347.         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>

  348.     </div>

  349. 

  350.   </div>

  351. 

  352.   <footer>

  353.     <hr>

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

  355.       <picture>

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

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

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

  359.       </picture>

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

  361.       <div class="author">

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

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

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

  365.       </div>

  366.     </div>

  367.   </footer>

  368. 

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

  370.   <script>

  371.     window.lazyLoadOptions = {

  372.       elements_selector: ".lazy"

  373.     };

  374.   </script>

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

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

  377. </body>

  378. 

  379. </html>