tips ARTS Linux

ARTS 04 - 用 CSS 实现主题切换

Posted by Calvin on 2020-06-14

前言：什么是ARTS?

ARTS 源于耗子叔在极客时间的专栏《左耳听风》打卡活动。

Algorithm：每周至少做一个 Leetcode 的算法题。主要是为了编程训练和学习。

Review：阅读并点评至少一篇英文技术文章。主要是为了学习英文，如果你的英文不行，你基本上无缘技术高手。

Tip：学习至少一个技术技巧。主要是为了总结和归纳你在日常工作中所遇到的知识点。

Share：分享一篇有观点和思考的技术文章。主要是为了建立你的影响力，能够输出价值观。

Algorithm

面试题10- I. 斐波那契数列

写一个函数，输入 n ，求斐波那契（Fibonacci）数列的第 n 项。斐波那契数列的定义如下：

F(0) = 0,   F(1) = 1
F(N) = F(N - 1) + F(N - 2), 其中 N > 1.

斐波那契数列由 0 和 1 开始，之后的斐波那契数就是由之前的两数相加而得出。

答案需要取模 1e9+7（1000000007），如计算初始结果为：1000000008，请返回 1。

C 语言代码

int fib(int n){
    if (n == 0) return 0;
    unsigned int f0 = 0, f1 = 1, f2 = f0 + f1;
    for (int i = 0; i < n - 1; ++i) {
        f2 = (f0 + f1) % 1000000007;
        f0 = f1;
        f1 = f2;
    }
    return f1;
}

Review

iOS 代码混淆实现

如果你项目中的代码和显存的产品有大量重复代码，亦或是你做的 App 对安全性要求比较高，为了通过 Apple 的审核和防止代码被反编译，这时候代码混淆就特别必要了，这篇文章通过 clang 过滤出类名和方法名，然后在从四六级单词词库里随机生成映射对应的类名和方法名来进行代码混淆。思路很不错。

这里展示一段对映射的类做混淆的代码，如果你有代码混淆的需求，也想了解一下代码混淆的原理，推荐阅读一下这篇文章。

#!/bin/bash
PROJECT_DIR=`cat ../path.txt`
echo $PROJECT_DIR
RENAME_CLASSES=rename_classes.txt
#First, we substitute the text in all of the files.
sed_cmd=`sed -e 's@^@s/[[:<:]]@; s@[[:space:]]\{1,\}@[[:>:]]/@; s@$@/g;@' ${RENAME_CLASSES} `
find ${PROJECT_DIR} -type f \
    \( -name "*.pbxproj" -or -name "*.pch" -or -name "*.h" -or -name "*.m" -or -name "*.xib" -or -name "*.storyboard" \) \
    -exec sed -i "" "${sed_cmd}" {} +
# Now, we rename the .h/.m files
while read line; do
    class_from=`echo $line | sed "s/[[:space:]]\{1,\}.*//"`
    class_to=`echo $line | sed "s/.*[[:space:]]\{1,\}//"`
    #修改 .h .m
    find ${PROJECT_DIR} -type f -regex ".*[[:<:]]${class_from}[[:>:]][^\/]*\.[hm]" -print | egrep -v '.bak$' | \
    while read file_from; do
         file_to=`echo $file_from | sed "s/\(.*\)[[:<:]]${class_from}[[:>:]]\([^\/]*\)/\1${class_to}\2/"`
         echo mv "${file_from}" "${file_to}"
         mv "${file_from}" "${file_to}"
    done
    
    #修改 .xib
    find ${PROJECT_DIR} -type f -regex ".*[[:<:]]${class_from}[[:>:]][^\/]*\.xib" -print | egrep -v '.bak$' | \
    while read file_from; do
         file_to=`echo $file_from | sed "s/\(.*\)[[:<:]]${class_from}[[:>:]]\([^\/]*\)/\1${class_to}\2/"`
         echo mv "${file_from}" "${file_to}"
         mv "${file_from}" "${file_to}"
    done
done < ${RENAME_CLASSES}

Tip

Linux ⽹络状态查看⼯具

net-tools

  • ifconfig
  • route
  • netstat

iproute2

  • ip
  • ss

Linux 网络状态查看命令

root 用户查看

ifconfig

普通用户查看

/sbin/ifconfig

eth0 第⼀块⽹卡（⽹络接⼝）

你的第⼀个⽹络接⼝可能叫做下⾯的名字

  • eno1 板载⽹卡
  • ens33 PCI-E⽹卡
  • enp0s3 ⽆法获取物理信息的 PCI-E ⽹卡
  • CentOS 7 使⽤了⼀致性⽹络设备命名，以上都不匹配则使⽤ eth0

Linux ⽹络接⼝命名修改

⽹卡命名规则受 biosdevname 和 net.ifnames 两个参数影响

编辑 /etc/default/grub ⽂件，增加 biosdevname=0 net.ifnames=0

更新 grub

grub2-mkconfig -o /boot/grub2/grub.cfg

重启

reboot
biosdevname net.ifnames 网卡名
默认 0 1 ens33
组合1 1 0 em1
组合2 0 0 eth0

Linux 查看⽹络情况

查看⽹卡物理连接情况

mii-tool eth0

Linux 查看⽹关命令

route -n

使⽤ -n 参数不解析主机名

Share

Quick & Dirty Theme Switcher

博主 Bradley Taunt 是一个前端开发者，前几天他写了一篇使用 CSS 实现网站主题切换的文章 Quick & Dirty Theme Switcher。

首先在 HTML 里定义主题切换按钮

<div class="color-select">
    <button onclick="toggleDefaultTheme()"></button>
    <button onclick="toggleSecondTheme()"></button>
    <button onclick="toggleThirdTheme()"></button>
</div>

设置默认的主题

<html class="theme-default">

接下来 CSS 里面设置主题配色

.theme-default {
   --accent-color: #72f1b8;
   --font-color: #34294f;
}
.theme-second {
    --accent-color: #FFBF00;
    --font-color: #59316B;
}
.theme-third {
    --accent-color: #d9455f;
    --font-color: #303960;
}
body {
    background-color: var(--accent-color);
    color: var(--font-color);
}

再美化一下主题切换按钮的样式

.color-select button {
    -moz-appearance: none;
    appearance: none;
    border: 2px solid;
    border-radius: 9999px;
    cursor: pointer;
    height: 20px;
    margin: 0 0.8rem 0.8rem 0;
    outline: 0;
    width: 20px;
}
/* Style each swatch to match the corresponding theme */
.color-select button:nth-child(1) { background: #72f1b8; border-color: #34294f; }
.color-select button:nth-child(2) { background: #FFBF00; border-color: #59316B; }
.color-select button:nth-child(3) { background: #d9455f; border-color: #303960; }

最后 JavaScript 来进行主题切换

// Set a given theme/color-scheme
function setTheme(themeName) {
    localStorage.setItem('theme', themeName);
    document.documentElement.className = themeName;
}
// Toggle between color themes
function toggleDefaultTheme() {
    if (localStorage.getItem('theme') !== 'theme-default'){
        setTheme('theme-default');
    }
}
function toggleSecondTheme() {
    if (localStorage.getItem('theme') !== 'theme-second'){
        setTheme('theme-second');
    }
}
function toggleThirdTheme() {
    if (localStorage.getItem('theme') !== 'theme-third'){
        setTheme('theme-third');
    }
}
// Immediately set the theme on initial load
(function () {
    if (localStorage.getItem('theme') === 'theme-default') {
        setTheme('theme-default');
    }
    if (localStorage.getItem('theme') === 'theme-second') {
        setTheme('theme-second');
    }
    if (localStorage.getItem('theme') === 'theme-third') {
        setTheme('theme-third');
    }
})();

Xbox 里面的父亲

一篇 2014 年的感人故事，儿子在 Xbox 里面发现了过世父亲的身影，故事发生在国外：原文链接

Well, when i was 4, my dad bought a trusty XBox.
我4岁的时候，父亲买了一台Xbox

you know, the first, ruggedy, blocky one from 2001.
你知道的，是那台坚硬、结实，2001年推出的Xbox

we had tons and tons and tons of fun playing all kinds of games together
我们一起玩了许多游戏，而且玩得非常开心….

until he died, when i was just 6.
…直到他去世为止，那年我才6岁

i couldnt touch that console for 10 years.
在往后十年，我没有办法碰那台游戏机

but once i did, i noticed something.
直到有一次我打开它，我发现了一件事情

we used to play a racing game, Rally Sports Challenge.
过去我曾与父亲玩过一款叫做《越野挑战赛》的赛车游戏

actually pretty awesome for the time it came.
实际上在当年，它真的很好玩

and once i started meddling around… i found a GHOST.literaly.
而当我开始在这款游戏中四处浏览时，我遇到了货真价实的”幽灵”。

you know, when a time race happens,
在这款赛车游戏的计时赛中

that the fastest lap so far gets recorded as a ghost driver?
最佳纪录保持者的记录将会以幽灵车手状态出来与你一同赛车

yep, you guessed it
是的，你猜到了！

his ghost still rolls around the track today.
父亲的灵魂至今仍在赛车场上奔驰着

and so i played and played,and played,
于是我一遍又一遍的挑战

untill i was almost able to beat the ghost.
我慢慢的可以追上这位幽灵车手

until one day i got ahead of it,i surpassed it, and…
终于有一天，我成功了！我超越祂了！然后…

i stopped right in front of the finish line,
我在终点线前停下来

just to ensure i wouldnt delete it.
确保我不会就这样删除”父亲的记录”。


FEATURED TAGS
tips ARTS Linux
FRIENDS