Skip to content

Commit 470592b

Browse files
committed
Add custom list component and examples for Jekyll with CSS styles
1 parent eb89388 commit 470592b

File tree

5 files changed

+435
-7
lines changed

5 files changed

+435
-7
lines changed

_includes/custom_list.html

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
<!-- Custom List Component for Jekyll -->
2+
<!-- Usage: {% include custom_list.html items=list_items type="custom" %} -->
3+
4+
{% assign list_type = include.type | default: "custom" %}
5+
{% assign items = include.items %}
6+
{% assign class_name = include.class | default: "" %}
7+
8+
{% case list_type %}
9+
{% when "custom" %}
10+
<ul class="custom-list {{ class_name }}">
11+
{% for item in items %}
12+
<li>{{ item }}</li>
13+
{% endfor %}
14+
</ul>
15+
16+
{% when "checklist" %}
17+
<ul class="checklist {{ class_name }}">
18+
{% for item in items %}
19+
<li>{{ item }}</li>
20+
{% endfor %}
21+
</ul>
22+
23+
{% when "feature" %}
24+
<ol class="feature-list {{ class_name }}">
25+
{% for item in items %}
26+
<li>{{ item }}</li>
27+
{% endfor %}
28+
</ol>
29+
30+
{% when "icon" %}
31+
<ul class="icon-list {{ class_name }}">
32+
{% for item in items %}
33+
<li data-icon="{{ item.icon | default: '•' }}">{{ item.text | default: item }}</li>
34+
{% endfor %}
35+
</ul>
36+
37+
{% when "highlight" %}
38+
<ul class="highlight-list {{ class_name }}">
39+
{% for item in items %}
40+
<li>{{ item }}</li>
41+
{% endfor %}
42+
</ul>
43+
44+
{% when "compact" %}
45+
<ul class="compact-list {{ class_name }}">
46+
{% for item in items %}
47+
<li>{{ item }}</li>
48+
{% endfor %}
49+
</ul>
50+
51+
{% else %}
52+
<ul class="{{ class_name }}">
53+
{% for item in items %}
54+
<li>{{ item }}</li>
55+
{% endfor %}
56+
</ul>
57+
{% endcase %}

_includes/list_examples.md

Lines changed: 101 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,101 @@
1+
# Custom List Examples
2+
3+
This document shows how to use the custom list styles in your Jekyll posts.
4+
5+
## 1. Including the CSS
6+
7+
Add this to your layout file or post front matter:
8+
9+
```html
10+
<link rel="stylesheet" href="/assets/css/custom.css">
11+
```
12+
13+
## 2. Using Custom Lists in Markdown
14+
15+
### Custom Arrow List
16+
```html
17+
<ul class="custom-list">
18+
<li>First item with custom arrow</li>
19+
<li>Second item</li>
20+
<li>Third item</li>
21+
</ul>
22+
```
23+
24+
### Checklist Style
25+
```html
26+
<ul class="checklist">
27+
<li>Completed task one</li>
28+
<li>Completed task two</li>
29+
<li>Completed task three</li>
30+
</ul>
31+
```
32+
33+
### Numbered Feature List
34+
```html
35+
<ol class="feature-list">
36+
<li>Feature one with circular number</li>
37+
<li>Feature two with circular number</li>
38+
<li>Feature three with circular number</li>
39+
</ol>
40+
```
41+
42+
### Icon List
43+
```html
44+
<ul class="icon-list">
45+
<li data-icon="🚀">Deployment feature</li>
46+
<li data-icon="">Performance optimization</li>
47+
<li data-icon="🔒">Security enhancement</li>
48+
</ul>
49+
```
50+
51+
### Highlighted List
52+
```html
53+
<ul class="highlight-list">
54+
<li>Important point one</li>
55+
<li>Important point two</li>
56+
<li>Important point three</li>
57+
</ul>
58+
```
59+
60+
### Compact List
61+
```html
62+
<ul class="compact-list">
63+
<li>Compact item 1</li>
64+
<li>Compact item 2</li>
65+
<li>Compact item 3</li>
66+
</ul>
67+
```
68+
69+
## 3. Using Jekyll Include
70+
71+
In your post front matter, define your list items:
72+
73+
```yaml
74+
---
75+
title: My Post
76+
features:
77+
- "Feature one description"
78+
- "Feature two description"
79+
- "Feature three description"
80+
---
81+
```
82+
83+
Then in your post content:
84+
85+
```liquid
86+
{% include custom_list.html items=page.features type="feature" %}
87+
```
88+
89+
Available types:
90+
- `custom` - Arrow style list
91+
- `checklist` - Checkmark style
92+
- `feature` - Numbered circles
93+
- `icon` - Custom icons
94+
- `highlight` - Highlighted boxes
95+
- `compact` - Minimal spacing
96+
97+
## 4. Adding Custom Classes
98+
99+
```liquid
100+
{% include custom_list.html items=page.items type="custom" class="mt-3 mb-3" %}
101+
```

_layouts/post.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
<link rel="stylesheet" href="/assets/css/custom.css">

_posts/2025-11-21-solution-architect.md

Lines changed: 38 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -50,16 +50,15 @@ In this role, the solution architect is responsible not only for coding the solu
5050

5151
### Microservices and API Design
5252

53-
Microservices and API Design is the foundation of the software solution.
53+
Microservice architecture is one of the most popular architectural patterns for building scalable and maintainable software solutions.
5454

55-
- Microservices are a set of small, independent services that can be developed, deployed, and scaled independently.
56-
- API Design is the design of the API that will be used to communicate between the services.
55+
Microservices are a set of small, independent services that can be developed, deployed, and scaled independently. Along with API Design, they form the backbone of modern software architectures.
5756

58-
### Data Strategy and Data Management
57+
On the other hand, API Design is the design of the API that will be used to communicate between the services.
5958

60-
Data Strategy and Data Management is the foundation of the software solution.
59+
### Data Strategy and Data Management
6160

62-
- Data Strategy is the strategy for the data management of the software solution.
61+
Data Strategy is the strategy for the data management of the software solution.
6362

6463
## Phase 1: Architectural Patterns & Design
6564

@@ -69,12 +68,19 @@ _Goal_: **Prove you can design scalable, decoupled systems**.
6968

7069
Be ready to explain when not to use microservices. The `distributed monolith` is a common failure mode interviewers look for.
7170

72-
#### _Domain-Driven Design (DDD)_
71+
#### ***Domain-Driven Design (DDD)***
7372

7473
- **Bounded Contexts**: How to define service boundaries (this is crucial to avoid tight coupling).
7574

7675
- **Aggregates, Entities, Value Objects**: How to structure internal logic.
7776

77+
Question: _How do you identify bounded contexts in a legacy monolith?_
78+
Ready Answer: Analyze business capabilities, identify natural seams in the codebase, and look for areas with distinct data models or workflows.
79+
80+
Question: _What define the equality operator for Identity vs Value Object?_
81+
Ready Answer: Identity objects are compared by their unique identifier (ID), while Value Objects are compared based on their attributes or properties.
82+
83+
7884
#### **Design Patterns**
7985

8086
- **CQRS (Command Query Responsibility Segregation)**: Separating reads from writes for performance.
@@ -117,6 +123,24 @@ _Goal_: **Show deep expertise in the primary technology stack**.
117123

118124
- **Tools**: YARP (Yet Another Reverse Proxy) (Microsoft's current standard) or Ocelot.
119125

126+
>
127+
> **Question**: _When would you use gRPC over REST?_
128+
>
129+
> **Ready Answer**: _Use gRPC for high-performance, low-latency communication between internal microservices, especially when you need strong typing and support for streaming. REST is better suited for public APIs where human readability and broad client support are priorities._
130+
131+
132+
> **Question**: _What is the difference between Scoped and Transient services in .NET Dependency Injection?_
133+
>
134+
> **Ready Answer**: _
135+
> - Scoped services are created once per client request (or scope), meaning they are shared within that request but not across requests.
136+
>
137+
> - Transient services are created each time they are requested, so a new instance is provided every time they are injected._
138+
139+
> **Question**: _What is a .NET Generics?_
140+
>
141+
> **Ready Answer**: _Generics in .NET allow you to define classes, interfaces, and methods with a placeholder for the data type. This enables code reusability and type safety, as you can create data structures and algorithms that work with any data type without sacrificing performance or safety._
142+
143+
120144
## Phase 3: Data Strategy (SQL Server)
121145

122146
_Goal_: **Address the hardest part of distributed systems—state**.
@@ -312,3 +336,10 @@ Contract tests are used to test the contracts of the different units of code. Th
312336
Component tests are used to test the components of the different units of code. They are typically slower to run and can be run independently. A well known framework is `Testcontainers`. It allows to test the components of the different units of code in a containerized environment.
313337

314338
- [**Testcontainers**](https://testcontainers.com/): A container testing framework for .NET .
339+
340+
341+
342+
<ul class="checklist">
343+
<li>Your checklist item</li>
344+
<li>Another item</li>
345+
</ul>

0 commit comments

Comments
 (0)