Welcome to Cyrus Yip’s blog. It contains articles about Linux, programming, etc. I may write anything.
Introduction to CSS BEM Naming Convention
BEM (Block, Element, Modifier) is a naming convention for class names in HTML and CSS. It makes HTML and CSS code more orgranized. Concepts and Usage # Don’t worry if you don’t understand it at first. There are examples later on. Block: independent HTML element (such as <nav>), and it may not contain any HTML elements. Element: any HTML element inside a block, it can’t be independently used (example: <li>), and double underscores __ should be added before it. Modifier: it indicates the state or appearance of a block or element, and double hyphens -- should be added before it. Use single hyphen to connect words, example: search-form. An element only belongs to a block, not another element. Wrong: block__element1__element2. Correct: block__element2. When using modifier, keep the class name without the modifier. Example: <a class="menu__link menu__link--active" href="/en/">Home</a>. HTML Demo # <nav> is a block, which contains the elements <ul>, <li> and <a>. --active is a modifier.
Run Different Versions of Hugo without Installation via npx
npx lets you run different versions of Hugo without installation. To use it, install Node.js and npm at first. Run different versions # The syntax of npx is npx <package-name>@<version>. If @<version> is not specified, the locally installed version or latest version will be used. Here are some examples: 1 2 3 4 5 6 7 8 9 10 # local installed version or latest version npx hugo-extended # Hugo latest npx hugo-extended@latest # Hugo v0.121.0 npx [email protected] npx [email protected] version npx [email protected] server # Hugo v0.99.1 npx [email protected] version Available versions are listed here. Oldest version is 0.63.2. If you want to use the older versions, use hugo-bin package instead. Its version doesn’t match the Hugo version, so you have to check its commit history.
How to Change Network Configuration on Proxmox VE
When a Proxmox server connects to a new network (e.g. a new router), its network configuration needs to be changed. Edit /etc/network/interfaces and /etc/hosts to change IP address and gateway, /etc/resolv.conf to change DNS. Then reboot the system. 1 2 3 4 # Use nano to edit nano /etc/{network/interfaces,hosts,resolv.conf} # Use Vim to edit vim -p /etc/{network/interfaces,hosts,resolv.conf} 1 reboot
How to Enable Call Recording on Xiaomi / Redmi / MIUI
Call recording in phone: Open Settings -> Apps -> System app settings -> Call settings -> Call recording -> enable “Call recording notification” and “Record calls automatically” Call recording in apps: Open Settings -> Apps -> System app settings -> Recorder -> Voice Call Recorder -> enable “Voice Call Recorder” and “Record calls automatically” (WeChat and QQ are supported) Call Recording may be unavailable on non-China MIUI. This tutorial was tested on Redmi K40s (MIUI 14.0.7.0.TLMCNXM) and Redmi Note 12 Turbo.
Create Top-Level 404 Page for a Multilingual Hugo Site
If you build a multilangual Hugo site, you may want to enable defaultContentLanguageInSubdir to make URLs look consistent. For example: /en/post/an-english-post /cn/post/a-chinese-post As of Hugo v0.120.4, defaultContentLanguageInSubdir = "true" still has the side effect that no 404 page (404.html) is generated at the root of public directory, which causes Cloudflare Pages to redirect non-exstent pages to root /. 404.html at the root is needed to fix the problem. There are three workarounds: reuse 404.html in a subdirectory, create 404.md, and create custom 404.html in static directory. You don’t need these workarounds if you don’t enable defaultContentLanguageInSubdir.
How to Fix Banking Apps / SafetyNet / Play Integrity on LineageOS without Root
Summary # Flash ih8sn provided by althafvly or your maintainer(s) via Lineage Recovery, and banking apps will work correctly. Explanation # When you use banking apps on LineageOS without root, they may show the misleading error message that your device is rooted. Banking apps actually check SafetyNet or Play Integrity, both of which are used to verify device integrity. After flashing ih8sn, LineageOS will pass those two tests, banking apps won’t complain any more, and Netflix will be available on Google Play. You can install YASNAC and Play Integrity API Checker to check. LineageOS will pass Basic integrity and CTS profile match on the former, MEET_DEVICE_INTEGRITY and MEET_BASIC_INTEGRITY on the latter.
How to Install Google Play On Xiaomi / Redmi / MIUI / HyperOS
Guide # China Xiaomi / Redmi phones in Google Play supported devices1 have built-in Google Services. We just need to install Google Play. Turn on Google Services MIUI: Settings -> Account & sync -> Basic Google Services HyperOS: Settings -> Additional settings -> Account & sync -> Basic Google Services Install Google Play: search “google play” on GetApps, and install or update “Google Play Store”. If Google Play isn’t found on GetApps, install it from Aptoide. Now you should find Play Store on the home screen.
How to Install the Latest Microcode on Proxmox VE (Debian stable)
In this tutorial, I will help you install the latest microcode in a upgradable way so that you can upgrade it via apt command. Please don’t install packages except microcode packages from the unstable repository to avoid a broken system. This tutorial was tested on Proxmox VE 7.4 / 8.0.2 . Microcode is the firmware used to fix bugs in the CPU. It should be installed only on the host instead of virtual machines because microcode updates are applied during boot. We need to install it from the Debian unstable repository because microcode packages in Proxmox (Debian stable) may be out of date.
Upgrading NixOS to Unstable Channel
As an Arch Linux user, I am used to using the lastest packages. Thus, I upgrade my NixOS to unstable channel. 1 2 3 4 5 # switch channel sudo nix-channel --add https://nixos.org/channels/nixos-unstable nixos sudo nixos-rebuild switch --upgrade # show version nixos-version References: Upgrading NixOS - NixOS manual https://channels.nixos.org/
Fixing File Permission Problem of Jellyfin on Arch Linux
This tutorial should work for other Linux distributions, but I only tested it on Arch Linux. In order to add a directory to a Jellyfin library, Jellyfin needs to access the directory and all its parent directories. If you add ~/Videos to a library, Jellyfin fails to access it. Jellyfin runs as user jellyfin. Jellyfin can access ~/Videos (other::r-x) but can’t access its parent ~ (other::---). 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 ❯ getfacl ~/Videos getfacl: Removing leading '/' from absolute path names # file: home/cyrusyip/Videos # owner: cyrusyip # group: cyrusyip user::rwx group::r-x mask::r-x other::r-x ❯ getfacl ~ getfacl: Removing leading '/' from absolute path names # file: home/cyrusyip # owner: cyrusyip # group: cyrusyip user::rwx group::--- mask::--- other::--- To fix it, grant Jellyfin execution permission for the home directory.