# Changelog
:::warning
#### Table of Content
- [To Dos](#To-Dos)
- [2024](#2024)
:::
## To Dos
*To Be Update...*
## 2024
### Sat, Apr 13
- Redeployed blog to Blot.im, removed Hyvor blogs
- Set the color tone to blue, accent color `#0089A7`
[新橋 SHINBASHI](https://nipponcolors.com/#shinbashi)
- Move newsletter service to Quail, the Acumbamail is now suspended.
### Sat, Apr 6
- Move [Chagelog](https://eyewithouts.com/changelog) to HackMD
### Fri, Apr 5
- Add [Tools](https://eyewithouts.com/eyewithouts-tools) page
### Sun, Mar 31
- Chang font style to [Chiron Sung HK](https://github.com/chiron-fonts/chiron-sung-hk)
### Tue, Mar 19
- Color style changes
- Light theme background main color `#FCFAF2` [白練 SHIRONERI](https://nipponcolors.com/#shironeri), secondary color `#F9F5e7` [tint color](https://www.color-hex.com/color/f7f2dd)
- Primary color `#CB4042` [赤紅 AKABENI](https://nipponcolors.com/#akabeni)
- Secondary color `#F19483` [曙 AKEBONO](https://nipponcolors.com/#akebono)
### Sat, Mar 2
- Update the style of TOC (table of contents)
> Hyvor released the TOC in Feb 2024, that is one of my strong requests but lack of design for the templates.
- Add `文章目錄` at the top of TOC block, using `::before` in css.
- Set the margin, padding and background color.
- The scroll bar of a axis is `auto` for a better experience on mobile devices.
#### References
- [CSS 語法,文字換行,強迫不換行。](https://www.puritys.me/docs-blog/article-31-CSS-%E8%AA%9E%E6%B3%95%EF%BC%8C%E6%96%87%E5%AD%97%E6%8F%9B%E8%A1%8C%EF%BC%8C%E5%BC%B7%E8%BF%AB%E4%B8%8D%E6%8F%9B%E8%A1%8C%E3%80%82.html)
- [div 添加滾動條](https://www.runoob.com/w3cnote/div-scroll.html)
### Wed, Feb 28
- Add `Small Number Sign` before post header
Update the css [::before](https://developer.mozilla.org/zh-CN/docs/Web/CSS/::before) for the Header of each post with links.
:::info
#### :bulb: How?
Add Small Number Sign [Unicode Character “﹟” (U+FE5F)](https://www.compart.com/en/unicode/U+FE5F) and set the indent.
```css
h1, h2, h3, h4, h5, h6 {
a[href^="#"] {
text-decoration: none;
box-shadow: none;
}
a[href^="#"]::before {
content: "﹟";
margin-left: -1em;
color: var(--color-content-secondary);
}
a[href^="#"]:hover {
box-shadow: none;
}
}
```
:::
- [Install Umami on zeabur](https://zeabur.com/docs/zh-TW/marketplace/umami) for website analytics
### Wed, Feb 21
- Set the accent color to`#2C6293` and text color to `#0A0C1DEE` .
### Thu, Feb 15
- Move [Chagelog page](https://eyewithouts.com/changelog) to Craft from Gridea.
- Activate domain `eyewithouts.com` and retired the rest of all.
### Sun, Feb 11
- Update Newsletter Service
:::info
#### :bulb: Why?
I have been using [Quail](https://quail.ink/) for weekly newsletter delivery since the brand reposition to [Warm & Wise](https://warmandwise.com/) . However, the subscriber management is mush simpler on Quail than other service.
By studying the email blasting service I had taken, I decided to move the subscription form to Acumbamail, which is one of the best email marketing tool I have used, supporting html code embedding and also the full-functioned subscriber management.
Will keep using Quail for weekly newsletter, one annoying steps is have to add the new subscriber to Quail manually.
:::
### Thu, Feb 8
- Update the blockquote style on mobile
:::info
#### :bulb: Blockquote Style Update
> The old blockquote style have an ugly right margin, and now be fixed with newly updated css setting.
`font.css`
```css
/* 引用區塊字體變換 */
.container > .main > .entry > blockquote > p { /* 引用區塊內段落 */
font-weight: 400;
font-size: 0.95em;
color: inherit;
}
```
`style.css`
```css
blockquote { /* 引用區塊 */
border-color: {{accent_color}} !important;
border-left: 0.3em solid;
color: inherit;
margin: 0;
padding-left: 1.4em;
padding-right: 1.0em;
padding-top: 0.2em;
padding-bottom: 0.2em;
opacity: 1.0;
background-color: {{accent_color}}11 !important;
box-shadow: 2px 2px 2px 1px rgba(220, 220, 220, .2);
}
```
Not sure what is the below style setting for, hided from now and keep monitoring is any missing in other pages.
`style.css`
```css
/* 查詢下面好像不具有意義,思考是否要刪除 */
/*
.margin blockquote {margin: 1em 0 !important;padding: 3px 6px;line-height:18px;}
.margin blockquote p {margin: 0}
*/
```
:::
### Sat, Feb 3
- Redesign the logo / icon
:::info
#### :bulb: Logo Design (Retired)
The 1st logo is from [Bing AI image creator](https://www.bing.com/images/create) which is echo to `warmandwise`, by using the symbol [ampersand](https://en.wikipedia.org/wiki/Ampersand) . However, I was not quite comfortable and would like to have a simpler one. Then I took back the spiritual name `Bamor` with my family name `Liu` as the author, and the idea for carting a new log is coming.
With the prompt `a circle icon, mainly design by letter "B" and "L", to demonstrate the simple life of a boy, in light color` in Bing AI images creator, I got below 4 cute results.
![6KMboXVj3.png](https://static.gridea.dev/e5a388dc-767b-4d43-a09a-c76583d8b432/6KMboXVj3.png)
Love all, but to choose the right top one, cropping the circle and boy. It's my new icon, simple, dynamic.
:::
### Wed, Jan 31
- Umami changes: removed self-host umami, add cloud based umami service.
:::info
#### :bulb: Why?
Supabase has [retired the PGBouncer](https://github.com/orgs/supabase/discussions/17817) on Jan 26th, that I found cannot login into my self-hosted umami account which database is on Supabase and deployed on Netlify.
Start from now, for privacy, I am using Cloudflare web analysis and Umami for website traffic tracking.
:::
### Tue, Jan 23
- Update the blockquote area style
:::info
#### :bulb: How?
By referring the style from [Code and Me](https://blog.kyomind.tw/) , to update the block quote area with shadow for better experience.
```css
.container > .main > .entry blockquote { /* 引用區塊背景與背影 */
background-color: {{accent_color}}11 !important;
box-shadow: 2px 2px 2px 1px rgba(220, 220, 220, .2);
}
```
:::