Skip to content

Commit 7ca220e

Browse files
KipparisKipparis
committed
add homepage to version control
1 parent bb9b778 commit 7ca220e

File tree

2 files changed

+219
-0
lines changed

2 files changed

+219
-0
lines changed

‎homepage.html‎

Lines changed: 128 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,128 @@
1+
<html>
2+
<head>
3+
<meta http-equiv="content-type" content="text/html; charset=utf-8">
4+
<title>ok zoomer</title>
5+
</head>
6+
<body>
7+
<!-- because flex is bad in setting fixed position, i'll use table -->
8+
<div class="page">
9+
10+
<div class="main">
11+
<div class="row">
12+
<a class="elem" href="https://www.youtube.com/">yt</a>
13+
<a class="elem" href="https://www.twitch.tv/">twitch</a>
14+
<a class="elem" href="https://github.com/">github</a>
15+
<a class="elem" href="https://www.wikipedia.org/">wiki</a>
16+
</div>
17+
<div class="row">
18+
<a class="elem" href="https://vk.com/feed">vk</a>
19+
<a class="elem" href="https://twitter.com/home">twitter</a>
20+
<a class="elem" href="https://www.reddit.com/">reddit</a>
21+
<a class="elem" href="https://translate.google.com">tr</a>
22+
</div>
23+
<div class="row">
24+
<a class="elem" href="https://mail.google.com/">gmail</a>
25+
<a class="elem" href="https://asoftmurmur.com/">murmur</a>
26+
<a class="elem" href="https://devhints.io/">devhints</a>
27+
<a class="elem" href="https://www.evernote.com/Login.action">evernote</a>
28+
</div>
29+
<div class="row">
30+
<a class="elem"></a>
31+
<a class="elem" href="https://calendar.google.com">gc</a>
32+
<a class="elem" href="https://soundcloud.com">sc</a>
33+
</div>
34+
</div>
35+
36+
37+
<div class="section">
38+
<h3>Learning Resources:</h3>
39+
<div class="cards">
40+
<div class="column">
41+
<a class="elem">All-in-One</a>
42+
<a class="elem" href="https://github.com/EbookFoundation/free-programming-books/blob/master/books/free-programming-books.md">free programming books</a>
43+
<a class="elem" href="https://www.coursera.org/">coursera</a>
44+
<a class="elem" title="cheatsheets"
45+
href="https://www.codecademy.com/">
46+
codeacademy
47+
</a>
48+
</div>
49+
<div class="column">
50+
<a class="elem">Python</a>
51+
<a class="elem" title="normal tutorial" href="https://docs.python.org/3/tutorial/index.html">
52+
py3 tutorial | next: 7
53+
</a>
54+
<a class="elem" title="in-depth documentation" href="https://docs.python.org/3/reference/index.html">
55+
py3 language reference
56+
</a>
57+
<a class="elem" title="visualize what happends in your code"
58+
href="http://pythontutor.com/visualize.html">
59+
pythontutor
60+
</a>
61+
<a class="elem delim">Exercises</a>
62+
<a class="elem" title="lessons, and tasks"
63+
href="https://snakify.org/ru/">
64+
snakify
65+
</a>
66+
<a class="elem" title="interactive games for python language"
67+
href="https://py.checkio.org/">
68+
checkio
69+
</a>
70+
</div>
71+
<div class="column">
72+
<a class="elem">SQL</a>
73+
<a class="elem" href="https://use-the-index-luke.com/sql/table-of-contents">Use The Index, Luke!</a>
74+
<a class="elem" href="https://leetcode.com/problemset/database/">tasks on leetcode</a>
75+
<a class="elem" href="https://mode.com/sql-tutorial/">mode.com/sql-tutorial</a>
76+
</div>
77+
<div class="column">
78+
<a class="elem">Network</a>
79+
<a class="elem" href="https://linkmeup.ru/blog/11.html">Сети для самых маленьких</a>
80+
<a class="elem" href="/home/kip/files/books/programming/network/cisco.pdf">Cisco CCENT/CCNA</a>
81+
</div>
82+
<dev class="column">
83+
<a class="elem">Clear code</a>
84+
<a class="elem" href="https://refactoring.guru/">refactoring guru</a>
85+
</dev>
86+
</div>
87+
</div>
88+
89+
<div class="section">
90+
<h3>Sport:</h3>
91+
<div class="cards">
92+
<div class="column">
93+
<a class="elem">Circulation</a>
94+
<a class="elem" href="breath.html">breath</a>
95+
</div>
96+
<div class="column">
97+
<a class="elem">Torso</a>
98+
<a class="elem" href="abs.html">abs</a>
99+
</div>
100+
<div class="column">
101+
<a class="elem">Legs</a>
102+
<a class="elem" href="ass.html">ass</a>
103+
</div>
104+
</div>
105+
</div>
106+
107+
<div class="section">
108+
<h3>Invest RU:</h3>
109+
<div class="cards">
110+
<div class="column">
111+
<a class="elem">Invest Cites</a>
112+
<a class="elem" href="https://spbexchange.ru/">SPB exchange</a>
113+
</div>
114+
<div class="column">
115+
<a class="elem">Learning Resources</a>
116+
<a class="elem" href="https://investcab.ru/ru/uch_centr/">SPB exch. learning center</a>
117+
</div>
118+
<div class="column">
119+
<a class="elem">News</a>
120+
<a class="elem" href="https://investcab.ru/ru/sobs/">SPB exch. news</a>
121+
<a class="elem" href="https://journal.tinkoff.ru/flows/invest/">TJ invest</a>
122+
</div>
123+
</div>
124+
</div>
125+
126+
</div>
127+
</body>
128+
</html>

‎homepage.scss‎

Lines changed: 91 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,91 @@
1+
@import "colors.scss";
2+
3+
$background-color: $color0; // main background color
4+
$color: $color7; // main font color
5+
$link-color: $color9; // main link color
6+
7+
body {
8+
background: $background-color;
9+
color: $color;
10+
font-size: 15pt;
11+
}
12+
13+
// clear links formating
14+
a:visited, a:hover, a:active, a:link {
15+
text-decoration: none;
16+
color: $color7;
17+
}
18+
19+
.page {
20+
font-size: 15pt;
21+
22+
// main table containing main links (like social media or wikies)
23+
.main {
24+
height: 100%; // will take height equal to window height
25+
// margin: 40% 0;
26+
display: flex;
27+
flex-direction: column;
28+
justify-content: center;
29+
.row {
30+
display: flex;
31+
flex-direction: row;
32+
justify-content: center;
33+
align-items: center;
34+
// entries in main table
35+
.elem {
36+
font-size: 15pt;
37+
margin: 0.5em 2em;
38+
font-weight: bold;
39+
}
40+
}
41+
}
42+
43+
.section
44+
{
45+
margin-bottom: 25%;
46+
margin-top: 25%;
47+
48+
h1,h2,h3,h4,h5
49+
{
50+
border-bottom: 2px solid;
51+
border-color: white;
52+
padding-left: 1em;
53+
}
54+
.cards
55+
{
56+
// padding-top: 25%;
57+
// padding-bottom: 25%;
58+
display: flex;
59+
flex-direction: row;
60+
justify-content: center; // center of screen
61+
flex-wrap: wrap;
62+
// align-items: center;
63+
.column {
64+
display: flex;
65+
flex-direction: column;
66+
align-items: center; // center items under head
67+
margin: 0em 1em;
68+
69+
.elem {
70+
&:first-child {
71+
margin: 1em;
72+
}
73+
margin: 0.1em 0em;
74+
}
75+
76+
.delim {
77+
width: 100%;
78+
font-size: 0.5em;
79+
border-bottom: 1px solid $color
80+
}
81+
}
82+
}
83+
}
84+
}
85+
86+
// highlight every first entry on row/column of table
87+
a.elem:first-child {
88+
font-size: 25pt;
89+
font-weight: bolder;
90+
color: $link-color;
91+
}

0 commit comments

Comments
 (0)