Fixing social media post + Making new home page

main
TitanElectrons 1 year ago
parent e1693c37b2
commit f3ed9c52dd

@ -15,7 +15,7 @@
<hr/> <hr/>
<p><a href="../">sf.cu</a> > <a style="color:#ffb86c" href=".">About</a></p> <p><a href="../">sf.cu</a> > <a style="color:#ffb86c" href=".">About</a></p>
<h1><i class="fa fa-user" aria-hidden="true"></i>About</h1> <h1><i class="fa fa-user" aria-hidden="true"></i>About</h1>
<p>My name is Sufyaan. My passion lies in computing and design. In fact, I regularly work for 4-7 hours on end tinkering applications, brainstorming new software ideas and practising brand design. <strong>My end goal is to impact the lives of as many people as possible through software and programming.</strong></p> <p>My name is Sufyaan. My passion lies in computing and design. In fact, I regularly work for 4-7 hours on end tinkering applications, brainstorming new software ideas and practising brand design. <strong>My end goal is to impact the lives of as many people as possible through design and software.</strong></p>
<p>I am currently open for brand design projects for technology companies.</p> <p>I am currently open for brand design projects for technology companies.</p>
@ -36,7 +36,7 @@
<p>I prefer to use products that are not from big corporations like Apple, Google, Microsoft or Meta. This is because of the invasive tracking, data collection and also because of centralization. If I have my email, pictures, videos, documents, notes and calendar on a Google account which gets banned or deleted, I will lose everything. Also, Google has full control over all of the aforementioned things even though they are technically mine. Don't get me wrong, I still use some of their products for specific things. However, I do not have complete dependence on them.</p> <p>I prefer to use products that are not from big corporations like Apple, Google, Microsoft or Meta. This is because of the invasive tracking, data collection and also because of centralization. If I have my email, pictures, videos, documents, notes and calendar on a Google account which gets banned or deleted, I will lose everything. Also, Google has full control over all of the aforementioned things even though they are technically mine. Don't get me wrong, I still use some of their products for specific things. However, I do not have complete dependence on them.</p>
<p>To chat with people, I use many apps. As mentioned before, I use XMPP, Session, Signal and WhatsApp. I also use email and will talk regularly with people as long as they use encryption with their emails.</p> <p>To chat with people, I use many apps. As mentioned before, I use XMPP, Session, Signal and WhatsApp. I also use email and will talk regularly with people as long as they use encryption with their emails.</p>
<h2><i class="fa fa-comments-o" aria-hidden="true"></i>Contact</h2> <h2 id="contact"><i class="fa fa-comments-o" aria-hidden="true"></i>Contact</h2>
<p>If you would like to connect with me, please keep reading.</p> <p>If you would like to connect with me, please keep reading.</p>
<h2>Email</h2> <h2>Email</h2>
<p>My preferred way of communication is email. However, it is incredibly insecure. Therefore, I request you to <a style="color:#bd93f9" href="../email">encrypt your emails</a> with me.</p> <p>My preferred way of communication is email. However, it is incredibly insecure. Therefore, I request you to <a style="color:#bd93f9" href="../email">encrypt your emails</a> with me.</p>
@ -52,7 +52,7 @@
</ul> </ul>
<p>As aforementioned, I am not active on these platforms. I post rarely. This is the only website on which I post regularly.</p> <p>As aforementioned, I am not active on these platforms. I post rarely. This is the only website on which I post regularly.</p>
<p>I post branding and design related content on these websites.</p> <p>I post branding and design related content on these websites.</p>
<h2>Donate</h2> <h2 id="donate">Donate</h2>
<p>If you would like to support my by donating, you can send me some Monero or Bitcoin. <strong>Monero is preferred.</strong></p> <p>If you would like to support my by donating, you can send me some Monero or Bitcoin. <strong>Monero is preferred.</strong></p>
<div style="text-align:center"><img src="donate.webp"></div> <div style="text-align:center"><img src="donate.webp"></div>
<p style="font-size:75%;"><strong>Monero: </strong><code>8A8HeXwULYKWtbujMkGiBYKQPahJCT3ye2N6wCAdEv1L6ipoJjDmfVLKa7XnmE77nGLFmu5dGrL8U4zVGrkDncKEDfkpDEj</code></p> <p style="font-size:75%;"><strong>Monero: </strong><code>8A8HeXwULYKWtbujMkGiBYKQPahJCT3ye2N6wCAdEv1L6ipoJjDmfVLKa7XnmE77nGLFmu5dGrL8U4zVGrkDncKEDfkpDEj</code></p>

File diff suppressed because one or more lines are too long

@ -12,6 +12,11 @@ figcaption{
.posts,h1,h2,h3,ol,p,ul{ .posts,h1,h2,h3,ol,p,ul{
margin-left:8vw margin-left:8vw
} }
.pane{
margin-left:1vw;
}
.nested-list,.posts,h1,ol,ul{ .nested-list,.posts,h1,ol,ul{
margin-top:1vw; margin-top:1vw;
margin-bottom:1vw margin-bottom:1vw
@ -140,12 +145,35 @@ div.desc{
display:table; display:table;
clear:both clear:both
} }
.column {
float: left;
width: 33%;
padding: 10px;
}
.row:after {
content: "";
display: table;
clear: both;
}
.row {
width: 85%;
margin: auto;
}
@media screen and (max-width:600px){ @media screen and (max-width:600px){
.posts,h1,h2,h3,ol,p,ul{ .posts,h1,h2,h3,ol,p,ul{
margin-left:20px; margin-left:20px;
margin-right:20px; margin-right:20px;
margin-top:30px margin-top:30px
} }
.column {
width: 100%;
}
.row {
width: 100%;
}
hr{ hr{
width:93% width:93%
} }

@ -0,0 +1,58 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>(HOMEPAGE) Sufyaan's Webpage</title>
<link rel="icon" type="image/x-icon" href="images/favicon.webp">
<link rel='stylesheet' type='text/css' href="style.css">
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel='stylesheet' href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" media="all">
</head>
<body>
<div style="text-align:center;margin-bottom:-10px"><img src="images/sufyaan.webp"></div>
<hr/>
<p>sf@titan [~/sf.cu]$<code> cat INTRO.md</code></p>
<h1>Greetings, everyone!</h1>
<p>My name is Sufyaan. I am a programmer and brand designer living in Qatar. I know Python and am learning C, JavaScript and shell scripting. I love creating <a style="color:#50fa7b" href="definitions/free-software/">free software</a>. In both programming and designing, I prefer minimalism, following the <a style="color:#50fa7b" href="definitions/unix-philosophy">UNIX Philosophy</a> in software and creating <a style="color:#bd93f9" href="minimal-design/">minimal designs</a>. <strong>My goal is to impact the lives of as many people as possible through design and software.</strong></p>
<div class="row">
<div class="column">
<h2 class="pane">Useful Pages</h2>
<ul class="pane">
<li><a style="color:#bd93f9" href="blog/">Blog Articles</a> [ <a style="color:#bd93f9" href="rss.xml">RSS</a> ]</li>
<li><a style="color:#ffb86c" href="about/">About Me</a> [ <a style="color:#ffb86c" href="about#contact">contact</a> & <a style="color:#ffb86c" href="about#donate">donate</a> ]</li>
<li><a style="color:#ff5555" href="links/">Links To Useful Websites</a></li>
<li><a style="color:#50fa7b" href="definitions/">Definitions To Technical Terms</a></li>
</ul>
</div>
<div class="column">
<h2 class="pane">Latest Posts</h2>
<ul class="pane">
<li><a style="color:#bd93f9" href="fp/"><i class="fa fa-pencil" aria-hidden="true"></i>Writing With Fountain Pens</a></li>
<li><a style="color:#bd93f9" href="minimal-design/"><i class="fa fa-circle-thin" aria-hidden="true"></i>Minimal Design</a></li>
<li><a style="color:#bd93f9" href="vimwiki/"><i class="fa fa-sticky-note" aria-hidden="true"></i>VimWiki Is Terrific</a></li>
<li><a style="color:#bd93f9" href="plaintext/"><i class="fa fa-file-text" aria-hidden="true"></i>Use Plaintext</a></li>
<li><a style="color:#bd93f9" href="torrent/"><i class="fa fa-download" aria-hidden="true"></i>Why You Should Torrent</a></li>
<li><a style="color:#bd93f9" href="blog/"><i class="fa fa-arrow-right" aria-hidden="true"></i>View More</a></li>
</ul>
</div>
<div class="column">
<h2 class="pane">Interesting Stuff</h2>
<ul class="pane">
<li><a style="color:#bd93f9" href="uses/"><i class="fa fa-briefcase" aria-hidden="true"></i>Tools I Use</a></li>
<li><a style="color:#bd93f9" href="browser/"><i class="fa fa-firefox" aria-hidden="true"></i>Browser Setup</a></li>
<li><a style="color:#bd93f9" href="kpst/"><i class="fa fa-key" aria-hidden="true"></i>Password Manager Setup</a></li>
<li><a style="color:#bd93f9" href="vimwiki/"><i class="fa fa-sticky-note" aria-hidden="true"></i>Notes Setup</a></li>
<li><a style="color:#bd93f9" href="sm/"><i class="fa fa-clock-o" aria-hidden="true"></i>Quit Social Media</a></li>
</ul>
</div>
</div>
<hr/>
<footer>
<p class="footer-text"><a style="color:#bd93f9" href="blog">blog</a> - <a style="color:#ffb86c" href="about">about</a> - <a style="color:#f1fa8c" href="portfolio">portfolio</a> - <a style="color:#ff5555" href="links">links</a></p>
<p class="footer-text" style="font-size:80%"><a href=".">sufyaan.cyou</a></p>
<p class="footer-text" style="font-size:65%"><a style="color:#aaaaaa" href="sitemap">Site Map</a></p>
</footer>

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>(POST) Tools I Use</title>
<link rel="icon" type="image/x-icon" href="../images/favicon.webp">
<link rel='stylesheet' type='text/css' href="../style.css"> <link rel='stylesheet' href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" media="all">
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<a href="../"><div style="text-align:center"><img src="../images/sufyaan.webp"></div></a>
<hr/><p><a href="../">sf.cu</a> > <a style="color:#bd93f9" href="../blog/">Blog</a> > <a style="color:#bd93f9" href=".">Tools I Use</a></p>
<h1><i class="fa fa-briefcase" aria-hidden="true"></i>Tools I Use</h1>
<p style="font-size:110%"><strong><i class="fa fa-calendar" aria-hidden="true"></i>30 July 2023</strong></p><p style="font-size:110%"><i class="fa fa-clock-o" aria-hidden="true"></i><strong>2 min</strong><p style="font-size:110%"><i class="fa fa-arrow-right" aria-hidden="true"></i></strong><a style="color:#ff79c6" href="../blog/technology/"><i class="fa fa-code" aria-hidden="true"></i>Technology</a></p>
<p>Post to be released soon!</p>
<p><a href="mailto:sufyaan@counterhawks.com?subject=Tools%20I%20Use">>>> Reply To Me</a></p>
<p style="text-align:center;"><a href="../minimal-design/" style="color:#bd93f9"><i class="fa fa-angle-left" aria-hidden="true"></i>Previous Post</a> - <a style="color:#bd93f9" href="../terminal/">First Post</a> <i style="color:#bd93f9" class="fa fa-repeat" aria-hidden="true"></i></p>
<hr/>
<footer>
<p class="footer-text"><a style="color:#bd93f9" href="../blog">blog</a> - <a style="color:#ffb86c" href="../about">about</a> - <a style="color:#f1fa8c" href="../portfolio">portfolio</a> - <a style="color:#ff5555" href="../links">links</a></p>
<p class="footer-text" style="font-size:80%"><a href="../">sufyaan.cyou</a></p><p class="footer-text" style="font-size:65%"><a style="color:#aaaaaa" href="../sitemap">Site Map</a></p>
</footer>
Loading…
Cancel
Save