via https://www.zhangxinxu.com/wordpress/2020/11/css-mix-blend-mode-filter-dark-theme/
css media 查询
1 | @media (prefers-color-scheme: dark) { |
js 检测
1 | window.matchMedia("(prefers-color-scheme: dark)").matches; |
js drag
via https://www.zhangxinxu.com/wordpress/2020/11/css-mix-blend-mode-filter-dark-theme/
1 | @media (prefers-color-scheme: dark) { |
js 检测
1 | window.matchMedia("(prefers-color-scheme: dark)").matches; |
js drag
查看
1 | defaults read -g com.apple.mouse.scaling |
设置 (推荐 8 - 10)
1 | defaults write -g com.apple.mouse.scaling 8 |
via https://docs.mapbox.com/mapbox-gl-js/style-spec/layers/#layout-line-line-miter-limit
Layout property. Optional enum. One of “butt”, “round”, “square”. Defaults to “butt”.
1 | test.map.setLayoutProperty('layer_goudao','line-cap','round') |
默认是 miter
Layout property. Optional enum. One of “bevel”, “round”, “miter”. Defaults to “miter”.
1 | test.map.setLayoutProperty('layer_goudao','line-join','round') |
拐弯:修饰 尖角
Layout property. Optional number. Defaults to 2. Requires line-join to be “miter”. Supports interpolateexpressions.
Used to automatically convert miter joins to bevel joins for sharp angles.
如果 line-join 是 “round” 的情况下 浅角(尖角的相反)
拐弯:修饰 浅角
Layout property. Optional number. Defaults to 1.05. Requires line-join to be “round”. Supports interpolateexpressions.
Used to automatically convert round joins to miter joins for shallow angles.
宽度必须偶数
Paint property. Optional resolvedImage. Transitionable.
Name of image in sprite to use for drawing image lines. For seamless patterns, image width must be a factor of two (2, 4, 8, …, 512). Note that zoom-dependent expressions will be evaluated only at integer zoom levels.
(线自己的)左右偏移(像素)
Paint property.
偏移
Paint property. Optional array of numbers. Units in pixels. Defaults to [0,0]. Supports interpolateexpressions. Transitionable.
1 | ~/Library/Preferences/ – (当前用户设置的进程) |
1 | # 查看anydesk服务名 |
默认是 1087(不是 1086 也不是 1089)
1 | export http_proxy='http://127.0.0.1:1087' |
测试地址
1 | curl https://www.bbc.com/ |
1 | alias p10='export http_proxy="http://127.0.0.1:1087";export https_proxy=$http_proxy;echo -e 已开启代理' |
或者
1 | function proxy(){ |
export http_proxy=这里不能有空格’http://127.0.0.1:1087'
1 | \e |
1 | red=`tput setaf 1` |
1 | echo "$(tput setaf 1)Red text $(tput setab 7)and white background$(tput sgr 0)" |
tput setab [1-7] # Set the background colour using ANSI escape
tput setaf [1-7] # Set the foreground colour using ANSI escape
Num Colour #define R G B
0 black COLOR_BLACK 0,0,0
1 red COLOR_RED 1,0,0
2 green COLOR_GREEN 0,1,0
3 yellow COLOR_YELLOW 1,1,0
4 blue COLOR_BLUE 0,0,1
5 magenta COLOR_MAGENTA 1,0,1
6 cyan COLOR_CYAN 0,1,1
7 white COLOR_WHITE 1,1,1
1 | ,--, .-. .-. .---. .---. .-. .-..-. .-. .--. .-. .-. ,--, |
Command+Shift+p 输入 shell
选择 install code command in path
在终端打开项目
1 | code 目录名 |
其实是放了链接
1 | /usr/local/bin |
查看
1 | which code |
1 | open -a "Visual Studio Code" |
https://dockyard.com/blog/2019/07/15/follow-these-steps-to-enable-vs-code-color-customization
编辑 .vscode/settings.json
1 | { |
Open Terminal
Run touch ~/.gitignore_global to create a global .gitignore file in your home directory
Run open ~/.gitignore_global to open the file
Add .vscode/ to the file
Run git config –global core.excludesfile ~/.gitignore_global
1 | sudo apachectl start |
1 | sudo apachectl stop |
配置文件路径为 /etc/apache2/httpd.conf
站点的根目录为 /Library/WebServer/Documents/
升级 mac monterey 以后 git 坏了
1 | xcode-select --install |
This will download and install the Command Line Tools package and fix the problem.
You do not need Xcode, you can install only the Command Line Tools here, it is about 130Mb.
If the above alone doesn’t do it, then also run:
xcode-select –reset
第三方 dozer 或者 Bartender
官网
官网因墙有问题
1 | /bin/zsh -c "$(curl -fsSL https://gitee.com/cunkai/HomebrewCN/raw/master/Homebrew.sh)" |
https://makeoptim.com/tool/terminal
注意:要下载字体,否则显示问号
如果是在默认shell下,
sudo ln -s “/Applications/Sublime\ Text.app/Contents/SharedSupport/bin/subl” /usr/bin/subl
使用zsh的可以使用以下命令
alias subl=”‘/Applications/Sublime Text.app/Contents/SharedSupport/bin/subl’”
alias nano=”subl”
export EDITOR=”subl”
====
alias subl=”open -a Sublime\ Text\ 2”
保存后执行source ~/.bash_profile,然后就可以用subl打开文本了
https://www.w3schools.com/js/js_async.asp
search()的参数是正则表达式,而indexOf()的参数只是普通的字符串。indexOf()是比search()更加底层的方法。
如果只是兑一个具体字符串来茶渣检索,那么使用indexOf()的系统资源消耗更小,效率更高;如果查找具有某些特征的字符串(例如查找以a开头,后面是数字的字符串),那么indexOf()就无能为力,必须要使用正则表达式和search()方法了。
大多是时候用indexOf()不是为了真的想知道子字符串的位置,而是想知道长字符串中有没有包含这个子字符串。若果返回索引为-1,那么说明没有,反之则有。
startsWith endsWith includes
search find findIndex
似乎比 indexOf 厉害一点
1 | var arr = ['a','b', 'c', NaN]; |
1 | var arr = new Array(3); |
1 | a = Array(10).fill({'hello':'goodbye'}); |
1 | aa = Array(10).fill().map(k=>({hello:'world'})); |
// 只有第一个会变 // 以下皆是
1 | aaa = Array.from({length:10},()=> ({'hello':'goodbye'})) |
1 | aaaa = [...new Array(10)].map(()=> ({'hello':'goodbye'})); |
https://www.samanthaming.com/tidbits/22-2-ways-to-repeat-strings/
ref 和 reactive 一个针对原始数据类型,而另一个用于对象,这两个API都是为了给JavaScript普通的数据类型赋予响应式特性(reactivity)。
1 | const dataAsRefs = toRefs(data); |
1 | <template> |
子组件
1 | <!-- Form.vue --> |
父组件
1 | <!-- App.vue --> |
1 | <!-- Form.vue --> |
git pull是git fetch和git merge两个步骤的结合
vscode 的 sync 等于下面
1 | git pull origin someBranch |
几个思路:
1 | /* default link color is blue */ |
1 | <div class="parent"> |
flex order 或者 row-reverse 。 DOM 在后但显示“在前”。
1 | ul li:nth-child(-n+2) |
via https://stackoverflow.com/questions/1817792/is-there-a-previous-sibling-selector
via https://coolcssanimation.com/how-to-trigger-a-css-animation-on-scroll/
1 | var io = new IntersectionObserver(callback, option); |
1 | function query(selector) { |
1 | var intersectionObserver = new IntersectionObserver( |
观测 resize
https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView
scrollIntoView()
默认是
scrollIntoView(true)
也就是
scrollIntoView({block: “start”, inline: “nearest”})
scrollIntoView({block: “end”, inline: “nearest”})
behavior Optional
Defines the transition animation. One of auto or smooth. Defaults to auto.
block Optional
Defines vertical alignment. One of start, center, end, or nearest. Defaults to start.
inline Optional
Defines horizontal alignment. One of start, center, end, or nearest. Defaults to nearest.
1 | obj.scrollIntoView( |
1 | .container { |
1 | for (var i = 0; i < btns.length; i++) { |
1 | var iframe = document.getElementById("myFrame"); |
1 | function myFunction(x) { |
1 | <defs> |