import styles from '@styles/static.module.css' ; import React from 'react' ; export function Loader ( ) { return ( < div className = { styles [ 'loader-wrapper' ] } > < div id = "loader" className = "row justify-content-md-center" > < div className = "col col-auto-md" > < div className = { styles [ 'lds-facebook' ] } id = "inner-loader" > < div /> < div / > < div /> < /div> < p className = "lead" id = "message" style = { { color : 'white' } } /> < /div> < /div> < div className = { styles [ 'text-wrapper' ] } > < h1 > Loading ... < /h1> < /div> < /div>); } export function Header ( ) { return ( < div className = { styles . header } > < p className = { styles . subtitle } > Your files are < span className = { styles . highlight } > not uploaded anywhere . < /span> < /p> < /div>); } export function Footer ( ) { return ( < footer className = "min-w-full" > < div className = "max-w-7xl mx-auto py-12 px-4 sm:px-6 md:flex md:items-center md:justify-between lg:px-8" > < div className = "flex justify-center space-x-6 md:order-2" > < a href = "https://twitter.com/modfydotvideo" className = "text-gray-400 hover:text-gray-100" > < span className = "sr-only" > Twitter < /span> < svg className = "h-6 w-6" fill = "currentColor" viewBox = "0 0 24 24" aria - hidden = "true" > < path d = "M8.29 20.251c7.547 0 11.675-6.253 11.675-11.675 0-.178 0-.355-.012-.53A8.348 8.348 0 0022 5.92a8.19 8.19 0 01-2.357.646 4.118 4.118 0 001.804-2.27 8.224 8.224 0 01-2.605.996 4.107 4.107 0 00-6.993 3.743 11.65 11.65 0 01-8.457-4.287 4.106 4.106 0 001.27 5.477A4.072 4.072 0 012.8 9.713v.052a4.105 4.105 0 003.292 4.022 4.095 4.095 0 01-1.853.07 4.108 4.108 0 003.834 2.85A8.233 8.233 0 012 18.407a11.616 11.616 0 006.29 1.84" / > < /svg> < /a> < a href = "https://github.com/modfy" className = "text-gray-400 hover:text-gray-100" > < span className = "sr-only" > GitHub < /span> < svg className = "h-6 w-6" fill = "currentColor" viewBox = "0 0 24 24" aria - hidden = "true" > < path fillRule = "evenodd" d = "M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clipRule = "evenodd" / > < /svg> < /a> < a href = "https://discord.gg/ffDZnMR" className = "text-gray-400 hover:text-gray-100" > < span className = "sr-only" > Dribbble < /span> < svg id = "Layer_1" xmlns = "http://www.w3.org/2000/svg" viewBox = "0 0 245 240" fill = "currentColor" className = "h-6 w-6" > < path className = "st0" d = "M104.4 103.9c-5.7 0-10.2 5-10.2 11.1s4.6 11.1 10.2 11.1c5.7 0 10.2-5 10.2-11.1.1-6.1-4.5-11.1-10.2-11.1zM140.9 103.9c-5.7 0-10.2 5-10.2 11.1s4.6 11.1 10.2 11.1c5.7 0 10.2-5 10.2-11.1s-4.5-11.1-10.2-11.1z" / > < path className = "st0" d = "M189.5 20h-134C44.2 20 35 29.2 35 40.6v135.2c0 11.4 9.2 20.6 20.5 20.6h113.4l-5.3-18.5 12.8 11.9 12.1 11.2 21.5 19V40.6c0-11.4-9.2-20.6-20.5-20.6zm-38.6 130.6s-3.6-4.3-6.6-8.1c13.1-3.7 18.1-11.9 18.1-11.9-4.1 2.7-8 4.6-11.5 5.9-5 2.1-9.8 3.5-14.5 4.3-9.6 1.8-18.4 1.3-25.9-.1-5.7-1.1-10.6-2.7-14.7-4.3-2.3-.9-4.8-2-7.3-3.4-.3-.2-.6-.3-.9-.5-.2-.1-.3-.2-.4-.3-1.8-1-2.8-1.7-2.8-1.7s4.8 8 17.5 11.8c-3 3.8-6.7 8.3-6.7 8.3-22.1-.7-30.5-15.2-30.5-15.2 0-32.2 14.4-58.3 14.4-58.3 14.4-10.8 28.1-10.5 28.1-10.5l1 1.2c-18 5.2-26.3 13.1-26.3 13.1s2.2-1.2 5.9-2.9c10.7-4.7 19.2-6 22.7-6.3.6-.1 1.1-.2 1.7-.2 6.1-.8 13-1 20.2-.2 9.5 1.1 19.7 3.9 30.1 9.6 0 0-7.9-7.5-24.9-12.7l1.4-1.6s13.7-.3 28.1 10.5c0 0 14.4 26.1 14.4 58.3 0 0-8.5 14.5-30.6 15.2z" / > < /svg> < /a> < /div> < div className = "mt-8 md:mt-0 md:order-1" > < p className = "text-center text-base text-gray-400" > © 2021 Modfy , Inc . All rights reserved . < /p> < /div> < /div> < /footer>); }