-
Notifications
You must be signed in to change notification settings - Fork 1
/
about.html
142 lines (116 loc) · 6.6 KB
/
about.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
<!DOCTYPE html>
<html lang="en" class="normal green">
<head>
<meta charset="UTF-8">
<meta name="description" content="About Page, Turbo C/C++ simple basic web site theme." />
<meta name="author" content="Fatih Tatoğlu" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Turbo C Theme - About</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap"
rel="stylesheet">
<link rel="canonical" href="https://blog.tatoglu.net/blog-theme-turboc" />
<link rel="home" href="https://blog.tatoglu.net/blog-theme-turboc" />
<link rel="apple-touch-icon" sizes="180x180" href="images/favicon/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="images/favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="images/favicon/favicon-16x16.png">
<link rel="manifest" href="images/favicon/site.webmanifest">
<link rel="icon" href="favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="./css/main.css">
<script src="node_modules/mustache/mustache.min.js"></script>
<script src="./js/main.js"></script>
</head>
<body>
<header>
<span class="site-name">Turbo C Theme - About</span>
</header>
<nav id="navigation"></nav>
<main>
<article>
<header>
<h1>About</h1>
<button>#</button>
</header>
<p>When I have started programming, my first IDE was Turbo C. With helpful documents I have learned the C
programming language. Turbo C has an important place in my heart. For showing my admiration, I have
developed this theme.</p>
<p>While developing this theme I have also used following technologies.</p>
<ul>
<li>SASS</li>
<li>NodeJS</li>
<li>Javascript</li>
<li>CSS</li>
</ul>
<h2>Last Published Date</h2>
<time datetime="@Publish_Date_Format" title="@Publish_Date">@Publish_Date</time>
<h2>References</h2>
<p>I used following references.</p>
<ul>
<li><a href="http://www.patternify.com" target="_new">Patternify</a></li>
<li><a href="https://webkit.org/blog/363/styling-scrollbars" target="_new">Styling Scrollbars</a></li>
<li><a href="https://css-tricks.com/styling-cross-browser-compatible-range-inputs-css/"
target="_new">Styling Cross-Browser Compatible Range Inputs with CSS</a></li>
<li><a href="https://css-tricks.com/snippets/css/a-guide-to-flexbox/" target="_new">A Complete Guide to
Flexbox</a></li>
<li><a href="https://dribbble.com/shots/6647884-Daily-UI-086-Progress-Bar" target="_new">DOS Progress
Bar</a></li>
<li><a href="https://css-tricks.com/html5-meter-element/#:~:text=The%20meter%20element%20represents%20a,also%20known%20as%20a%20gauge"
target="_new">The HTML5 meter Element</a></li>
<li><a href="https://css-tricks.com/snippets/css/custom-file-input-styling-webkitblink/"
target="_new">Custom File Input Styling</a></li>
<li><a href="https://stackoverflow.com/questions/51759599/opening-modal-from-function-in-pure-javascript/51759691"
target="_new">Opening modal from function in pure javascript</a></li>
<li><a href="https://communary.net/2016/05/23/automatically-convert-markdown-to-html-in-visual-studio-code-with-syntax-highlighting/"
target="_new">Automatically convert MarkDown to HTML in Visual Studio Code, with syntax
highlighting!</a></li>
<li><a href="https://davidwalsh.name/rem-px-browser-function-sass" target="_new">REM to PX Browser
Function with Sass</a></li>
<li><a href="https://medium.com/@bhargav3shah/scss-convert-pixel-values-to-rem-using-functions-f1cef575edfd"
target="_new">Convert pixel values to rem, Sass style</a></li>
<li><a href="https://www.w3schools.com/css/css_positioning.asp" target="_new">CSS Layout - The position
Property</a></li>
<li><a href="https://medium.com/@dmitriy.borodiy/easy-color-theming-with-scss-bc38fd5734d1"
target="_new">Easy Color Theming with SCSS</a></li>
<li><a href="https://thoughtbot.com/blog/sasss-content-directive" target="_new">SASS Content
Directive</a></li>
<li><a href="https://www.w3.org/standards/webdesign/accessibility" target="_new">Web Design -
Accessibility</a></li>
<li><a href="https://codepen.io/amit_merchant/pen/qBjvvzL" target="_new">Blink Cursor Sample</a></li>
<li><a href="https://www.pluralsight.com/guides/how-to-host-your-static-webpages-on-github-pages"
target="_new">How to Host Your Static Webpages on GitHub Pages</a></li>
</ul>
<h2>Prerequisite</h2>
<pre><code>
npm install --global gulp-cli
npm install</code></pre>
<h2>For Build</h2>
<pre><code>
gulp</code></pre>
<h2>Feature Development Targets</h2>
<ol>
<li>Resposive Design</li>
<li>Missing Input Types</li>
<li>Loading Bar</li>
<li>CSS Animations</li>
<li>Add SVG Icons</li>
<li>More colors for scrollbar arrows.</li>
<li>Build Automation.</li>
<li>CI / CD Pipeline with GitHub Actions.</li>
<li>Add accessibility.</li>
<li>Blink and Fat cursor.</li>
<li>Moving in web site with enter and arrow keys.</li>
<li>ES6.</li>
<li>Use no querySelectorAll.</li>
</ol>
</article>
</main>
<footer>
<span class="credits">By <a href="https://github.com/fatihtatoglu" target="_new" rel="external"
title="Developed by Fatih Tatoğlu">Fatih
Tatoğlu</a> - 2022</span>
</footer>
</body>
</html>