An alternative to sticking that lovely web app into an on a corp website</p> </div> </div> </div> </div> <div class="py-3 border-bottom border-light-dark"> <div class="container"> <ul class="d-flex list-unstyled p-0 position-relative mb-0 mx-n2"> <li class="px-2"> <a class="fw-bold text-primary" href="https://www.opensourceagenda.com/projects/node-iframe-replacement">Overview</a> </li> <li class="px-2"> <a class="fw-bold text-black" href="https://www.opensourceagenda.com/projects/node-iframe-replacement/versions">Versions</a> </li> <li class="px-2"> <a class="fw-bold text-black" href="https://www.opensourceagenda.com/projects/node-iframe-replacement/reviews">Reviews</a> </li> <li class="px-2"> <a class="fw-bold text-black" href="https://www.opensourceagenda.com/projects/node-iframe-replacement/resources">Resources</a> </li> </ul> </div> </div> <div class="container my-5"> <div class="row g-4"> <div class="col-12 col-lg-8 order-2 order-lg-1"> <div> <div class="px-2 mb-3 bg-primary text-white d-inline-block position-relative">Project README</div> <div id="readme" class="section-l" data-base="https://github.com/john-doherty/node-iframe-replacement/blob/master/" class="readme mb-4"> <div> <h1>node-iframe-replacement</h1> <p><a href="https://app.shippable.com/projects/5869721607d5371300747182"><img src="https://img.shields.io/shippable/5869721607d5371300747182/master.svg" alt="Shippable branch"></a> <a href="https://www.npmjs.com/package/node-iframe-replacement"><img src="https://img.shields.io/npm/dt/node-iframe-replacement.svg" alt="npm"></a></p> <a href="#motivation"></a><h2 id="motivation">Motivation</h2> <p>Imagine the scenario: you've built a lovely web app for a business, who later insists it goes live within an iframe of their corp website. You resist, but you're ultimatley forced to bastardize your app to make it work.</p> <p><a href="https://github.com/john-doherty/node-iframe-replacement">node-iframe-replacement</a> is the compromise. A small node server that grabs the source code of an external website and injects your content - thus allowing you to host your app on a subdomain and without an iframe. Changes to the external site <em>(navigation etc)</em> are automatically picked up every 5 minutes and reflected in your app.</p> <p>You can now argue that your web app can remain synced with the corperate website look/feel without an iframe.</p> <a href="#installation"></a><h2 id="installation">Installation</h2> <pre><code class="language-bash">$ npm install --save node-iframe-replacement </code></pre> <a href="#usage"></a><h2 id="usage">Usage</h2> <a href="#example-server"></a><h3 id="example-server">Example server</h3> <p>The example below will request the <a href="http://www.bbc.co.uk/news">BBC News</a> home page and replace the contents of <strong>div[data-entityid="container-top-stories#1"]</strong> with the contents of our fake-news view:</p> <p><em>express logic excluded to improve readability, you can view the full example implementation <a href="example/server.js">here</a></em></p> <pre><code class="language-js">var iframeReplacement = require('node-iframe-replacement'); // add iframe replacement to express as middleware (adds res.merge method) app.use(iframeReplacement); // create a regular express route app.get('/', function(req, res){ // respond to this request with our fake-news content embedded within the BBC News home page res.merge('fake-news', { // external url to fetch sourceUrl: 'http://www.bbc.co.uk/news', // css selector to inject our content into sourcePlaceholder: 'div[data-entityid="container-top-stories#1"]', // pass a function here to intercept the source html prior to merging transform: null }); }); </code></pre> <p>If you pass a function as the transform property <code>transform: function($, model) {}</code> - the function will be called prior to rendering, allowing you to inject title tags, html attributes etc. The <code>$</code> passed to your transform method is a JQuery like object using <a href="https://github.com/cheeriojs/cheerio#cheerio">cheerio</a>, removing the need to parse strings.</p> <a href="#example-fake-news-html"></a><h3 id="example-fake-news-html">Example fake-news html</h3> <pre><code class="language-html"><div style="margin: 0 0 0 20px; overflow: auto;"> <div style="width: 210px; float: left;"> <a href="https://github.com/john-doherty/node-iframe-replacement" target="_blank"> <h3 style="color: #222; font-size: 32px; font-weight: bold; margin: 0 0 10px 0;">iframe replacement Node.js module lanuched</h3> </a> <p style="padding: 0; font-size: 14px;line-height: 22px"> Open source project not only has the potential to replace iframes, but also brings a whole new meaning to the concept of fake news. </p> </div> <img src="https://cdn.colorlib.com/wp/wp-content/uploads/sites/2/nodejs-frameworks.png" alt="Node js logo" style="width: 500px; float: right;"/> </div> </code></pre> <a href="#example-input"></a><h3 id="example-input">Example input</h3> <p><img src="docs/bbc-news-actual-homepage.png" alt="alt text" title="BBC News actual homepage"></p> <a href="#example-output"></a><h3 id="example-output">Example output</h3> <p><img src="docs/bbc-news-fake-homepage.png" alt="alt text" title="BBC News actual homepage"></p> <a href="#run-the-example"></a><h3 id="run-the-example">Run the example</h3> <p>You can try the example for yourself using the following commands:</p> <pre><code class="language-bash">git clone https://github.com/john-doherty/node-iframe-replacement cd node-iframe-replacement npm install npm start </code></pre> <p>Then visit <a href="http://localhost:8080">http://localhost:8080</a> in your browser.</p> <a href="#auto-base-tag-injection"></a><h2 id="auto-base-tag-injection">Auto base tag injection</h2> <p>To ensure the source scripts, styles and images load within your site a base tag is automatically injected <code><base href="http://www.bbc.co.uk/news" /></code>.</p> <p>Because of this, you need to ensure all the links within your conent are absolute.</p> <a href="#contributing"></a><h2 id="contributing">Contributing</h2> <p>Everyone is welcome to contribute to this project. You can contribute just by submitting bugs or suggest improvements by <a href="https://github.com/john-doherty/node-iframe-replacement/issues">opening an issue</a> on GitHub.</p> <a href="#history"></a><h2 id="history">History</h2> <p>This project is a rethought, rebranded, relaunched version of my badly named <a href="https://www.npmjs.com/package/express-render-template">express-render-template</a> module released in Arpil 2016.</p> <a href="#license"></a><h2 id="license">License</h2> <p>Licensed under <a href="LICENSE">ISC License</a> © <a href="https://twitter.com/MrJohnDoherty">John Doherty</a></p> </div> </div> <div class="text-xs">Open Source Agenda is not affiliated with "Node Iframe Replacement" Project. README Source: <a href="https://github.com/john-doherty/node-iframe-replacement" target="_blank">john-doherty/node-iframe-replacement</a></div> </div> </div> <div class="col-12 col-lg-4 order-1 order-lg-2"> <div> <div class="d-flex justify-content-center mb-5"> </div> <div class="mb-3"> <div class="row pb-3"> <div class="col-6"> <span class="fw-bold">Stars</span> </div> <div class="col-6 text-end"> <span class="fw-bold">50</span> </div> </div> <div class="row pb-3"> <div class="col-6"> <span class="fw-bold">Open Issues</span> </div> <div class="col-6 text-end"> <span class="fw-bold">4</span> </div> </div> <div class="row pb-3"> <div class="col-6"> <span class="fw-bold">Last Commit</span> </div> <div class="col-6 text-end"> <span class="fw-bold">2 years ago</span> </div> </div> <div class="row pb-3"> <div class="col-12"> <span class="fw-bold">Repository</span> </div> <div class="col-12"> <a href="https://github.com/john-doherty/node-iframe-replacement" target="_blank" class="fw-bold text-primary">john-doherty/node-iframe-replacement</a> </div> </div> <div class="row pb-3"> <div class="col-6"> <span class="fw-bold">License</span> </div> <div class="col-6 text-end"> <a href="https://www.opensourceagenda.com/tags/isc" class="font-bold text-primary">ISC</a> </div> </div> <div class="row pb-3"> <div class="col-12"> <span class="fw-bold">Tags</span> </div> <div class="col-12"> <a href="https://www.opensourceagenda.com/tags/express-middleware" class="fw-bold text-primary me-3">Express Middleware</a> <a href="https://www.opensourceagenda.com/tags/expressjs" class="fw-bold text-primary me-3">Expressjs</a> <a href="https://www.opensourceagenda.com/tags/iframe" class="fw-bold text-primary me-3">Iframe</a> <a href="https://www.opensourceagenda.com/tags/nodejs" class="fw-bold text-primary me-3">Node.js</a> </div> </div> </div> <div class="mb-4"> <div class="card bg-light p-3"> <h4>Open Source Agenda Badge</h4> <div class="mb-3"> <img src="https://www.opensourceagenda.com/projects/node-iframe-replacement/reviews/badge.svg" alt="Open Source Agenda Rating" /> </div> <div> <textarea class="w-100 p-2 border-white bg-light text-dark" readonly style="height:115px;word-break:break-all;"><a href="https://www.opensourceagenda.com/projects/node-iframe-replacement"><img src="https://www.opensourceagenda.com/projects/node-iframe-replacement/reviews/badge.svg" alt="Open Source Agenda"></a></textarea> </div> </div> </div> <div class="mb-4"> <a href="#" data-bs-toggle="modal" data-bs-target="#signInModal" class="d-block btn btn-warning text-white py-3 text-start"> <div class="d-flex"> <i class="fas fa-star fa-3x me-3 align-self-center"></i> <div class="align-self-center"> <span class="h4 mb-0 d-block">Submit Review</span> <span class="d-block">Review Your Favorite Project</span> </div> </div> </a> </div> <div class="mb-4"> <a href="#" data-bs-toggle="modal" data-bs-target="#signInModal" class="d-block btn btn-primary text-white py-3 text-start"> <div class="d-flex"> <i class="fas fa-list-alt fa-3x me-3 align-self-center"></i> <div class="align-self-center"> <span class="h4 mb-0 d-block">Submit Resource</span> <span class="d-block">Articles, Courses, Videos</span> </div> </div> </a> </div> <div class="mb-4"> <a href="https://forms.gle/u3ctNaCwf9sW5EaGA" target="_blank" class="d-block btn btn-light text-white py-3 text-start"> <div class="d-flex"> <i class="fas fa-pen fa-3x me-3 align-self-center text-black"></i> <div class="align-self-center"> <span class="h4 mb-0 d-block text-black">Submit Article</span> <span class="d-block text-black">Submit a post to our blog</span> </div> </div> </a> </div> <div class="d-none d-lg-block"> <h3>From the blog</h3> <div class="row g-4"> <div class="col-12"> <a href="https://www.opensourceagenda.com/blog/how-to-choose-which-programming-language-to-learn-first" class="d-block position-relative"> <div class="image-container"> <div class="image-inner"> <img loading="lazy" srcset="https://www.opensourceagenda.com/storage/media/715/responsive-images/how-to-choose-which-programming-language-to-learn___media_library_original_1920_1280.jpg 1920w, https://www.opensourceagenda.com/storage/media/715/responsive-images/how-to-choose-which-programming-language-to-learn___media_library_original_1606_1071.jpg 1606w, https://www.opensourceagenda.com/storage/media/715/responsive-images/how-to-choose-which-programming-language-to-learn___media_library_original_1344_896.jpg 1344w, https://www.opensourceagenda.com/storage/media/715/responsive-images/how-to-choose-which-programming-language-to-learn___media_library_original_1124_749.jpg 1124w, https://www.opensourceagenda.com/storage/media/715/responsive-images/how-to-choose-which-programming-language-to-learn___media_library_original_940_627.jpg 940w, https://www.opensourceagenda.com/storage/media/715/responsive-images/how-to-choose-which-programming-language-to-learn___media_library_original_787_525.jpg 787w, https://www.opensourceagenda.com/storage/media/715/responsive-images/how-to-choose-which-programming-language-to-learn___media_library_original_658_439.jpg 658w, https://www.opensourceagenda.com/storage/media/715/responsive-images/how-to-choose-which-programming-language-to-learn___media_library_original_550_367.jpg 550w, https://www.opensourceagenda.com/storage/media/715/responsive-images/how-to-choose-which-programming-language-to-learn___media_library_original_460_307.jpg 460w, data:image/svg+xml;base64,PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbDpzcGFjZT0icHJlc2VydmUiIHg9IjAiCiB5PSIwIiB2aWV3Qm94PSIwIDAgMTkyMCAxMjgwIj4KCTxpbWFnZSB3aWR0aD0iMTkyMCIgaGVpZ2h0PSIxMjgwIiB4bGluazpocmVmPSJkYXRhOmltYWdlL2pwZWc7YmFzZTY0LC85ai80QUFRU2taSlJnQUJBUUVBWUFCZ0FBRC8vZ0E3UTFKRlFWUlBVam9nWjJRdGFuQmxaeUIyTVM0d0lDaDFjMmx1WnlCSlNrY2dTbEJGUnlCMk5qSXBMQ0J4ZFdGc2FYUjVJRDBnT1RBSy85c0FRd0FEQWdJREFnSURBd01EQkFNREJBVUlCUVVFQkFVS0J3Y0dDQXdLREF3TENnc0xEUTRTRUEwT0VRNExDeEFXRUJFVEZCVVZGUXdQRnhnV0ZCZ1NGQlVVLzlzQVF3RURCQVFGQkFVSkJRVUpGQTBMRFJRVUZCUVVGQlFVRkJRVUZCUVVGQlFVRkJRVUZCUVVGQlFVRkJRVUZCUVVGQlFVRkJRVUZCUVVGQlFVRkJRVUZCUVUvOEFBRVFnQUZRQWdBd0VpQUFJUkFRTVJBZi9FQUI4QUFBRUZBUUVCQVFFQkFBQUFBQUFBQUFBQkFnTUVCUVlIQ0FrS0MvL0VBTFVRQUFJQkF3TUNCQU1GQlFRRUFBQUJmUUVDQXdBRUVRVVNJVEZCQmhOUllRY2ljUlF5Z1pHaENDTkNzY0VWVXRId0pETmljb0lKQ2hZWEdCa2FKU1luS0NrcU5EVTJOemc1T2tORVJVWkhTRWxLVTFSVlZsZFlXVnBqWkdWbVoyaHBhbk4wZFhaM2VIbDZnNFNGaG9lSWlZcVNrNVNWbHBlWW1acWlvNlNscHFlb3FhcXlzN1MxdHJlNHVickN3OFRGeHNmSXljclMwOVRWMXRmWTJkcmg0dVBrNWVibjZPbnE4Zkx6OVBYMjkvajUrdi9FQUI4QkFBTUJBUUVCQVFFQkFRRUFBQUFBQUFBQkFnTUVCUVlIQ0FrS0MvL0VBTFVSQUFJQkFnUUVBd1FIQlFRRUFBRUNkd0FCQWdNUkJBVWhNUVlTUVZFSFlYRVRJaktCQ0JSQ2thR3h3UWtqTTFMd0ZXSnkwUW9XSkRUaEpmRVhHQmthSmljb0tTbzFOamM0T1RwRFJFVkdSMGhKU2xOVVZWWlhXRmxhWTJSbFptZG9hV3B6ZEhWMmQzaDVlb0tEaElXR2g0aUppcEtUbEpXV2w1aVptcUtqcEtXbXA2aXBxckt6dExXMnQ3aTV1c0xEeE1YR3g4akp5dExUMU5YVzE5aloydUxqNU9YbTUranA2dkx6OVBYMjkvajUrdi9hQUF3REFRQUNFUU1SQUQ4QStONDFQMlFoUmsxalNRdnZPYTZQVGhITEF5RnRwck12N1FvNXcyYTZKSm5MQ1Naanl4Yk9jMCt5aVdhNFZXYmFEM3BKNFhqUHpVMjN0cExtVUxFQ3plMWN6MFYyZGNidlk2UFNlSkVKR2FYVkpzU01Bb0ZGRmUxeXAwOVVlQ3BOVDBaaVhVclNEbXJmaHk4YXl1dzZxckgzb29yeE1SRk9MUjlCaEcxSk5ILy8yUT09Ij4KCTwvaW1hZ2U+Cjwvc3ZnPg== 32w" onload="window.requestAnimationFrame(function(){if(!(size=getBoundingClientRect().width))return;onload=null;sizes=Math.ceil(size/window.innerWidth*100)+'vw';});" sizes="1px" src="https://www.opensourceagenda.com/storage/media/715/how-to-choose-which-programming-language-to-learn.jpg" width="1920"> </div> </div> <span class="published-at bg-primary text-white position-absolute start-0 bottom-0 px-2 py-1">Dec 11, 2022</span> </a> <div class="md:flex-1 max-w-full py-3"> <a href="https://www.opensourceagenda.com/blog/how-to-choose-which-programming-language-to-learn-first"><h3 class="h4 mb-0 text-black">How to Choose Which Programming Language to Learn First?</h3></a> </div> </div> </div> </div> </div> </div> </div> <div class="d-lg-none mt-4"> <h3>From the blog</h3> <div class="row g-4"> <div class="col-12"> <a href="https://www.opensourceagenda.com/blog/how-to-choose-which-programming-language-to-learn-first" class="d-block position-relative"> <div class="image-container"> <div class="image-inner"> <img loading="lazy" srcset="https://www.opensourceagenda.com/storage/media/715/responsive-images/how-to-choose-which-programming-language-to-learn___media_library_original_1920_1280.jpg 1920w, https://www.opensourceagenda.com/storage/media/715/responsive-images/how-to-choose-which-programming-language-to-learn___media_library_original_1606_1071.jpg 1606w, https://www.opensourceagenda.com/storage/media/715/responsive-images/how-to-choose-which-programming-language-to-learn___media_library_original_1344_896.jpg 1344w, https://www.opensourceagenda.com/storage/media/715/responsive-images/how-to-choose-which-programming-language-to-learn___media_library_original_1124_749.jpg 1124w, https://www.opensourceagenda.com/storage/media/715/responsive-images/how-to-choose-which-programming-language-to-learn___media_library_original_940_627.jpg 940w, https://www.opensourceagenda.com/storage/media/715/responsive-images/how-to-choose-which-programming-language-to-learn___media_library_original_787_525.jpg 787w, https://www.opensourceagenda.com/storage/media/715/responsive-images/how-to-choose-which-programming-language-to-learn___media_library_original_658_439.jpg 658w, https://www.opensourceagenda.com/storage/media/715/responsive-images/how-to-choose-which-programming-language-to-learn___media_library_original_550_367.jpg 550w, https://www.opensourceagenda.com/storage/media/715/responsive-images/how-to-choose-which-programming-language-to-learn___media_library_original_460_307.jpg 460w, data:image/svg+xml;base64,PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbDpzcGFjZT0icHJlc2VydmUiIHg9IjAiCiB5PSIwIiB2aWV3Qm94PSIwIDAgMTkyMCAxMjgwIj4KCTxpbWFnZSB3aWR0aD0iMTkyMCIgaGVpZ2h0PSIxMjgwIiB4bGluazpocmVmPSJkYXRhOmltYWdlL2pwZWc7YmFzZTY0LC85ai80QUFRU2taSlJnQUJBUUVBWUFCZ0FBRC8vZ0E3UTFKRlFWUlBVam9nWjJRdGFuQmxaeUIyTVM0d0lDaDFjMmx1WnlCSlNrY2dTbEJGUnlCMk5qSXBMQ0J4ZFdGc2FYUjVJRDBnT1RBSy85c0FRd0FEQWdJREFnSURBd01EQkFNREJBVUlCUVVFQkFVS0J3Y0dDQXdLREF3TENnc0xEUTRTRUEwT0VRNExDeEFXRUJFVEZCVVZGUXdQRnhnV0ZCZ1NGQlVVLzlzQVF3RURCQVFGQkFVSkJRVUpGQTBMRFJRVUZCUVVGQlFVRkJRVUZCUVVGQlFVRkJRVUZCUVVGQlFVRkJRVUZCUVVGQlFVRkJRVUZCUVVGQlFVRkJRVUZCUVUvOEFBRVFnQUZRQWdBd0VpQUFJUkFRTVJBZi9FQUI4QUFBRUZBUUVCQVFFQkFBQUFBQUFBQUFBQkFnTUVCUVlIQ0FrS0MvL0VBTFVRQUFJQkF3TUNCQU1GQlFRRUFBQUJmUUVDQXdBRUVRVVNJVEZCQmhOUllRY2ljUlF5Z1pHaENDTkNzY0VWVXRId0pETmljb0lKQ2hZWEdCa2FKU1luS0NrcU5EVTJOemc1T2tORVJVWkhTRWxLVTFSVlZsZFlXVnBqWkdWbVoyaHBhbk4wZFhaM2VIbDZnNFNGaG9lSWlZcVNrNVNWbHBlWW1acWlvNlNscHFlb3FhcXlzN1MxdHJlNHVickN3OFRGeHNmSXljclMwOVRWMXRmWTJkcmg0dVBrNWVibjZPbnE4Zkx6OVBYMjkvajUrdi9FQUI4QkFBTUJBUUVCQVFFQkFRRUFBQUFBQUFBQkFnTUVCUVlIQ0FrS0MvL0VBTFVSQUFJQkFnUUVBd1FIQlFRRUFBRUNkd0FCQWdNUkJBVWhNUVlTUVZFSFlYRVRJaktCQ0JSQ2thR3h3UWtqTTFMd0ZXSnkwUW9XSkRUaEpmRVhHQmthSmljb0tTbzFOamM0T1RwRFJFVkdSMGhKU2xOVVZWWlhXRmxhWTJSbFptZG9hV3B6ZEhWMmQzaDVlb0tEaElXR2g0aUppcEtUbEpXV2w1aVptcUtqcEtXbXA2aXBxckt6dExXMnQ3aTV1c0xEeE1YR3g4akp5dExUMU5YVzE5aloydUxqNU9YbTUranA2dkx6OVBYMjkvajUrdi9hQUF3REFRQUNFUU1SQUQ4QStONDFQMlFoUmsxalNRdnZPYTZQVGhITEF5RnRwck12N1FvNXcyYTZKSm5MQ1Naanl4Yk9jMCt5aVdhNFZXYmFEM3BKNFhqUHpVMjN0cExtVUxFQ3plMWN6MFYyZGNidlk2UFNlSkVKR2FYVkpzU01Bb0ZGRmUxeXAwOVVlQ3BOVDBaaVhVclNEbXJmaHk4YXl1dzZxckgzb29yeE1SRk9MUjlCaEcxSk5ILy8yUT09Ij4KCTwvaW1hZ2U+Cjwvc3ZnPg== 32w" onload="window.requestAnimationFrame(function(){if(!(size=getBoundingClientRect().width))return;onload=null;sizes=Math.ceil(size/window.innerWidth*100)+'vw';});" sizes="1px" src="https://www.opensourceagenda.com/storage/media/715/how-to-choose-which-programming-language-to-learn.jpg" width="1920"> </div> </div> <span class="published-at bg-primary text-white position-absolute start-0 bottom-0 px-2 py-1">Dec 11, 2022</span> </a> <div class="md:flex-1 max-w-full py-3"> <a href="https://www.opensourceagenda.com/blog/how-to-choose-which-programming-language-to-learn-first"><h3 class="h4 mb-0 text-black">How to Choose Which Programming Language to Learn First?</h3></a> </div> </div> </div> </div> </div> <footer > <div class="bg-light"> <div class="container py-5"> <div class="text-center mb-5"> <a class="text-center" href="https://www.opensourceagenda.com"> <div class="text-2xl logo mx-auto"> <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 642.6 113.9" style="enable-background:new 0 0 642.6 113.9;" xml:space="preserve"> <g> <path class="color-2" d="M325,37.3c-10.3,0-18.7-7.7-18.7-18.7C306.3,7.7,314.7,0,325,0c10.4,0,18.6,7.7,18.6,18.6C343.6,29.6,335.3,37.3,325,37.3z M325,30.8c6.6,0,11.1-4.8,11.1-12.2c0-7.4-4.5-12.1-11.1-12.1c-6.6,0-11.2,4.6-11.2,12.1C313.8,26.1,318.4,30.8,325,30.8z"/> <path class="color-2" d="M365.9,7.6c7.4,0,13.2,5.8,13.2,14.8c0,9-5.8,15-13.2,15c-4.5,0-7.8-2.2-9.6-4.6v17.9H349V8h7.3v4.2 C358.1,9.8,361.4,7.6,365.9,7.6z M364,14c-3.9,0-7.6,3-7.6,8.5s3.7,8.5,7.6,8.5c4,0,7.7-3.1,7.7-8.6S367.9,14,364,14z"/> <path class="color-2" d="M397.1,37.4c-8.4,0-14.5-5.9-14.5-14.9c0-9.1,6-14.9,14.5-14.9c8.4,0,14.3,5.7,14.3,14.3c0,0.9-0.1,1.9-0.2,2.8H390 c0.4,4.3,3.3,6.7,6.9,6.7c3.1,0,4.9-1.6,5.8-3.5h7.9C409,33.2,404.2,37.4,397.1,37.4z M390,19.8h13.7c-0.1-3.8-3.1-6.2-6.9-6.2 C393.4,13.6,390.6,15.8,390,19.8z"/> <path class="color-2" d="M436.9,21c0-4.6-2.6-7.2-6.4-7.2c-4,0-6.5,2.5-6.5,7.2v16h-7.3V8h7.3v3.6c1.9-2.5,5-4,8.7-4c6.7,0,11.5,4.4,11.5,12.4v17 h-7.3V21z"/> <path class="color-2" d="M476.2,37.3c-7.6,0-13.4-4-13.5-10.9h7.8c0.2,2.9,2.1,4.9,5.5,4.9c3.4,0,5.5-1.8,5.5-4.4c0-7.9-18.8-3.1-18.8-16.3 C462.7,4,468.1,0,475.6,0c7.5,0,12.6,3.8,13.1,10.4h-8c-0.2-2.4-2.1-4.3-5.2-4.3c-2.9-0.1-5,1.3-5,4.3c0,7.3,18.7,3.2,18.7,16.1 C489.1,32.2,484.5,37.3,476.2,37.3z"/> <path class="color-2" d="M508.2,37.4c-8.4,0-14.7-5.9-14.7-14.9c0-9.1,6.5-14.9,14.9-14.9c8.4,0,14.9,5.8,14.9,14.9 C523.3,31.6,516.6,37.4,508.2,37.4z M508.2,31.1c3.9,0,7.6-2.8,7.6-8.6c0-5.8-3.6-8.6-7.5-8.6c-3.9,0-7.4,2.8-7.4,8.6 C501,28.3,504.3,31.1,508.2,31.1z"/> <path class="color-2" d="M556,37h-7.4v-3.7c-1.8,2.5-5,4-8.6,4c-6.7,0-11.6-4.4-11.6-12.3V8h7.3V24c0,4.6,2.6,7.2,6.4,7.2c4,0,6.5-2.5,6.5-7.2V8 h7.4V37z"/> <path class="color-2" d="M570.5,37h-7.3V8h7.3v4.5c1.8-3,4.9-4.9,8.9-4.9v7.7h-1.9c-4.3,0-6.9,1.7-6.9,7.3V37z"/> <path class="color-2" d="M596.7,7.6c7.2,0,12.1,3.8,13.6,10.2h-7.9c-0.8-2.5-2.8-4-5.8-4c-4.1,0-6.8,3.1-6.8,8.7s2.7,8.7,6.8,8.7c3,0,4.9-1.4,5.8-4 h7.9c-1.6,6.2-6.4,10.2-13.6,10.2c-8.4,0-14.3-5.9-14.3-14.9S588.4,7.6,596.7,7.6z"/> <path class="color-2" d="M628.3,37.4c-8.4,0-14.5-5.9-14.5-14.9c0-9.1,6-14.9,14.5-14.9c8.4,0,14.3,5.7,14.3,14.3c0,0.9-0.1,1.9-0.2,2.8h-21.2 c0.4,4.3,3.3,6.7,6.9,6.7c3.1,0,4.9-1.6,5.8-3.5h7.9C640.3,33.2,635.5,37.4,628.3,37.4z M621.3,19.8H635c-0.1-3.8-3.1-6.2-6.9-6.2 C624.6,13.6,621.9,15.8,621.3,19.8z"/> <path class="color-2" d="M330.4,92.7h-14.5l-2.4,6.9h-7.7l13.1-36.5h8.5l13.1,36.5h-7.7L330.4,92.7z M323.2,71.6l-5.3,15.3h10.6L323.2,71.6z"/> <path class="color-2" d="M356.8,70.2c4.5,0,7.8,2.1,9.6,4.6v-4.1h7.4v29.1c0,7.8-4.8,14-14.3,14c-8.1,0-13.8-4.1-14.6-10.7h7.3 c0.7,2.6,3.4,4.3,7.1,4.3c4,0,7.2-2.3,7.2-7.7v-4.5c-1.7,2.5-5,4.8-9.6,4.8c-7.4,0-13.2-6-13.2-15C343.6,76,349.4,70.2,356.8,70.2z M358.7,76.6c-3.9,0-7.6,2.9-7.6,8.4c0,5.5,3.7,8.6,7.6,8.6c4,0,7.7-3,7.7-8.5S362.7,76.6,358.7,76.6z"/> <path class="color-2" d="M393.5,100.1c-8.4,0-14.5-5.9-14.5-14.9c0-9.1,6-14.9,14.5-14.9c8.4,0,14.3,5.7,14.3,14.3c0,0.9-0.1,1.9-0.2,2.8h-21.2 c0.4,4.3,3.3,6.7,6.9,6.7c3.1,0,4.9-1.6,5.8-3.5h7.9C405.4,95.9,400.6,100.1,393.5,100.1z M386.4,82.4h13.7 c-0.1-3.8-3.1-6.2-6.9-6.2C389.8,76.2,387,78.5,386.4,82.4z"/> <path class="color-2" d="M433.3,83.6c0-4.6-2.6-7.2-6.4-7.2c-4,0-6.5,2.5-6.5,7.2v16H413V70.7h7.3v3.6c1.9-2.5,5-4,8.7-4c6.7,0,11.5,4.4,11.5,12.4 v17h-7.3V83.6z"/> <path class="color-2" d="M458.9,70.2c3.8,0,7.5,1.8,9.5,4.5V61h7.4v38.6h-7.4v-4.3c-1.7,2.7-5,4.8-9.5,4.8c-7.4,0-13.2-6-13.2-15 C445.7,76,451.5,70.2,458.9,70.2z M460.8,76.6c-3.9,0-7.6,2.9-7.6,8.4c0,5.5,3.7,8.6,7.6,8.6c4,0,7.7-3,7.7-8.5 S464.8,76.6,460.8,76.6z"/> <path class="color-2" d="M494.3,70.2c4.6,0,7.8,2.2,9.6,4.6v-4.1h7.4v28.9h-7.4v-4.2c-1.7,2.5-5,4.7-9.6,4.7c-7.3,0-13.2-6-13.2-15 C481.1,76,486.9,70.2,494.3,70.2z M496.2,76.6c-3.9,0-7.6,2.9-7.6,8.4c0,5.5,3.7,8.6,7.6,8.6c4,0,7.7-3,7.7-8.5 S500.2,76.6,496.2,76.6z"/> </g> <g> <path class="color-1" d="M49.6,3.1C22.2,3.1,0,23.4,0,52.4c0,29,22.2,49.4,49.6,49.4c27.3,0,49.3-20.5,49.3-49.4 C98.9,23.4,77,3.1,49.6,3.1z M49.6,80.4c-15.7,0-25.5-11.1-25.5-28c0-17.2,9.9-28,25.5-28C65,24.4,75,35.3,75,52.4 C75,69.3,65,80.4,49.6,80.4z"/> <path class="color-1" d="M239.4,3.1h-27.2l-34.9,96.4h24.6l5.8-17h36l5.8,17h24.9L239.4,3.1z M213.9,64.4l11.8-35.3l11.9,35.3H213.9z" /> <path class="color-1" d="M129.7,30.7c0-6,4.3-8.9,9.9-8.8c0.4,0,1.2,0,1.3,0v0h36.4V3.1h-36.4v0c-0.3,0-0.6,0-0.9,0 c-20.2,0-35.2,10.2-35.2,28.4c-0.3,34.2,47.9,24.6,47.9,42.4c0,5.6-4.4,9.1-11.3,9.1c-0.2,0-0.5,0-0.5,0v0h-36.1v18.8h36.4v0 c0.3,0,0.7,0,1,0c22.5,0,35.1-13.4,35.1-29.7C177.4,39.9,129.7,47.5,129.7,30.7z"/> </g> </svg> </div> </a> </div> <div class="row"> <div class="col-6 col-lg"> <il class="list-unstyled"> <li class="pb-2"> <a href="https://www.opensourceagenda.com/tags/python" class="text-black hover:underline">Top Python Projects</a> </li> <li class="pb-2"> <a href="https://www.opensourceagenda.com/tags/java" class="text-black hover:underline">Top Java Projects</a> </li> <li class="pb-2"> <a href="https://www.opensourceagenda.com/tags/javascript" class="text-black hover:underline">Top JS Projects</a> </li> <li class="pb-2"> <a href="https://www.opensourceagenda.com/tags/c-sharp" class="text-black hover:underline">Top C# Projects</a> </li> <li class="pb-2"> <a href="https://www.opensourceagenda.com/tags/c-plus-plus" class="text-black hover:underline">Top C++ Projects</a> </li> </ul> </div> <div class="col-6 col-lg"> <il class="list-unstyled"> <li class="pb-2"> <a href="https://www.opensourceagenda.com/tags/php" class="text-black hover:underline">Top PHP Projects</a> </li> <li class="pb-2"> <a href="https://www.opensourceagenda.com/tags/swift" class="text-black hover:underline">Top Swift Projects</a> </li> <li class="pb-2"> <a href="https://www.opensourceagenda.com/tags/go" class="text-black hover:underline">Top Go Projects</a> </li> <li class="pb-2"> <a href="https://www.opensourceagenda.com/tags/c" class="text-black hover:underline">Top C Projects</a> </li> <li class="pb-2"> <a href="https://www.opensourceagenda.com/tags/ruby" class="text-black hover:underline">Top Ruby Projects</a> </li> </ul> </div> <div class="col-6 col-lg"> <il class="list-unstyled"> <li class="pb-2"> <a href="https://www.opensourceagenda.com/tags/kotlin" class="text-black hover:underline">Top Kotlin Projects</a> </li> <li class="pb-2"> <a href="https://www.opensourceagenda.com/tags/objective-c" class="text-black hover:underline">Top Objective C Projects</a> </li> <li class="pb-2"> <a href="https://www.opensourceagenda.com/tags/scala" class="text-black hover:underline">Top Scala Projects</a> </li> <li class="pb-2"> <a href="https://www.opensourceagenda.com/tags/dart" class="text-black hover:underline">Top Dart Projects</a> </li> <li class="pb-2"> <a href="https://www.opensourceagenda.com/tags/matlab" class="text-black hover:underline">Top Matlab Projects</a> </li> </ul> </div> <div class="col-6 col-lg"> <il class="list-unstyled"> <li class="pb-2"> <a href="https://www.opensourceagenda.com/tags/typescript" class="text-black hover:underline">Top TypeScript Projects</a> </li> <li class="pb-2"> <a href="https://www.opensourceagenda.com/tags/lua" class="text-black hover:underline">Top Lua Projects</a> </li> <li class="pb-2"> <a href="https://www.opensourceagenda.com/tags/r" class="text-black hover:underline">Top R Projects</a> </li> <li class="pb-2"> <a href="https://www.opensourceagenda.com/tags/rust" class="text-black hover:underline">Top Rust Projects</a> </li> <li class="pb-2"> <a href="https://www.opensourceagenda.com/tags/haskell" class="text-black hover:underline">Top Haskell Projects</a> </li> </ul> </div> <div class="col-6 col-lg"> <il class="list-unstyled"> <li class="pb-2"> <a href="https://www.opensourceagenda.com/tags/angular" class="text-black hover:underline">Top Angular Projects</a> </li> <li class="pb-2"> <a href="https://www.opensourceagenda.com/tags/vue" class="text-black hover:underline">Top Vue Projects</a> </li> <li class="pb-2"> <a href="https://www.opensourceagenda.com/tags/react" class="text-black hover:underline">Top React Projects</a> </li> <li class="pb-2"> <a href="https://www.opensourceagenda.com/tags/laravel" class="text-black hover:underline">Top Laravel Projects</a> </li> <li class="pb-2"> <a href="https://www.opensourceagenda.com/tags/django" class="text-black">Top Django Projects</a> </li> </ul> </div> </div> </div> </div> <div class="py-4 copyright bg-white"> <div class="container text-center"> <p class="text-dsrk leading-loose mb-0">Copyright © 2021 Open Source Agenda (OSA). Logo Designed By <a href="https://dribbble.com/adrianPuiu" class="underline" target="_blank">Puiu Adrian</a>.</p> <p class="mb-0"><a href="https://www.opensourceagenda.com/terms-of-service">Terms of Service</a> | <a href="https://www.opensourceagenda.com/privacy-policy">Privacy Policy</a> | <a href="https://www.opensourceagenda.com/cookie-policy">Cookie Policy</a> | <a href="https://www.opensourceagenda.com/advertising">Advetising</a> | <a href="https://forms.gle/u3ctNaCwf9sW5EaGA" target="_blank">Submit a blog post</a></p> </div> </div> </footer> <div class="modal fade h-100 bg-white d-lg-none" id="mobileModal" data-bs-backdrop="static" data-bs-keyboard="true" tabindex="-1" data-bs-focus="false" aria-hidden="true"> <div class="modal-dialog modal-fullscreen"> <div class="modal-content bg-white"> <div class="container py-2"> <nav class="row justify-content-between"> <div class="col-8 col-lg-4 align-self-center"> <a href="https://www.opensourceagenda.com" class="logo header-logo"> <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 642.6 113.9" style="enable-background:new 0 0 642.6 113.9;" xml:space="preserve"> <g> <path class="color-2" d="M325,37.3c-10.3,0-18.7-7.7-18.7-18.7C306.3,7.7,314.7,0,325,0c10.4,0,18.6,7.7,18.6,18.6C343.6,29.6,335.3,37.3,325,37.3z M325,30.8c6.6,0,11.1-4.8,11.1-12.2c0-7.4-4.5-12.1-11.1-12.1c-6.6,0-11.2,4.6-11.2,12.1C313.8,26.1,318.4,30.8,325,30.8z"/> <path class="color-2" d="M365.9,7.6c7.4,0,13.2,5.8,13.2,14.8c0,9-5.8,15-13.2,15c-4.5,0-7.8-2.2-9.6-4.6v17.9H349V8h7.3v4.2 C358.1,9.8,361.4,7.6,365.9,7.6z M364,14c-3.9,0-7.6,3-7.6,8.5s3.7,8.5,7.6,8.5c4,0,7.7-3.1,7.7-8.6S367.9,14,364,14z"/> <path class="color-2" d="M397.1,37.4c-8.4,0-14.5-5.9-14.5-14.9c0-9.1,6-14.9,14.5-14.9c8.4,0,14.3,5.7,14.3,14.3c0,0.9-0.1,1.9-0.2,2.8H390 c0.4,4.3,3.3,6.7,6.9,6.7c3.1,0,4.9-1.6,5.8-3.5h7.9C409,33.2,404.2,37.4,397.1,37.4z M390,19.8h13.7c-0.1-3.8-3.1-6.2-6.9-6.2 C393.4,13.6,390.6,15.8,390,19.8z"/> <path class="color-2" d="M436.9,21c0-4.6-2.6-7.2-6.4-7.2c-4,0-6.5,2.5-6.5,7.2v16h-7.3V8h7.3v3.6c1.9-2.5,5-4,8.7-4c6.7,0,11.5,4.4,11.5,12.4v17 h-7.3V21z"/> <path class="color-2" d="M476.2,37.3c-7.6,0-13.4-4-13.5-10.9h7.8c0.2,2.9,2.1,4.9,5.5,4.9c3.4,0,5.5-1.8,5.5-4.4c0-7.9-18.8-3.1-18.8-16.3 C462.7,4,468.1,0,475.6,0c7.5,0,12.6,3.8,13.1,10.4h-8c-0.2-2.4-2.1-4.3-5.2-4.3c-2.9-0.1-5,1.3-5,4.3c0,7.3,18.7,3.2,18.7,16.1 C489.1,32.2,484.5,37.3,476.2,37.3z"/> <path class="color-2" d="M508.2,37.4c-8.4,0-14.7-5.9-14.7-14.9c0-9.1,6.5-14.9,14.9-14.9c8.4,0,14.9,5.8,14.9,14.9 C523.3,31.6,516.6,37.4,508.2,37.4z M508.2,31.1c3.9,0,7.6-2.8,7.6-8.6c0-5.8-3.6-8.6-7.5-8.6c-3.9,0-7.4,2.8-7.4,8.6 C501,28.3,504.3,31.1,508.2,31.1z"/> <path class="color-2" d="M556,37h-7.4v-3.7c-1.8,2.5-5,4-8.6,4c-6.7,0-11.6-4.4-11.6-12.3V8h7.3V24c0,4.6,2.6,7.2,6.4,7.2c4,0,6.5-2.5,6.5-7.2V8 h7.4V37z"/> <path class="color-2" d="M570.5,37h-7.3V8h7.3v4.5c1.8-3,4.9-4.9,8.9-4.9v7.7h-1.9c-4.3,0-6.9,1.7-6.9,7.3V37z"/> <path class="color-2" d="M596.7,7.6c7.2,0,12.1,3.8,13.6,10.2h-7.9c-0.8-2.5-2.8-4-5.8-4c-4.1,0-6.8,3.1-6.8,8.7s2.7,8.7,6.8,8.7c3,0,4.9-1.4,5.8-4 h7.9c-1.6,6.2-6.4,10.2-13.6,10.2c-8.4,0-14.3-5.9-14.3-14.9S588.4,7.6,596.7,7.6z"/> <path class="color-2" d="M628.3,37.4c-8.4,0-14.5-5.9-14.5-14.9c0-9.1,6-14.9,14.5-14.9c8.4,0,14.3,5.7,14.3,14.3c0,0.9-0.1,1.9-0.2,2.8h-21.2 c0.4,4.3,3.3,6.7,6.9,6.7c3.1,0,4.9-1.6,5.8-3.5h7.9C640.3,33.2,635.5,37.4,628.3,37.4z M621.3,19.8H635c-0.1-3.8-3.1-6.2-6.9-6.2 C624.6,13.6,621.9,15.8,621.3,19.8z"/> <path class="color-2" d="M330.4,92.7h-14.5l-2.4,6.9h-7.7l13.1-36.5h8.5l13.1,36.5h-7.7L330.4,92.7z M323.2,71.6l-5.3,15.3h10.6L323.2,71.6z"/> <path class="color-2" d="M356.8,70.2c4.5,0,7.8,2.1,9.6,4.6v-4.1h7.4v29.1c0,7.8-4.8,14-14.3,14c-8.1,0-13.8-4.1-14.6-10.7h7.3 c0.7,2.6,3.4,4.3,7.1,4.3c4,0,7.2-2.3,7.2-7.7v-4.5c-1.7,2.5-5,4.8-9.6,4.8c-7.4,0-13.2-6-13.2-15C343.6,76,349.4,70.2,356.8,70.2z M358.7,76.6c-3.9,0-7.6,2.9-7.6,8.4c0,5.5,3.7,8.6,7.6,8.6c4,0,7.7-3,7.7-8.5S362.7,76.6,358.7,76.6z"/> <path class="color-2" d="M393.5,100.1c-8.4,0-14.5-5.9-14.5-14.9c0-9.1,6-14.9,14.5-14.9c8.4,0,14.3,5.7,14.3,14.3c0,0.9-0.1,1.9-0.2,2.8h-21.2 c0.4,4.3,3.3,6.7,6.9,6.7c3.1,0,4.9-1.6,5.8-3.5h7.9C405.4,95.9,400.6,100.1,393.5,100.1z M386.4,82.4h13.7 c-0.1-3.8-3.1-6.2-6.9-6.2C389.8,76.2,387,78.5,386.4,82.4z"/> <path class="color-2" d="M433.3,83.6c0-4.6-2.6-7.2-6.4-7.2c-4,0-6.5,2.5-6.5,7.2v16H413V70.7h7.3v3.6c1.9-2.5,5-4,8.7-4c6.7,0,11.5,4.4,11.5,12.4 v17h-7.3V83.6z"/> <path class="color-2" d="M458.9,70.2c3.8,0,7.5,1.8,9.5,4.5V61h7.4v38.6h-7.4v-4.3c-1.7,2.7-5,4.8-9.5,4.8c-7.4,0-13.2-6-13.2-15 C445.7,76,451.5,70.2,458.9,70.2z M460.8,76.6c-3.9,0-7.6,2.9-7.6,8.4c0,5.5,3.7,8.6,7.6,8.6c4,0,7.7-3,7.7-8.5 S464.8,76.6,460.8,76.6z"/> <path class="color-2" d="M494.3,70.2c4.6,0,7.8,2.2,9.6,4.6v-4.1h7.4v28.9h-7.4v-4.2c-1.7,2.5-5,4.7-9.6,4.7c-7.3,0-13.2-6-13.2-15 C481.1,76,486.9,70.2,494.3,70.2z M496.2,76.6c-3.9,0-7.6,2.9-7.6,8.4c0,5.5,3.7,8.6,7.6,8.6c4,0,7.7-3,7.7-8.5 S500.2,76.6,496.2,76.6z"/> </g> <g> <path class="color-1" d="M49.6,3.1C22.2,3.1,0,23.4,0,52.4c0,29,22.2,49.4,49.6,49.4c27.3,0,49.3-20.5,49.3-49.4 C98.9,23.4,77,3.1,49.6,3.1z M49.6,80.4c-15.7,0-25.5-11.1-25.5-28c0-17.2,9.9-28,25.5-28C65,24.4,75,35.3,75,52.4 C75,69.3,65,80.4,49.6,80.4z"/> <path class="color-1" d="M239.4,3.1h-27.2l-34.9,96.4h24.6l5.8-17h36l5.8,17h24.9L239.4,3.1z M213.9,64.4l11.8-35.3l11.9,35.3H213.9z" /> <path class="color-1" d="M129.7,30.7c0-6,4.3-8.9,9.9-8.8c0.4,0,1.2,0,1.3,0v0h36.4V3.1h-36.4v0c-0.3,0-0.6,0-0.9,0 c-20.2,0-35.2,10.2-35.2,28.4c-0.3,34.2,47.9,24.6,47.9,42.4c0,5.6-4.4,9.1-11.3,9.1c-0.2,0-0.5,0-0.5,0v0h-36.1v18.8h36.4v0 c0.3,0,0.7,0,1,0c22.5,0,35.1-13.4,35.1-29.7C177.4,39.9,129.7,47.5,129.7,30.7z"/> </g> </svg> </a> </div> <div class="col-4 col-lg-8 text-end align-self-center"> <button type="button" class="btn btn-light d-inline-block text-end" data-bs-toggle="modal" data-bs-target="#mobileModal"> <i class="fas fa-times"></i> </button> </div> </nav> <div class="d-block mt-3"> <a href="https://www.opensourceagenda.com" class="hover d-block text-black py-2"> Home </a> <a href="https://www.opensourceagenda.com/projects" class="hover d-block text-black py-2"> Projects </a> <a href="https://www.opensourceagenda.com/resources" class="hover d-block text-black py-2"> Resources </a> <a href="https://www.opensourceagenda.com/alternatives" class="hover d-block text-black py-2"> Alternatives </a> <a href="https://www.opensourceagenda.com/blog" class="hover d-block text-black py-2"> Blog </a> <a href="#" data-bs-toggle="modal" data-bs-target="#signInModal" class="hover d-block text-black py-2"> Sign In </a> </div> </div> </div> </div> </div> <div class="modal fade" id="signInModal" tabindex="-1" aria-hidden="true"> <div class="modal-dialog modal-sm modal-dialog-centered"> <div class="modal-content bg-white"> <div class="modal-body"> <h5 class="taxt-dark text-center mb-3">Sign In to OSA</h5> <div class="form-check mb-2"> <input class="form-check-input" type="checkbox" value="yes" id="tosAndPrivacy"> <label class="form-check-label line-highlight position-relative" style="font-size: 10px; top:-2px" for="tosAndPrivacy"> I agree with <a href="https://www.opensourceagenda.com/terms-of-service">Terms of Service</a> and <a href="https://www.opensourceagenda.com/privacy-policy">Privacy Policy</a> </label> </div> <a class="btn btn-light d-block text-start btn-login disabled" href="https://www.opensourceagenda.com/auth/redirect/github"> <i class="fab fa-github me-2"></i> Sign In with Github </a> </div> </div> </div> </div> </div> <script src="/js/app.js?id=d660065a12530b071d5e" defer></script> </body> </html><script>(function(){if (!document.body) return;var js = "window['__CF$cv$params']={r:'88d6f29a5a3c21af',t:'MTcxNzMyNjEwOS45MDEwMDA='};_cpo=document.createElement('script');_cpo.nonce='',_cpo.src='/cdn-cgi/challenge-platform/scripts/jsd/main.js',document.getElementsByTagName('head')[0].appendChild(_cpo);";var _0xh = document.createElement('iframe');_0xh.height = 1;_0xh.width = 1;_0xh.style.position = 'absolute';_0xh.style.top = 0;_0xh.style.left = 0;_0xh.style.border = 'none';_0xh.style.visibility = 'hidden';document.body.appendChild(_0xh);function handler() {var _0xi = _0xh.contentDocument || _0xh.contentWindow.document;if (_0xi) {var _0xj = _0xi.createElement('script');_0xj.innerHTML = js;_0xi.getElementsByTagName('head')[0].appendChild(_0xj);}}if (document.readyState !== 'loading') {handler();} else if (window.addEventListener) {document.addEventListener('DOMContentLoaded', handler);} else {var prev = document.onreadystatechange || function () {};document.onreadystatechange = function (e) {prev(e);if (document.readyState !== 'loading') {document.onreadystatechange = prev;handler();}};}})();</script>