minimal-categorized 0.0.8 → 0.0.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/README.md +5 -1
- data/_data/customs.yml +3 -0
- data/_data/metaData.yml +6 -1
- data/_includes/common-head.html +1 -0
- data/_includes/cookies.js +29 -0
- data/_includes/customizations.html +15 -0
- data/_includes/home.js +2 -2
- data/_includes/menu.html +47 -48
- data/_layouts/default.html +5 -0
- data/_layouts/post.html +3 -1
- data/_sass/styles/_category-aggregator.scss +5 -5
- data/_sass/styles/_cookies.scss +53 -0
- data/_sass/styles/_defaults.scss +9 -4
- data/_sass/styles/_home.scss +2 -2
- data/_sass/styles/_index.scss +3 -1
- data/_sass/styles/_layout.scss +3 -1
- data/_sass/styles/_menu.scss +21 -6
- data/_sass/styles/_post.scss +6 -0
- data/_sass/styles/_projects-collection.scss +82 -0
- data/_sass/variables/_colors.scss +22 -11
- data/_sass/variables/_layout.scss +2 -0
- data/assets/styles/styles.scss +5 -1
- data/pages/category-1.html +73 -1
- metadata +7 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: e9ecd370164a3292e9f9f243415565b854c51eef66fa001291f5bc1c8d3cbae8
|
|
4
|
+
data.tar.gz: e0aecaf432d6887732f2115bdd0e7e1283630a47f5ae94f4652ef0aef841661e
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 808d35f7797f0ea4c3a63b3b886351b6338cff33b83acdcd3c002eba683d900939edbce0ea9cdedb37cc4167c6a3b22bd032a355392e0780f66be353878e6fa4
|
|
7
|
+
data.tar.gz: e7060e7731d29217b1453135027af3aadfbbdebb0cb68ac961eb03f3e268ba71c4087c2f5cccffe0a9b91ef1c0f7b9ba8078f4f1602ab090fa8ff441dba8c9c8
|
data/README.md
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
[](https://raw.githubusercontent.com/mmistakes/minimal-mistakes/master/LICENSE)
|
|
4
4
|
[](https://jekyllrb.com/)
|
|
5
|
-
[](https://badge.fury.io/rb/minimal-categorized)
|
|
6
6
|
|
|
7
7
|
minimal-categorized is a flexible Jekyll theme, designed for sites with content easily aggregated into categories. Demo is available [here](https://itsmeaga1n.github.io/minimal-categorized/).
|
|
8
8
|
|
|
@@ -55,6 +55,10 @@ Structure of `_data/menu.yml`:
|
|
|
55
55
|
* faicon: FavIcon to be displayed in menu
|
|
56
56
|
* url: URL for href
|
|
57
57
|
* target: target value of \<a> tag
|
|
58
|
+
* cookies: customize information about site cookies
|
|
59
|
+
* enabled: determine if should show cookies pop-up
|
|
60
|
+
* message: text on cookie pop-up
|
|
61
|
+
* agreeButtonText: text on agree button
|
|
58
62
|
|
|
59
63
|
Structure of `_data/metaData.yml`:
|
|
60
64
|
author: Site Author name
|
data/_data/customs.yml
ADDED
data/_data/metaData.yml
CHANGED
|
@@ -1,2 +1,7 @@
|
|
|
1
1
|
author: Site Author
|
|
2
|
-
avatar_url: assets/img/avatar.png
|
|
2
|
+
avatar_url: assets/img/avatar.png
|
|
3
|
+
lightTheme: True
|
|
4
|
+
cookies:
|
|
5
|
+
enabled: True
|
|
6
|
+
message: This site might be using cookies! Customize your message or disable cookies in metaData.yml!
|
|
7
|
+
agreeButtonText: Agree
|
data/_includes/common-head.html
CHANGED
|
@@ -2,4 +2,5 @@
|
|
|
2
2
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
3
3
|
<link rel="stylesheet" href="{{ '/assets/styles/styles.css' | relative_url }}">
|
|
4
4
|
<script src="https://kit.fontawesome.com/79c31398dc.js" crossorigin="anonymous"></script>
|
|
5
|
+
{% include customizations.html %}
|
|
5
6
|
{% seo %}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
(function() {
|
|
2
|
+
const consentPropName = "cookies_consent";
|
|
3
|
+
const storageType = localStorage;
|
|
4
|
+
|
|
5
|
+
shouldShowCookieConsent = () => !storageType.getItem(consentPropName);
|
|
6
|
+
acceptCookieConsent = () => storageType.setItem(consentPropName, true);
|
|
7
|
+
window.addEventListener("load", () => {
|
|
8
|
+
if(!shouldShowCookieConsent()) {
|
|
9
|
+
return;
|
|
10
|
+
}
|
|
11
|
+
const cookieContainer = document.createElement("div");
|
|
12
|
+
cookieContainer.classList.add("hidden");
|
|
13
|
+
const cookieParagraph = document.createElement("p");
|
|
14
|
+
const cookieContent = document.createTextNode("{{ site.data.metaData.cookies.message }}");
|
|
15
|
+
const cookieAgreeButton = document.createElement("button");
|
|
16
|
+
const cookieButtonContent = document.createTextNode("{{ site.data.metaData.cookies.agreeButtonText }}");
|
|
17
|
+
cookieAgreeButton.appendChild(cookieButtonContent);
|
|
18
|
+
cookieAgreeButton.onclick = () => {
|
|
19
|
+
acceptCookieConsent();
|
|
20
|
+
cookieContainer.classList.add("hidden");
|
|
21
|
+
window.setTimeout(cookieContainer.remove.bind(cookieContainer), 1000);
|
|
22
|
+
}
|
|
23
|
+
cookieParagraph.append(cookieContent);
|
|
24
|
+
cookieContainer.append(cookieParagraph, cookieAgreeButton);
|
|
25
|
+
cookieContainer.classList.add("cookie-container")
|
|
26
|
+
document.body.appendChild(cookieContainer);
|
|
27
|
+
window.setTimeout(() => cookieContainer.classList.remove("hidden"));
|
|
28
|
+
});
|
|
29
|
+
})();
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
{% for javascript in page.custom-js %}
|
|
2
|
+
<script src="{{ javascript }}"></script>
|
|
3
|
+
{% endfor %}
|
|
4
|
+
|
|
5
|
+
{% for javascript in site.data.customs.custom-js %}
|
|
6
|
+
<script src="{{ javascript }}"></script>
|
|
7
|
+
{% endfor %}
|
|
8
|
+
|
|
9
|
+
{% for css in page.custom-css %}
|
|
10
|
+
<link href="{{ css }}" rel="stylesheet">
|
|
11
|
+
{% endfor %}
|
|
12
|
+
|
|
13
|
+
{% for css in site.data.customs.custom-css %}
|
|
14
|
+
<link href="{{ css }}" rel="stylesheet">
|
|
15
|
+
{% endfor %}
|
data/_includes/home.js
CHANGED
data/_includes/menu.html
CHANGED
|
@@ -1,62 +1,61 @@
|
|
|
1
1
|
{% if site.data.menu.minimal_menu %}
|
|
2
|
-
<aside class="menu">
|
|
3
|
-
|
|
2
|
+
<aside class="menu">
|
|
3
|
+
<div class="menu-top">
|
|
4
4
|
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
5
|
+
<ul class="navigation">
|
|
6
|
+
{% for menu_item in site.data.menu.menu_pages %}
|
|
7
|
+
<li>
|
|
8
|
+
<a href="{{ menu_item.url | relative_url }}" category="{{ menu_item.category }}" title="{{ menu_item.tooltip }}">
|
|
9
|
+
<i class="{{ menu_item.icon_name }}"> </i>
|
|
10
|
+
</a>
|
|
11
|
+
</li>
|
|
12
|
+
{% endfor %}
|
|
13
|
+
</ul>
|
|
14
|
+
</div>
|
|
15
|
+
<div class="menu-contact">
|
|
16
|
+
{% for contact in site.data.menu.menu_contacts %}
|
|
17
|
+
<a href="{{ contact.url | relative_url }}" target="{{ contact.target }}">
|
|
18
|
+
<i class="{{ contact.faicon }}"></i>
|
|
10
19
|
</a>
|
|
11
|
-
</li>
|
|
12
20
|
{% endfor %}
|
|
13
|
-
</
|
|
14
|
-
</
|
|
15
|
-
<div class="menu-contact">
|
|
16
|
-
{% for contact in site.data.menu.menu_contacts %}
|
|
17
|
-
|
|
18
|
-
<a href="{{ contact.url | relative_url }}" target="{{ contact.target }}">
|
|
19
|
-
<i class="{{ contact.faicon }}"></i>
|
|
20
|
-
</a>
|
|
21
|
-
{% endfor %}
|
|
22
|
-
</div>
|
|
23
|
-
</aside>
|
|
21
|
+
</div>
|
|
22
|
+
</aside>
|
|
24
23
|
|
|
25
24
|
{% else %}
|
|
26
25
|
|
|
27
|
-
<aside class="menu">
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
26
|
+
<aside class="menu">
|
|
27
|
+
<div class="menu-top">
|
|
28
|
+
<div class="profile">
|
|
29
|
+
<div class="avatar">
|
|
30
|
+
<a href="{{ '/about.html' | relative_url }}" alt="avatar">
|
|
31
|
+
<img src="{{ site.data.menu.menu_logo | relative_url }}" alt="avatar" onerror="this.style.display='none'">
|
|
32
|
+
</a>
|
|
33
|
+
</div>
|
|
34
|
+
<h1>{{ site.data.menu.menu_title }}</h1>
|
|
35
|
+
<h2>{{ site.data.menu.menu_headline }}</h2>
|
|
36
|
+
<p>{{ site.data.menu.menu_intro }}</p>
|
|
34
37
|
</div>
|
|
35
|
-
|
|
36
|
-
<
|
|
37
|
-
|
|
38
|
+
|
|
39
|
+
<ul class="navigation">
|
|
40
|
+
{% for menu_item in site.data.menu.menu_pages %}
|
|
41
|
+
<li>
|
|
42
|
+
<a href="{{ menu_item.url | relative_url }}" category="{{ menu_item.category }}" title="{{ menu_item.tooltip }}">
|
|
43
|
+
<i class="{{ menu_item.icon_name }}"> </i>
|
|
44
|
+
<span>{{ menu_item.title }}</span>
|
|
45
|
+
</a>
|
|
46
|
+
</li>
|
|
47
|
+
{% endfor %}
|
|
48
|
+
</ul>
|
|
38
49
|
</div>
|
|
50
|
+
<div class="menu-contact">
|
|
51
|
+
{% for contact in site.data.menu.menu_contacts %}
|
|
39
52
|
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
<a href="{{ menu_item.url | relative_url }}" category="{{ menu_item.category }}" title="{{ menu_item.tooltip }}">
|
|
44
|
-
<i class="{{ menu_item.icon_name }}"> </i>
|
|
45
|
-
<span>{{ menu_item.title }}</span>
|
|
46
|
-
</a>
|
|
47
|
-
</li>
|
|
53
|
+
<a href="{{ contact.url | relative_url }}" target="{{ contact.target }}">
|
|
54
|
+
<i class="{{ contact.faicon }}"></i>
|
|
55
|
+
</a>
|
|
48
56
|
{% endfor %}
|
|
49
|
-
</
|
|
50
|
-
</
|
|
51
|
-
<div class="menu-contact">
|
|
52
|
-
{% for contact in site.data.menu.menu_contacts %}
|
|
53
|
-
|
|
54
|
-
<a href="{{ contact.url | relative_url }}" target="{{ contact.target }}">
|
|
55
|
-
<i class="{{ contact.faicon }}"></i>
|
|
56
|
-
</a>
|
|
57
|
-
{% endfor %}
|
|
58
|
-
</div>
|
|
59
|
-
</aside>
|
|
57
|
+
</div>
|
|
58
|
+
</aside>
|
|
60
59
|
{% endif %}
|
|
61
60
|
|
|
62
61
|
<script>
|
data/_layouts/default.html
CHANGED
data/_layouts/post.html
CHANGED
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
.category-aggregator {
|
|
2
|
-
color: $
|
|
2
|
+
color: $p_text;
|
|
3
3
|
a {
|
|
4
|
-
color: $
|
|
4
|
+
color: $p_text;
|
|
5
5
|
&:hover {
|
|
6
|
-
color:
|
|
6
|
+
color: $primary;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
hr {
|
|
10
10
|
border: 0;
|
|
11
11
|
height: 0;
|
|
12
12
|
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
13
|
-
border-bottom: 1px solid
|
|
13
|
+
border-bottom: 1px solid $p_text_dimmed;
|
|
14
14
|
margin: $gap auto $gap * 0.5 auto;
|
|
15
15
|
}
|
|
16
16
|
article {
|
|
@@ -20,7 +20,7 @@
|
|
|
20
20
|
padding-left: 18px;
|
|
21
21
|
font-style: italic;
|
|
22
22
|
margin-top: -0.6em;
|
|
23
|
-
color:
|
|
23
|
+
color: $p_text_dimmed;
|
|
24
24
|
font-size: 0.9em;
|
|
25
25
|
}
|
|
26
26
|
.article-read {
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
.cookie-container {
|
|
2
|
+
position: fixed;
|
|
3
|
+
padding: 20px 15px;
|
|
4
|
+
z-index: $pop-ups-z-1;
|
|
5
|
+
background-image: radial-gradient(farthest-corner at 25% 0, $p_darkest, $dark);
|
|
6
|
+
box-shadow: 0 0 6px 0 $dark;
|
|
7
|
+
text-align: center;
|
|
8
|
+
opacity: 0.95;
|
|
9
|
+
-webkit-transition: opacity 800ms, visibility 800ms;
|
|
10
|
+
transition: opacity 800ms, visibility 800ms;
|
|
11
|
+
bottom: 30px;
|
|
12
|
+
left: 40px;
|
|
13
|
+
max-width: 300px;
|
|
14
|
+
border-radius: 3px;
|
|
15
|
+
border: 3px solid $dark;
|
|
16
|
+
|
|
17
|
+
p {
|
|
18
|
+
color: $p_text;
|
|
19
|
+
line-height: 1.6em;
|
|
20
|
+
margin-bottom: 10px;
|
|
21
|
+
}
|
|
22
|
+
&.hidden {
|
|
23
|
+
opacity: 0;
|
|
24
|
+
visibility: hidden;
|
|
25
|
+
}
|
|
26
|
+
button {
|
|
27
|
+
line-height: 1.4;
|
|
28
|
+
font-weight: 700;
|
|
29
|
+
display: inline-block;
|
|
30
|
+
padding: 10px 20px;
|
|
31
|
+
background-color: $p_dark;
|
|
32
|
+
color: $p_text;
|
|
33
|
+
border: none;
|
|
34
|
+
border-radius: 3px;
|
|
35
|
+
text-decoration: none;
|
|
36
|
+
cursor: pointer;
|
|
37
|
+
-webkit-transition: background-color 200ms;
|
|
38
|
+
transition: background-color 200ms;
|
|
39
|
+
&:hover {
|
|
40
|
+
background-color: $primary;
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
@include mobile {
|
|
44
|
+
bottom: 0;
|
|
45
|
+
left: 0;
|
|
46
|
+
width: 100%;
|
|
47
|
+
max-width: 100%;
|
|
48
|
+
padding: 12px 10px;
|
|
49
|
+
border-left: 0;
|
|
50
|
+
border-right: 0;
|
|
51
|
+
border-bottom: 0;
|
|
52
|
+
}
|
|
53
|
+
}
|
data/_sass/styles/_defaults.scss
CHANGED
|
@@ -2,18 +2,18 @@ h1 {
|
|
|
2
2
|
text-transform: uppercase;
|
|
3
3
|
font-weight: 700;
|
|
4
4
|
text-rendering: optimizeLegibility;
|
|
5
|
-
color:
|
|
5
|
+
color: $primary;
|
|
6
6
|
text-align: center;
|
|
7
7
|
font-size: 2.5em;
|
|
8
8
|
letter-spacing: -1px;
|
|
9
|
-
|
|
9
|
+
padding: 0.5em;
|
|
10
10
|
}
|
|
11
11
|
|
|
12
|
-
h2, h2 a {
|
|
12
|
+
h2, h2, h3 a {
|
|
13
13
|
font-weight: 700;
|
|
14
14
|
font-size: 1.4em;
|
|
15
15
|
line-height: 1.4em;
|
|
16
|
-
color: $
|
|
16
|
+
color: $primary;
|
|
17
17
|
}
|
|
18
18
|
|
|
19
19
|
* {
|
|
@@ -26,6 +26,7 @@ body {
|
|
|
26
26
|
font-size: 16px;
|
|
27
27
|
color: $base-white;
|
|
28
28
|
font-family: forma-djr-micro,Arial,sans-serif;
|
|
29
|
+
-webkit-font-smoothing: antialiased;
|
|
29
30
|
}
|
|
30
31
|
main {
|
|
31
32
|
.content-container {
|
|
@@ -34,9 +35,13 @@ main {
|
|
|
34
35
|
width: 90%;
|
|
35
36
|
padding: 0px 18px 24px;
|
|
36
37
|
flex-grow: 1;
|
|
38
|
+
position: relative;
|
|
37
39
|
|
|
38
40
|
.content-separator {
|
|
39
41
|
margin: $gap auto;
|
|
42
|
+
&:last-child {
|
|
43
|
+
margin: $gap auto 0 auto;
|
|
44
|
+
}
|
|
40
45
|
}
|
|
41
46
|
}
|
|
42
47
|
}
|
data/_sass/styles/_home.scss
CHANGED
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
flex-wrap: wrap;
|
|
7
7
|
justify-content: space-between;
|
|
8
8
|
align-items: flex-start;
|
|
9
|
-
background-color: $
|
|
9
|
+
background-color: $main-bg-color;
|
|
10
10
|
a {
|
|
11
11
|
display: flex;
|
|
12
12
|
flex: 0 50%;
|
|
@@ -47,7 +47,7 @@
|
|
|
47
47
|
opacity: 0;
|
|
48
48
|
position: absolute;
|
|
49
49
|
text-align: center;
|
|
50
|
-
text-shadow: $
|
|
50
|
+
text-shadow: $dark 3px 3px 3px;
|
|
51
51
|
@include mobile {
|
|
52
52
|
opacity: 1;
|
|
53
53
|
}
|
data/_sass/styles/_index.scss
CHANGED
data/_sass/styles/_layout.scss
CHANGED
|
@@ -16,6 +16,7 @@ main {
|
|
|
16
16
|
top: $menu-size;
|
|
17
17
|
left: 0;
|
|
18
18
|
width: 100%;
|
|
19
|
+
height: calc(100% - #{$menu-size});
|
|
19
20
|
}
|
|
20
21
|
&.no-menu {
|
|
21
22
|
width: 100%;
|
|
@@ -26,7 +27,7 @@ main {
|
|
|
26
27
|
footer {
|
|
27
28
|
width: 100%;
|
|
28
29
|
text-align: center;
|
|
29
|
-
color
|
|
30
|
+
color:$p_text;
|
|
30
31
|
display: flex;
|
|
31
32
|
justify-content: center;
|
|
32
33
|
font-size: 0.7em;
|
|
@@ -43,6 +44,7 @@ footer {
|
|
|
43
44
|
top: $minimal-menu-size;
|
|
44
45
|
left: 0;
|
|
45
46
|
width: 100%;
|
|
47
|
+
height: calc(100% - #{$minimal-menu-size});
|
|
46
48
|
}
|
|
47
49
|
}
|
|
48
50
|
}
|
data/_sass/styles/_menu.scss
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
.menu {
|
|
2
2
|
$root: &;
|
|
3
|
-
background-image: linear-gradient(142deg, $
|
|
3
|
+
background-image: linear-gradient(142deg, $dark 0%, $p_darkest 45%, $dark 90%);
|
|
4
4
|
position: fixed;
|
|
5
5
|
left: 0;
|
|
6
6
|
top: 0;
|
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
float: left;
|
|
13
13
|
width: $menu-size;
|
|
14
14
|
box-sizing: border-box;
|
|
15
|
-
border-right: 2px solid $
|
|
15
|
+
border-right: 2px solid $dark;
|
|
16
16
|
|
|
17
17
|
@include mobile {
|
|
18
18
|
flex-direction: row;
|
|
@@ -44,6 +44,8 @@
|
|
|
44
44
|
display: flex;
|
|
45
45
|
height: 50px;
|
|
46
46
|
justify-content:center;
|
|
47
|
+
position: relative;
|
|
48
|
+
|
|
47
49
|
a {
|
|
48
50
|
align-items:center;
|
|
49
51
|
color: $p_text;
|
|
@@ -59,7 +61,19 @@
|
|
|
59
61
|
|
|
60
62
|
}
|
|
61
63
|
&.selected {
|
|
62
|
-
color: $
|
|
64
|
+
color: $primary;
|
|
65
|
+
|
|
66
|
+
&::before{
|
|
67
|
+
content: "";
|
|
68
|
+
display: block;
|
|
69
|
+
width: 2px;
|
|
70
|
+
height: 100%;
|
|
71
|
+
background-color: $primary;
|
|
72
|
+
position: absolute;
|
|
73
|
+
left: -2px;
|
|
74
|
+
top: 0px;
|
|
75
|
+
box-shadow: $primary 4px 0px 22px;
|
|
76
|
+
}
|
|
63
77
|
}
|
|
64
78
|
@include mobile {
|
|
65
79
|
height: calc(#{$menu-size} - 10px);
|
|
@@ -76,7 +90,7 @@
|
|
|
76
90
|
|
|
77
91
|
h1 {
|
|
78
92
|
font-size: 2em;
|
|
79
|
-
|
|
93
|
+
padding: 0.5em;
|
|
80
94
|
}
|
|
81
95
|
|
|
82
96
|
h2 {
|
|
@@ -109,7 +123,7 @@
|
|
|
109
123
|
}
|
|
110
124
|
}
|
|
111
125
|
a {
|
|
112
|
-
color: $
|
|
126
|
+
color: $p_text;
|
|
113
127
|
cursor:pointer;
|
|
114
128
|
text-align:left;
|
|
115
129
|
text-size-adjust:100%;
|
|
@@ -117,7 +131,8 @@
|
|
|
117
131
|
margin-left: 4px;
|
|
118
132
|
margin-right: 4px;
|
|
119
133
|
&:hover {
|
|
120
|
-
|
|
134
|
+
font-weight: 900;
|
|
135
|
+
color: $p_lighter;
|
|
121
136
|
}
|
|
122
137
|
}
|
|
123
138
|
}
|
data/_sass/styles/_post.scss
CHANGED
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
.collection {
|
|
2
|
+
text-align: center;
|
|
3
|
+
display: flex;
|
|
4
|
+
flex-flow: row wrap;
|
|
5
|
+
justify-content: center;
|
|
6
|
+
margin-top: 1em;
|
|
7
|
+
.group {
|
|
8
|
+
margin: 4px;
|
|
9
|
+
display: inline-block;
|
|
10
|
+
border: 2px solid $p_darkest;
|
|
11
|
+
border-radius: 5px;
|
|
12
|
+
position: relative;
|
|
13
|
+
text-align: initial;
|
|
14
|
+
min-width: 300px;
|
|
15
|
+
max-width: 375px;
|
|
16
|
+
width: 100%;
|
|
17
|
+
background-color: $dark;
|
|
18
|
+
height: fit-content;
|
|
19
|
+
.title {
|
|
20
|
+
background-color: $dark;
|
|
21
|
+
padding: 6px;
|
|
22
|
+
text-align: center;
|
|
23
|
+
font-weight: 900;
|
|
24
|
+
line-height: 10px;
|
|
25
|
+
}
|
|
26
|
+
.item {
|
|
27
|
+
padding: 18px 15px 18px 15px;
|
|
28
|
+
width: 100%;
|
|
29
|
+
display: flex;
|
|
30
|
+
cursor: pointer;
|
|
31
|
+
transition: 0.5s ease all;
|
|
32
|
+
-webkit-transition: 0.5s ease all;
|
|
33
|
+
position: relative;
|
|
34
|
+
box-sizing: border-box;
|
|
35
|
+
color: $p_text;
|
|
36
|
+
line-height: 1.2em;
|
|
37
|
+
border-bottom: 1px solid $p_darkest;
|
|
38
|
+
border-top: 1px solid $p_darkest;
|
|
39
|
+
&:last-child {
|
|
40
|
+
border-bottom: none;
|
|
41
|
+
}
|
|
42
|
+
&:first-child {
|
|
43
|
+
border-top: 2px solid $p_darkest;
|
|
44
|
+
}
|
|
45
|
+
&:hover {
|
|
46
|
+
background-image: linear-gradient(to right, $p_darkest, $dark);
|
|
47
|
+
&::before {
|
|
48
|
+
content: "";
|
|
49
|
+
display: block;
|
|
50
|
+
width: 4px;
|
|
51
|
+
height: 100%;
|
|
52
|
+
background-color: $primary;
|
|
53
|
+
position: absolute;
|
|
54
|
+
left: -2px;
|
|
55
|
+
top: 0px;
|
|
56
|
+
box-shadow: $primary 4px 0px 22px;
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
.icon {
|
|
60
|
+
min-width: 50px;
|
|
61
|
+
img, i {
|
|
62
|
+
width: 32px;
|
|
63
|
+
height: 32px;
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
.content {
|
|
67
|
+
h4 {
|
|
68
|
+
margin: 0px;
|
|
69
|
+
font-weight: 500;
|
|
70
|
+
min-height: 1.5em;
|
|
71
|
+
font-size: 1em;
|
|
72
|
+
line-height: 1em;
|
|
73
|
+
}
|
|
74
|
+
.description {
|
|
75
|
+
padding-left: 1px;
|
|
76
|
+
font-size: 0.75em;
|
|
77
|
+
line-height: 1.1em;
|
|
78
|
+
}
|
|
79
|
+
}
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
}
|
|
@@ -1,14 +1,25 @@
|
|
|
1
1
|
$base-white: #fafafa;
|
|
2
|
-
$main-bg-color: #
|
|
3
|
-
|
|
4
|
-
$primary: #
|
|
5
|
-
$p_light: #
|
|
6
|
-
$
|
|
7
|
-
$
|
|
8
|
-
$
|
|
9
|
-
$
|
|
10
|
-
$
|
|
11
|
-
$
|
|
2
|
+
$main-bg-color: #162129;
|
|
3
|
+
|
|
4
|
+
$primary: #4fc2f7;
|
|
5
|
+
$p_light: #81d3fa;
|
|
6
|
+
$p_lighter_less: #81d3fa;
|
|
7
|
+
$p_lighter: #b3e4fc;
|
|
8
|
+
$p_lightest: #e1f5fe;
|
|
9
|
+
$p_dark: #09a7f4;
|
|
10
|
+
$p_darker: #0986d0;
|
|
11
|
+
$p_darkest: #07559a;
|
|
12
|
+
|
|
13
|
+
$dark: #162129;
|
|
14
|
+
|
|
15
|
+
$secondary: #f7844f;
|
|
16
|
+
$s_light: #faa682;
|
|
17
|
+
$s_lighter: #fdc9b3;
|
|
18
|
+
$s_lightest: #fbe8e4;
|
|
12
19
|
$s_dark: #001970;
|
|
13
|
-
|
|
20
|
+
|
|
21
|
+
$p_text: #ecf8ff;
|
|
22
|
+
$p_text_dimmed: #5e8ca7;
|
|
14
23
|
$s_text: #ffffff;
|
|
24
|
+
|
|
25
|
+
$post_content_bg_color: #fff;
|
|
@@ -3,9 +3,11 @@ $desktop-width: 1024px;
|
|
|
3
3
|
$menu-size: 200px;
|
|
4
4
|
$minimal-menu-size: 50px;
|
|
5
5
|
$gap: 30px;
|
|
6
|
+
$pop-ups-z-1: 100;
|
|
6
7
|
|
|
7
8
|
$content-width-desktop: calc(100% - #{$menu-size});
|
|
8
9
|
$content-width-desktop-minimal-menu: calc(100% - #{$minimal-menu-size});
|
|
10
|
+
|
|
9
11
|
@mixin tablet {
|
|
10
12
|
@media only screen and (min-width: #{$tablet-width}) and (max-width: #{$desktop-width - 1px}) {
|
|
11
13
|
@content;
|
data/assets/styles/styles.scss
CHANGED
data/pages/category-1.html
CHANGED
|
@@ -5,4 +5,76 @@ permalink: category-1.html
|
|
|
5
5
|
category: category-1
|
|
6
6
|
summary: Summary of a category. It is just a special placeholder wrapped in a particular class, so it looks more interesting. You can always make your own layout for a category, or make a category.html look the way you want.
|
|
7
7
|
---
|
|
8
|
-
|
|
8
|
+
<hr>
|
|
9
|
+
<h2>Showcase of customizing aggregator site</h2>
|
|
10
|
+
<div class="collection">
|
|
11
|
+
<div class="group">
|
|
12
|
+
<div class="title">Title for this section</div>
|
|
13
|
+
<ul>
|
|
14
|
+
<a class="item" href="super-cat.html">
|
|
15
|
+
<div class="icon"><img src="assets/img/project-1.png"></div>
|
|
16
|
+
<div class="content">
|
|
17
|
+
<h4>Super cat</h4>
|
|
18
|
+
<div class="description">
|
|
19
|
+
With this customization you can showcase here whatever you want, and create a separate pages fot each of those. This one will redirect to the Super cat site
|
|
20
|
+
</div>
|
|
21
|
+
</div>
|
|
22
|
+
</a>
|
|
23
|
+
<a class="item">
|
|
24
|
+
<div class="icon"><img src="assets/img/project-2.svg"></div>
|
|
25
|
+
<div class="content">
|
|
26
|
+
<h4>CatoCat</h4>
|
|
27
|
+
<div class="description">
|
|
28
|
+
CatoCat description. It's very fun and so on
|
|
29
|
+
</div>
|
|
30
|
+
</div>
|
|
31
|
+
</a>
|
|
32
|
+
</ul>
|
|
33
|
+
</div>
|
|
34
|
+
<div class="group">
|
|
35
|
+
<div class="title">Title for this section</div>
|
|
36
|
+
<ul>
|
|
37
|
+
<a class="item">
|
|
38
|
+
<div class="icon"><img src="assets/img/project-3.svg"></div>
|
|
39
|
+
<div class="content">
|
|
40
|
+
<h4>Track tacking</h4>
|
|
41
|
+
<div class="description">
|
|
42
|
+
Track tacking description. It's a track, but more colorful
|
|
43
|
+
</div>
|
|
44
|
+
</div>
|
|
45
|
+
</a>
|
|
46
|
+
<a class="item" href="https://ko-fi.com/itsmeaga1n0929" target="_blank">
|
|
47
|
+
<div class="icon"><img src="assets/img/ko-fi.jpg"></div>
|
|
48
|
+
<div class="content">
|
|
49
|
+
<h4>Ko-fi</h4>
|
|
50
|
+
<div class="description">
|
|
51
|
+
If you enjoy what I'm doing, maybe you want to sponsor me a coffee?
|
|
52
|
+
</div>
|
|
53
|
+
</div>
|
|
54
|
+
</a>
|
|
55
|
+
</ul>
|
|
56
|
+
</div>
|
|
57
|
+
<div class="group">
|
|
58
|
+
<div class="title">Title for this section</div>
|
|
59
|
+
<ul>
|
|
60
|
+
<a class="item">
|
|
61
|
+
<div class="icon"><img src="assets/img/project-4.png"></div>
|
|
62
|
+
<div class="content">
|
|
63
|
+
<h4>Project coffuska</h4>
|
|
64
|
+
<div class="description">
|
|
65
|
+
Project that converts coffee into lines of code
|
|
66
|
+
</div>
|
|
67
|
+
</div>
|
|
68
|
+
</a>
|
|
69
|
+
<a class="item">
|
|
70
|
+
<div class="icon"><i class="fas fa-cat"></i></div>
|
|
71
|
+
<div class="content">
|
|
72
|
+
<h4>Project x</h4>
|
|
73
|
+
<div class="description">
|
|
74
|
+
Project x description. It's very fun and so on
|
|
75
|
+
</div>
|
|
76
|
+
</div>
|
|
77
|
+
</a>
|
|
78
|
+
</ul>
|
|
79
|
+
</div>
|
|
80
|
+
</div>
|
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: minimal-categorized
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.0.
|
|
4
|
+
version: 0.0.13
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Patryk Bieszke
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2020-11-
|
|
11
|
+
date: 2020-11-07 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: jekyll
|
|
@@ -35,9 +35,12 @@ files:
|
|
|
35
35
|
- LICENSE.txt
|
|
36
36
|
- README.md
|
|
37
37
|
- _config.yml
|
|
38
|
+
- _data/customs.yml
|
|
38
39
|
- _data/menu.yml
|
|
39
40
|
- _data/metaData.yml
|
|
40
41
|
- _includes/common-head.html
|
|
42
|
+
- _includes/cookies.js
|
|
43
|
+
- _includes/customizations.html
|
|
41
44
|
- _includes/footer.html
|
|
42
45
|
- _includes/home.js
|
|
43
46
|
- _includes/menu.html
|
|
@@ -47,6 +50,7 @@ files:
|
|
|
47
50
|
- _layouts/post.html
|
|
48
51
|
- _sass/minimal-categorized.scss
|
|
49
52
|
- _sass/styles/_category-aggregator.scss
|
|
53
|
+
- _sass/styles/_cookies.scss
|
|
50
54
|
- _sass/styles/_defaults.scss
|
|
51
55
|
- _sass/styles/_home.scss
|
|
52
56
|
- _sass/styles/_index.scss
|
|
@@ -54,6 +58,7 @@ files:
|
|
|
54
58
|
- _sass/styles/_menu.scss
|
|
55
59
|
- _sass/styles/_post.scss
|
|
56
60
|
- _sass/styles/_profile.scss
|
|
61
|
+
- _sass/styles/_projects-collection.scss
|
|
57
62
|
- _sass/variables/_colors.scss
|
|
58
63
|
- _sass/variables/_index.scss
|
|
59
64
|
- _sass/variables/_layout.scss
|