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

397 lines
16KB
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. 

  21. 

  22.   <!-- Massive amount of favicon related stuff -->

  23.   <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png?v=2">

  24.   <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png?v=2">

  25.   <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png?v=2">

  26.   <link rel="manifest" href="/site.webmanifest?v=2">

  27.   <link rel="mask-icon" href="/safari-pinned-tab.svg?v=2" color="#5bbad5">

  28.   <link rel="shortcut icon" href="/favicon.ico?v=2">

  29.   <meta name="apple-mobile-web-app-title" content="FOSC">

  30.   <meta name="application-name" content="FOSC">

  31.   <meta name="msapplication-TileColor" content="#da532c">

  32.   <meta name="theme-color" content="#ffffff">

  33. 

  34. </head>

  35. 

  36. <body>

  37. 

  38.   <header>

  39.     <section class="navigation">

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

  41.         <div class="brand">

  42.           <picture>

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

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

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

  46.           </picture>

  47.         </div>

  48.         <nav>

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

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

  51.             <li>

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

  53.             </li>

  54.             <li>

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

  56.             </li>

  57.             <li>

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

  59.             </li>

  60.             <li>

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

  62.             </li>

  63.             <li>

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

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

  66.                 <li>

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

  68.                 </li>

  69.                 <li>

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

  71.                 </li>

  72.                 <li>

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

  74.                 </li>

  75.                 <li>

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

  77.                 </li>

  78.                 <li>

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

  80.                     Analytics</a>

  81.                 </li>

  82.                 <li>

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

  84.                 </li>

  85.                 <li>

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

  87.                     More</a>

  88.                 </li>

  89.               </ul>

  90.             </li>

  91.           </ul>

  92.         </nav>

  93.       </div>

  94.     </section>

  95. 

  96.     <script>

  97.       (function ($) {

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

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

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

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

  102.             // Close one dropdown when selecting another

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

  104.             e.stopPropagation();

  105.           });

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

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

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

  109.           });

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

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

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

  113.           });

  114.           // Hamburger to X toggle

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

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

  117.           });

  118.         }); // end DOM ready

  119.       })(jQuery);

  120.     </script>

  121.   </header>

  122. 

  123.   <div class="hero">

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

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

  126.     <hr>

  127.   </div>

  128. 

  129.   <div class="fosc">

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

  131.     <hr>

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

  133.   </div>

  134. 

  135.   <div class="bgallery">

  136.     <div class="gallery">

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

  138.         <picture>

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

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

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

  142.         </picture>

  143.         <picture>

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

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

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

  147.         </picture>

  148.         <picture>

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

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

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

  152.         </picture>

  153.         <picture>

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

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

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

  157.         </picture>

  158.         <picture>

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

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

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

  162.         </picture>

  163.       </div>

  164. 

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

  166.         <picture>

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

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

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

  170.         </picture>

  171.         <picture>

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

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

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

  175.         </picture>

  176.         <picture>

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

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

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

  180.         </picture>

  181.         <picture>

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

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

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

  185.         </picture>

  186.         <picture>

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

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

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

  190.         </picture>

  191.       </div>

  192. 

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

  194.         <picture>

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

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

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

  198.         </picture>

  199.         <picture>

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

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

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

  203.         </picture>

  204.         <picture>

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

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

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

  208.         </picture>

  209.         <picture>

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

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

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

  213.         </picture>

  214.       </div>

  215. 

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

  217.         <picture>

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

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

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

  221.         </picture>

  222.         <picture>

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

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

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

  226.         </picture>

  227.         <picture>

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

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

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

  231.         </picture>

  232.         <picture>

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

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

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

  236.         </picture>

  237.       </div>

  238.     </div>

  239.   </div>

  240. 

  241.   <div class="mgallery">

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

  243.   </div>

  244. 

  245.   <div id="services">

  246.     <div class="services">

  247.       <h1>OUR SERVICES</h1>

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

  249. 

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

  251.     </div>

  252. 

  253.     <div class="tabla">

  254.       <div class="column">

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

  256.           <picture>

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

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

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

  260.           </picture>

  261.         </a>

  262.         <h4>Cloud</h4>

  263.       </div>

  264. 

  265.       <div class="column">

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

  267.           <picture>

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

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

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

  271.           </picture>

  272.         </a>

  273.         <h4>Wiki</h4>

  274.       </div>

  275. 

  276.       <div class="column">

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

  278.           <picture>

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

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

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

  282.           </picture>

  283.         </a>

  284.         <h4>RSS</h4>

  285.       </div>

  286.     </div>

  287. 

  288.     <div class="tabla tabla2">

  289.       <div class="column">

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

  291.           <picture>

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

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

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

  295.           </picture>

  296.         </a>

  297.         <h4>NetData</h4>

  298.       </div>

  299. 

  300.       <div class="column">

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

  302.           <picture>

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

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

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

  306.           </picture>

  307.         </a>

  308.         <h4>Analytics</h4>

  309.       </div>

  310. 

  311.       <div class="column">

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

  313.           <picture>

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

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

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

  317.           </picture>

  318.         </a>

  319.         <h4>Stolen Code</h4>

  320.       </div>

  321.     </div>

  322.   </div>

  323. 

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

  325. 

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

  327. 

  328.     <div class="shape">

  329.       <div class="cmembers cmembers1">

  330. 

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

  332.         <hr>

  333. 

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

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

  336.           member.<br><br>

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

  338.         </p>

  339. 

  340.       </div>

  341. 

  342.       <div class="cmembers cmembers2">

  343. 

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

  345.         <hr>

  346. 

  347.         <div class="contact_methods">

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

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

  350.           <br>

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

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

  353.         </div>

  354. 

  355.         <div class="button">

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

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

  358.         </div>

  359. 

  360.       </div>

  361.     </div>

  362. 

  363.     <div class="map">

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

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

  366.     </div>

  367. 

  368.   </div>

  369. 

  370.   <footer>

  371.     <hr>

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

  373.       <picture>

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

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

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

  377.       </picture>

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

  379.       <div class="author">

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

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

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

  383.       </div>

  384.     </div>

  385.   </footer>

  386. 

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

  388.   <script>

  389.     window.lazyLoadOptions = {

  390.       elements_selector: ".lazy"

  391.     };

  392.   </script>

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

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

  395. </body>

  396. 

  397. </html>