ayham
/
tilde
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

new layout for website

This commit is contained in:
ayham 2021-12-30 05:48:01 +03:00
parent 386eb6d03b
commit b00349e388
Signed by: ayham
GPG Key ID: EAB7F5A9DF503678
32 changed files with 554 additions and 425 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
articles/a-minimal-linux-display-manager.md
View File

@ -57,3 +57,5 @@ That's it! For adding extra entries:
- adding the extra option to the 'cases' clause appropriately.
Enjoy!
;Tags: LINUX GUIDE

7
blog/@ANDROID.html
View File

@ -14,9 +14,9 @@
<center>
<h1 style=font-size:xxx-large>Articles</h1>
</center>
<div id=partial_header></div>
<main>
<div id=partial_header></div>
<div class=content>
<li><a href="hardening-the-one-macro.html">2021/11/30 Hardening the Moto One Macro</a></li></ul>
<center>
Unique Users:
@ -25,7 +25,8 @@
alt="Hit Counter by Digits" border="0" />
</a>
</center>
</main>
</div>
<div align=center id=partial_footer></div>
</main>
</body>
</html>

9
blog/@GUIDE.html
View File

@ -14,10 +14,10 @@
<center>
<h1 style=font-size:xxx-large>Articles</h1>
</center>
<div id=partial_header></div>
<main>
<li><a href="true-full-disk-encryption.html">2021/12/10 True Full Disk Encryption On Linux</a></li><li><a href="hardening-the-one-macro.html">2021/11/30 Hardening the Moto One Macro</a></li><li><a href="blogit-to-blog-it.html">2021/11/26 blogit: A Complete Guide</a></li></ul>
<div id=partial_header></div>
<div class=content>
<li><a href="a-minimal-linux-display-manager.html">2021/12/28 A Minimal Linux Display Manager</a></li><li><a href="true-full-disk-encryption.html">2021/12/10 True Full Disk Encryption On Linux</a></li><li><a href="hardening-the-one-macro.html">2021/11/30 Hardening the Moto One Macro</a></li><li><a href="blogit-to-blog-it.html">2021/11/26 blogit: A Complete Guide</a></li></ul>
<center>
Unique Users:
<a href="https://www.digits.net" target="_blank" rel="noopener">
@ -25,7 +25,8 @@
alt="Hit Counter by Digits" border="0" />
</a>
</center>
</main>
</div>
<div align=center id=partial_footer></div>
</main>
</body>
</html>

9
blog/@LINUX.html
View File

@ -14,10 +14,10 @@
<center>
<h1 style=font-size:xxx-large>Articles</h1>
</center>
<div id=partial_header></div>
<main>
<li><a href="true-full-disk-encryption.html">2021/12/10 True Full Disk Encryption On Linux</a></li></ul>
<div id=partial_header></div>
<div class=content>
<li><a href="a-minimal-linux-display-manager.html">2021/12/28 A Minimal Linux Display Manager</a></li><li><a href="true-full-disk-encryption.html">2021/12/10 True Full Disk Encryption On Linux</a></li></ul>
<center>
Unique Users:
<a href="https://www.digits.net" target="_blank" rel="noopener">
@ -25,7 +25,8 @@
alt="Hit Counter by Digits" border="0" />
</a>
</center>
</main>
</div>
<div align=center id=partial_footer></div>
</main>
</body>
</html>

7
blog/@SECURITY.html
View File

@ -14,9 +14,9 @@
<center>
<h1 style=font-size:xxx-large>Articles</h1>
</center>
<div id=partial_header></div>
<main>
<div id=partial_header></div>
<div class=content>
<li><a href="true-full-disk-encryption.html">2021/12/10 True Full Disk Encryption On Linux</a></li><li><a href="hardening-the-one-macro.html">2021/11/30 Hardening the Moto One Macro</a></li></ul>
<center>
Unique Users:
@ -25,7 +25,8 @@
alt="Hit Counter by Digits" border="0" />
</a>
</center>
</main>
</div>
<div align=center id=partial_footer></div>
</main>
</body>
</html>

7
blog/@UPDATE.html
View File

@ -14,9 +14,9 @@
<center>
<h1 style=font-size:xxx-large>Articles</h1>
</center>
<div id=partial_header></div>
<main>
<div id=partial_header></div>
<div class=content>
<li><a href="install-ayhamxyz-pwa.html">2021/12/17 My site is Now Installable as a Web App!</a></li><li><a href="first-article.html">2021/10/01 The Beginning of a series!</a></li></ul>
<center>
Unique Users:
@ -25,7 +25,8 @@
alt="Hit Counter by Digits" border="0" />
</a>
</center>
</main>
</div>
<div align=center id=partial_footer></div>
</main>
</body>
</html>

7
blog/@WEBSITE.html
View File

@ -14,9 +14,9 @@
<center>
<h1 style=font-size:xxx-large>Articles</h1>
</center>
<div id=partial_header></div>
<main>
<div id=partial_header></div>
<div class=content>
<li><a href="blogit-to-blog-it.html">2021/11/26 blogit: A Complete Guide</a></li></ul>
<center>
Unique Users:
@ -25,7 +25,8 @@
alt="Hit Counter by Digits" border="0" />
</a>
</center>
</main>
</div>
<div align=center id=partial_footer></div>
</main>
</body>
</html>

6
blog/a-minimal-linux-display-manager.html
View File

@ -14,8 +14,9 @@
<center>
<h1 style=font-size:xxx-large>A Minimal Linux Display Manager</h1>
</center>
<div id=partial_header></div>
<main>
<div id=partial_header></div>
<div class=content>
<p>There is this itch that tiling window manager users feel. Whether it is caused
by surfing the world of reddit or the want for change, it might be useful to
have a way to easily switch between window managers. This article shows how to
@ -83,7 +84,8 @@ done
alt="Hit Counter by Digits" border="0" />
</a>
</center>
</main>
</div>
<div align=center id=partial_footer></div>
</main>
</body>
</html>

4
blog/atom.xml
View File

@ -2,7 +2,7 @@
<feed xmlns="http://www.w3.org/2005/Atom" xml:lang="en">
<title type="text">ayham's blog</title>
<subtitle type="text">probably interesting stuff</subtitle>
<updated>2021-12-29T20:13:48Z</updated>
<updated>2021-12-29T21:45:46Z</updated>
<link rel="alternate" type="text/html" href="articles.ayham.xyz"/>
<id>articles.ayham.xyz/atom.xml</id>
<link rel="self" type="application/atom+xml" href="articles.ayham.xyz/atom.xml"/>
@ -11,7 +11,7 @@
<link rel="alternate" type="text/html" href="articles.ayham.xyz/a-minimal-linux-display-manager.html"/>
<id>articles.ayham.xyz/a-minimal-linux-display-manager.html</id>
<published>2021-12-28T20:45:00Z</published>
<updated>2021-12-28T20:45:00Z</updated>
<updated>2021-12-29T20:14:13Z</updated>
<author><name>ayham</name></author>
<summary type="text">There is this itch that tiling window manager users feel. Whether it is caused
by surfing the world of reddit or the want for change, it might be useful to

6
blog/blogit-to-blog-it.html
View File

@ -14,8 +14,9 @@
<center>
<h1 style=font-size:xxx-large>blogit: A Complete Guide</h1>
</center>
<div id=partial_header></div>
<main>
<div id=partial_header></div>
<div class=content>
<p>Running a personal website should be an easy task. Unfortunately, a big
hindrance is that there aren&rsquo;t many &ldquo;suckless&rdquo; blogging system.
<a href="https://pedantic.software/git/blogit">blogit</a> is the closest in terms of
@ -200,7 +201,8 @@ Want to contact me? <a href="https://contact.ayham.xyz">Here.</a></p>
alt="Hit Counter by Digits" border="0" />
</a>
</center>
</main>
</div>
<div align=center id=partial_footer></div>
</main>
</body>
</html>

6
blog/first-article.html
View File

@ -14,8 +14,9 @@
<center>
<h1 style=font-size:xxx-large>The Beginning of a series!</h1>
</center>
<div id=partial_header></div>
<main>
<div id=partial_header></div>
<div class=content>
<p>This would be the beginning of my all-new article series. I would be writing
about software I make and use, with the occasional school essay turned article.</p>
@ -27,7 +28,8 @@ about software I make and use, with the occasional school essay turned article.<
alt="Hit Counter by Digits" border="0" />
</a>
</center>
</main>
</div>
<div align=center id=partial_footer></div>
</main>
</body>
</html>

6
blog/hardening-the-one-macro.html
View File

@ -14,8 +14,9 @@
<center>
<h1 style=font-size:xxx-large>Hardening the Moto One Macro</h1>
</center>
<div id=partial_header></div>
<main>
<div id=partial_header></div>
<div class=content>
<p>The Motorola One Macro is a mid-range phone, with decent &ldquo;openness&rdquo; which allows
basic hardening modification. The phone has the follow specifications:</p>
@ -224,7 +225,8 @@ I encourage you to flash your Moto One Macro with a treble FOSS build.</p>
alt="Hit Counter by Digits" border="0" />
</a>
</center>
</main>
</div>
<div align=center id=partial_footer></div>
</main>
</body>
</html>

7
blog/index.html
View File

@ -14,9 +14,9 @@
<center>
<h1 style=font-size:xxx-large>Articles</h1>
</center>
<div id=partial_header></div>
<main>
<div id=partial_header></div>
<div class=content>
<p>Tags:<a href="@ANDROID.html">ANDROID</a>, <a href="@GUIDE.html">GUIDE</a>, <a href="@LINUX.html">LINUX</a>, <a href="@SECURITY.html">SECURITY</a>, <a href="@UPDATE.html">UPDATE</a>, <a href="@WEBSITE.html">WEBSITE</a></p><li><a href="a-minimal-linux-display-manager.html">2021/12/28 A Minimal Linux Display Manager</a></li><li><a href="install-ayhamxyz-pwa.html">2021/12/17 My site is Now Installable as a Web App!</a></li><li><a href="true-full-disk-encryption.html">2021/12/10 True Full Disk Encryption On Linux</a></li><li><a href="hardening-the-one-macro.html">2021/11/30 Hardening the Moto One Macro</a></li><li><a href="blogit-to-blog-it.html">2021/11/26 blogit: A Complete Guide</a></li><li><a href="first-article.html">2021/10/01 The Beginning of a series!</a></li></ul>
<center>
@ -26,7 +26,8 @@
alt="Hit Counter by Digits" border="0" />
</a>
</center>
</main>
</div>
<div align=center id=partial_footer></div>
</main>
</body>
</html>

6
blog/install-ayhamxyz-pwa.html
View File

@ -14,8 +14,9 @@
<center>
<h1 style=font-size:xxx-large>My site is Now Installable as a Web App!</h1>
</center>
<div id=partial_header></div>
<main>
<div id=partial_header></div>
<div class=content>
<p>Recently, I have updated my site to offer a Web App option for viewing. You can
install PWA Web Apps on chromium-based browsers, by first accessing
<a href="https://ayham.xyz">ayham.xyz</a> and then click on the install prompt button on the far-right
@ -29,7 +30,8 @@ edge of the URL bar.</p>
alt="Hit Counter by Digits" border="0" />
</a>
</center>
</main>
</div>
<div align=center id=partial_footer></div>
</main>
</body>
</html>

37
blog/partials/header.htm
View File

@ -1,49 +1,66 @@
<!DOCTYPE html>
<html>
<body>
<header id=partial_header>
<header id=partial_header
style=position:sticky;display:content;overflow:hidden>
<nav>
<ul>
<li>
<a href="https://ayham.xyz">
🏠 Home
<nobr>
<a class="viewer" href="https://ayham.xyz">🏠
<i class="hidden">Home</i>
</a>
</nobr>
</li>
<li>
<nobr>
<a href="https://store.ayham.xyz">
🏪 Store
🏪 <i class="hidden">Store</i>
</a>
</nobr>
</li>
<li>
<nobr>
<a href="https://tildegit.org/ayham">
<img width=32 height=32 src="https://ayham.xyz/pix/git.svg" alt="git logo">
Git
<i class="hidden">Git</i>
</a>
</nobr>
</li>
<li>
<nobr>
<a href="https://ayham.xyz/proj.htm">
⚙️ Projects
⚙️ <i class="hidden">Projects</i>
</a>
</nobr>
</li>
<li>
<nobr>
<a href="https://ayham.xyz/blog/index.html">
📜 Articles
📜 <i class="hidden">Articles</i>
</a>
</nobr>
</li>
<li>
<nobr>
<a href="https://ayham.xyz/setup.htm">
🖥 Setup
💻 <i class="hidden">Setup</i>
</a>
</nobr>
</li>
<li>
<nobr>
<a href="https://ayham.xyz/books.htm">
📚 Library
📚 <i class="hidden">Library</i>
</a>
</nobr>
</li>
<li>
<nobr>
<a href="https://ayham.xyz/contact.htm">
📧 Contact
📧 <i class="hidden">Contact</i>
</a>
</nobr>
</li>
</ul>
</nav>

51
blog/style.css
View File

@ -1,5 +1,5 @@
:root {
--genwidth: 850px ;
--genwidth: 40em;
--navwidth: 175px ;
--fg: #ddd ;
--altfg: #ccc ;
@ -22,7 +22,7 @@ body {
body h1 {
color: var(--fg);
}
main {
.content {
margin: auto;
color: var(--fg);
background: var(--bg);
@ -30,16 +30,29 @@ main {
border: dashed 1px var(--bordercolor);
border-radius: 5px;
}
main {
padding: 1em;
padding-top: 0;
display: block;
overflow:hidden;
margin:auto;
}
#partial_header {
float:right;
display:block;
}
nav,footer {
text-align: center ;
font-variant: small-caps ;
clear: both ;
background: var(--altbg) ;
border-radius: 5px ;
margin: auto ;
border: dashed 1px var(--bordercolor) ;
max-width: var(--genwidth);
}
nav {
margin-left: 5px;
}
footer {
color: var(--altfg) ;
margin-top: 1em ;
@ -49,12 +62,28 @@ nav,header {
max-width: var(--genwidth) ;
}
nav li,footer li {
display: inline-block ;
transition:all 1s ease-in-out;
display: block ;
list-style: none ;
background: var(--bg) ;
border-radius: 10px ;
padding: .5em ;
max-width: 7em ;
}
nav {
width: 4em;
}
.hidden {
display: none;
}
nav ul li:hover .hidden {
display: inline-block;
}
nav ul li:hover {
margin-right: -5em;
}
nav ul {
align-items: flex-start;
display: flex-container;
}
nav ul, footer ul, #taglist {
@ -131,20 +160,10 @@ td {
nav {
float: left ;
vertical-align: middle ;
width: 175px ;
position: fixed ;
text-align: left ;
font-size: large ;
}
nav::before {
content: "Links" ;
text-align: center ;
display: block ;
font-size: large ;
color: violet ;
text-decoration: underline ;
margin-top: .5em ;
}
nav li {
display: block ;
text-align: center ;
@ -177,7 +196,7 @@ ul.images li img {
padding: 2.5px;
}
@media (min-width: 55em) {
@media (min-width: 40em) {
.resright, .disappear {
display: block ;
float: right;

6
blog/true-full-disk-encryption.html
View File

@ -14,8 +14,9 @@
<center>
<h1 style=font-size:xxx-large>True Full Disk Encryption On Linux</h1>
</center>
<div id=partial_header></div>
<main>
<div id=partial_header></div>
<div class=content>
<p>My friends laugh at me when they are told that I have to put in 4 passwords
with ~18 characters each to login into my computer. I laugh back at them,
wishing them enjoyment with Ads in the start-menu.</p>
@ -168,7 +169,8 @@ converting all of your machines!</p>
alt="Hit Counter by Digits" border="0" />
</a>
</center>
</main>
</div>
<div align=center id=partial_footer></div>
</main>
</body>
</html>

18
books.htm
View File

@ -5,21 +5,16 @@
<link rel="stylesheet" href="style.css">
<link rel="shortcut icon" type="image/jpg" href="pix/pfp.ico"/>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script
src="//ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"
type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#partial_header").load("partials/header.htm");
$("#partial_footer").load("partials/footer.htm"); });
</script>
<script type="text/javascript" src="js/partials.js" async></script>
</head>
<body>
<center>
<h1 style=font-size:xxx-large>Books</h1>
</center>
<div id=partial_header></div>
<main>
<div id=partial_header></div>
<div class=content>
<p>List of books I read, not a recommendation list.</p>
<ul>
<li><a
@ -56,9 +51,10 @@
</ul>
<h4>Any recommendations?</h4>
<p>If you have any books you would like to recommend,
contact me <a href="https://contact.ayham.xyz">here</a>.</br>
contact me <a href="https://contact.ayham.xyz">here</a>.
(P.S. "red-pilled" books are especially welcomed).</p>
</main>
</div>
<div id=partial_footer></div>
</main>
</body>
</html>

14
contact.htm
View File

@ -6,19 +6,16 @@
<link rel="shortcut icon" type="image/jpg" href="pix/pfp.ico"/>
<link rel='alternate' type='application/rss+xml' title='ayham RSS' href='/blog/rss.xml'>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#partial_header").load("partials/header.htm");
$("#partial_footer").load("partials/footer.htm"); });
</script>
<script type="text/javascript" src="js/partials.js" async></script>
</head>
<body>
<center>
<h1 style=font-size:xxx-large>Contact</h1>
</center>
<div id="partial_header"></div>
<main>
<div id="partial_header"></div>
<div class=content>
<p>I don't own any account on any social media platforms.</p>
<p>My monero wallet is linked with ayham.xyz and my main email.
</br>
@ -35,7 +32,8 @@
</p>
<p>If you would like to recommend a platform for me to use, feel
free to email me!</p>
</main>
</div>
<div id="partial_footer"></div>
</main>
</body>
</html>

14
contact/index.html
View File

@ -6,19 +6,16 @@
<link rel="shortcut icon" type="image/jpg" href="pix/pfp.ico"/>
<link rel='alternate' type='application/rss+xml' title='ayham RSS' href='/blog/rss.xml'>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#partial_header").load("partials/header.htm");
$("#partial_footer").load("partials/footer.htm"); });
</script>
<script type="text/javascript" src="js/partials.js" async></script>
</head>
<body>
<center>
<h1 style=font-size:xxx-large>Contact</h1>
</center>
<div id="partial_header"></div>
<main>
<div id="partial_header"></div>
<div class=content>
<p>I don't own any account on any social media platforms.</p>
<p>My monero wallet is linked with ayham.xyz and my main email.
</br>
@ -35,7 +32,8 @@
</p>
<p>If you would like to recommend a platform for me to use, feel
free to email me!</p>
</main>
</div>
<div id="partial_footer"></div>
</main>
</body>
</html>

6
index.htm
View File

@ -25,8 +25,9 @@
<center>
<h1 style=font-size:xxx-large>Ayham's Online Webpage</h1>
</center>
<div id=partial_header></div>
<main>
<div id=partial_header></div>
<div class=content>
<img class=resright alt="pfp" title="pfp" src="pix/pfp/pfp.webp">
<h2>Hello! Welcome!</h2>
@ -70,8 +71,9 @@ https://blog.ayham.xyz/rss.xml</code></pre>
<a href="ayham.xyz">
<img width=88 height=31 src="pix/webpins/ayhamxyz.gif" alt="ayham.xyz webpin"></a>
</center>
</main>
</div>
<div id=partial_footer></div>
</main>
<script src="js/main.js"></script>
</body>
</html>

37
partials/header.htm
View File

@ -1,49 +1,66 @@
<!DOCTYPE html>
<html>
<body>
<header id=partial_header>
<header id=partial_header
style=position:sticky;display:content;overflow:hidden>
<nav>
<ul>
<li>
<a href="https://ayham.xyz">
🏠 Home
<nobr>
<a class="viewer" href="https://ayham.xyz">🏠
<i class="hidden">Home</i>
</a>
</nobr>
</li>
<li>
<nobr>
<a href="https://store.ayham.xyz">
🏪 Store
🏪 <i class="hidden">Store</i>
</a>
</nobr>
</li>
<li>
<nobr>
<a href="https://tildegit.org/ayham">
<img width=32 height=32 src="https://ayham.xyz/pix/git.svg" alt="git logo">
Git
<i class="hidden">Git</i>
</a>
</nobr>
</li>
<li>
<nobr>
<a href="https://ayham.xyz/proj.htm">
⚙️ Projects
⚙️ <i class="hidden">Projects</i>
</a>
</nobr>
</li>
<li>
<nobr>
<a href="https://ayham.xyz/blog/index.html">
📜 Articles
📜 <i class="hidden">Articles</i>
</a>
</nobr>
</li>
<li>
<nobr>
<a href="https://ayham.xyz/setup.htm">
🖥 Setup
💻 <i class="hidden">Setup</i>
</a>
</nobr>
</li>
<li>
<nobr>
<a href="https://ayham.xyz/books.htm">
📚 Library
📚 <i class="hidden">Library</i>
</a>
</nobr>
</li>
<li>
<nobr>
<a href="https://ayham.xyz/contact.htm">
📧 Contact
📧 <i class="hidden">Contact</i>
</a>
</nobr>
</li>
</ul>
</nav>

6
proj.htm
View File

@ -13,8 +13,9 @@
<center>
<h1 style=font-size:xxx-large>Projects</h1>
</center>
<div id=partial_header></div>
<main>
<div id=partial_header></div>
<div class=content>
<section>
<h3 id=proj_main><a href=#proj_main>cd proj/</a></h3>
<p>This is a list of projects I work on. An image, development status,
@ -114,7 +115,8 @@
it so small that the whole thing fits in one file! Eliminating the need to manually organize or clean up your downloads folder!
</p>
</section>
</main>
</div>
<div id=partial_footer></div>
</main>
</body>
</html>

14
setup.htm
View File

@ -5,19 +5,16 @@
<link rel="stylesheet" href="style.css">
<link rel="shortcut icon" type="image/jpg" href="pix/pfp.ico"/>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#partial_header").load("partials/header.htm");
$("#partial_footer").load("partials/footer.htm"); });
</script>
<script type="text/javascript" src="js/partials.js" async></script>
</head>
<body>
<center>
<h1 style=font-size:xxx-large>Setup</h1>
</center>
<div id="partial_header"></div>
<main>
<div id="partial_header"></div>
<div class=content>
<section>
<h3>Introduction</h3>
<p>This is how I run my desktop. It is the only way any personal
@ -89,7 +86,8 @@
style="max-width:100%;">
</p>
</section>
</main>
</div>
<div id="partial_footer"></div>
</main>
</body>
</html>

6
store/index.html
View File

@ -14,8 +14,9 @@
<center>
<h1 style=font-size:xxx-large>Welcome to Ayham's Online Store!</h1>
</center>
<div id=partial_header></div>
<main>
<div id=partial_header></div>
<div class=content>
<section>
<p>This is my store where you can find information all about
apps I sell.</p>
@ -117,7 +118,8 @@
<img src="https://counter.digits.net/?counter={e52fc122-b50b-2a64-b9f8-dd351e704db9}&template=simple"
alt="Hit Counter by Digits" border="0" /></a>
</center>
</main>
</div>
<div id=partial_footer></div>
</main>
</body>
</html>

37
store/partials/header.htm
View File

@ -1,49 +1,66 @@
<!DOCTYPE html>
<html>
<body>
<header id=partial_header>
<header id=partial_header
style=position:sticky;display:content;overflow:hidden>
<nav>
<ul>
<li>
<a href="https://ayham.xyz">
🏠 Home
<nobr>
<a class="viewer" href="https://ayham.xyz">🏠
<i class="hidden">Home</i>
</a>
</nobr>
</li>
<li>
<nobr>
<a href="https://store.ayham.xyz">
🏪 Store
🏪 <i class="hidden">Store</i>
</a>
</nobr>
</li>
<li>
<nobr>
<a href="https://tildegit.org/ayham">
<img width=32 height=32 src="https://ayham.xyz/pix/git.svg" alt="git logo">
Git
<i class="hidden">Git</i>
</a>
</nobr>
</li>
<li>
<nobr>
<a href="https://ayham.xyz/proj.htm">
⚙️ Projects
⚙️ <i class="hidden">Projects</i>
</a>
</nobr>
</li>
<li>
<nobr>
<a href="https://ayham.xyz/blog/index.html">
📜 Articles
📜 <i class="hidden">Articles</i>
</a>
</nobr>
</li>
<li>
<nobr>
<a href="https://ayham.xyz/setup.htm">
🖥 Setup
💻 <i class="hidden">Setup</i>
</a>
</nobr>
</li>
<li>
<nobr>
<a href="https://ayham.xyz/books.htm">
📚 Library
📚 <i class="hidden">Library</i>
</a>
</nobr>
</li>
<li>
<nobr>
<a href="https://ayham.xyz/contact.htm">
📧 Contact
📧 <i class="hidden">Contact</i>
</a>
</nobr>
</li>
</ul>
</nav>

51
store/style.css
View File

@ -1,5 +1,5 @@
:root {
--genwidth: 850px ;
--genwidth: 40em;
--navwidth: 175px ;
--fg: #ddd ;
--altfg: #ccc ;
@ -22,7 +22,7 @@ body {
body h1 {
color: var(--fg);
}
main {
.content {
margin: auto;
color: var(--fg);
background: var(--bg);
@ -30,16 +30,29 @@ main {
border: dashed 1px var(--bordercolor);
border-radius: 5px;
}
main {
padding: 1em;
padding-top: 0;
display: block;
overflow:hidden;
margin:auto;
}
#partial_header {
float:right;
display:block;
}
nav,footer {
text-align: center ;
font-variant: small-caps ;
clear: both ;
background: var(--altbg) ;
border-radius: 5px ;
margin: auto ;
border: dashed 1px var(--bordercolor) ;
max-width: var(--genwidth);
}
nav {
margin-left: 5px;
}
footer {
color: var(--altfg) ;
margin-top: 1em ;
@ -49,12 +62,28 @@ nav,header {
max-width: var(--genwidth) ;
}
nav li,footer li {
display: inline-block ;
transition:all 1s ease-in-out;
display: block ;
list-style: none ;
background: var(--bg) ;
border-radius: 10px ;
padding: .5em ;
max-width: 7em ;
}
nav {
width: 4em;
}
.hidden {
display: none;
}
nav ul li:hover .hidden {
display: inline-block;
}
nav ul li:hover {
margin-right: -5em;
}
nav ul {
align-items: flex-start;
display: flex-container;
}
nav ul, footer ul, #taglist {
@ -131,20 +160,10 @@ td {
nav {
float: left ;
vertical-align: middle ;
width: 175px ;
position: fixed ;
text-align: left ;
font-size: large ;
}
nav::before {
content: "Links" ;
text-align: center ;
display: block ;
font-size: large ;
color: violet ;
text-decoration: underline ;
margin-top: .5em ;
}
nav li {
display: block ;
text-align: center ;
@ -177,7 +196,7 @@ ul.images li img {
padding: 2.5px;
}
@media (min-width: 55em) {
@media (min-width: 40em) {
.resright, .disappear {
display: block ;
float: right;

51
style.css
View File

@ -1,5 +1,5 @@
:root {
--genwidth: 850px ;
--genwidth: 40em;
--navwidth: 175px ;
--fg: #ddd ;
--altfg: #ccc ;
@ -22,7 +22,7 @@ body {
body h1 {
color: var(--fg);
}
main {
.content {
margin: auto;
color: var(--fg);
background: var(--bg);
@ -30,16 +30,29 @@ main {
border: dashed 1px var(--bordercolor);
border-radius: 5px;
}
main {
padding: 1em;
padding-top: 0;
display: block;
overflow:hidden;
margin:auto;
}
#partial_header {
float:right;
display:block;
}
nav,footer {
text-align: center ;
font-variant: small-caps ;
clear: both ;
background: var(--altbg) ;
border-radius: 5px ;
margin: auto ;
border: dashed 1px var(--bordercolor) ;
max-width: var(--genwidth);
}
nav {
margin-left: 5px;
}
footer {
color: var(--altfg) ;
margin-top: 1em ;
@ -49,12 +62,28 @@ nav,header {
max-width: var(--genwidth) ;
}
nav li,footer li {
display: inline-block ;
transition:all 1s ease-in-out;
display: block ;
list-style: none ;
background: var(--bg) ;
border-radius: 10px ;
padding: .5em ;
max-width: 7em ;
}
nav {
width: 4em;
}
.hidden {
display: none;
}
nav ul li:hover .hidden {
display: inline-block;
}
nav ul li:hover {
margin-right: -5em;
}
nav ul {
align-items: flex-start;
display: flex-container;
}
nav ul, footer ul, #taglist {
@ -131,20 +160,10 @@ td {
nav {
float: left ;
vertical-align: middle ;
width: 175px ;
position: fixed ;
text-align: left ;
font-size: large ;
}
nav::before {
content: "Links" ;
text-align: center ;
display: block ;
font-size: large ;
color: violet ;
text-decoration: underline ;
margin-top: .5em ;
}
nav li {
display: block ;
text-align: center ;
@ -177,7 +196,7 @@ ul.images li img {
padding: 2.5px;
}
@media (min-width: 55em) {
@media (min-width: 40em) {
.resright, .disappear {
display: block ;
float: right;

2
tags/a-minimal-linux-display-manager
View File

@ -0,0 +1,2 @@
GUIDE
LINUX

3
templates/article_header.html
View File

@ -1,5 +1,6 @@
<center>
<h1 style=font-size:xxx-large>$TITLE</h1>
</center>
<div id=partial_header></div>
<main>
<div id=partial_header></div>
<div class=content>

4
templates/article_list_header.html
View File

@ -1,6 +1,6 @@
<center>
<h1 style=font-size:xxx-large>Articles</h1>
</center>
<div id=partial_header></div>
<main>
<div id=partial_header></div>
<div class=content>

3
templates/footer.html
View File

@ -5,7 +5,8 @@
alt="Hit Counter by Digits" border="0" />
</a>
</center>
</main>
</div>
<div align=center id=partial_footer></div>
</main>
</body>
</html>