diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index db439aee..8ddb2f04 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -87,7 +87,7 @@ jobs: - name: Install dependencies run: yarn install --no-ignore-optional --frozen-lockfile - name: Audit dependencies - run: yarn audit + run: yarn audit || true continue-on-error: true - name: Lint run: yarn lint diff --git a/.vscode/settings.json b/.vscode/settings.json index 1f3af54d..cb88406d 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -15,10 +15,17 @@ "prettier.printWidth": 120, "prettier.requireConfig": true, "prettier.useEditorConfig": false, - "scss.lint.important": "ignore", - "scss.lint.universalSelector": "ignore", "[markdown]": { - "editor.wordWrap": "on", - "editor.quickSuggestions": false - } + "editor.quickSuggestions": false, + "editor.trimAutoWhitespace": false, + "editor.wordWrap": "on" + }, + "stylelint.packageManager": "yarn", + "stylelint.validate": [ + "css", + "html", + "postcss", + "sass", + "scss" + ] } diff --git a/assets/sass/abstracts/_themes.scss b/assets/sass/abstracts/_themes.scss index 3e6a0ffc..230b9263 100644 --- a/assets/sass/abstracts/_themes.scss +++ b/assets/sass/abstracts/_themes.scss @@ -185,7 +185,5 @@ $color-logo2: #ffb900; $color-logo3: #009cdf; // Icons (modified twemojis) -// lightbulb on $icon-bulb-on: "data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjIgMzUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbC1ydWxlPSJub256ZXJvIiBmaWxsPSJub25lIj48cGF0aCBkPSJNMjIgMTEuMDZjMCA2LjQ0LTUgNy40NC01IDEzLjQ0IDAgMy4xLTMuMTIgMy4zNi01LjUgMy4zNi0yLjA1IDAtNi41OS0uNzgtNi41OS0zLjM2IDAtNi00LjkxLTctNC45MS0xMy40NEMwIDUuMDMgNS4yOS4xNCAxMS4wOC4xNCAxNi44OC4xNCAyMiA1LjAzIDIyIDExLjA2eiIgZmlsbD0iI0ZGRDk4MyIvPjxwYXRoIGQ9Ik0xNS4xNyAzMi41YzAgLjgzLTIuMjQgMi41LTQuMTcgMi41LTEuOTMgMC00LjE3LTEuNjctNC4xNy0yLjUgMC0uODMgMi4yNC0uNSA0LjE3LS41IDEuOTMgMCA0LjE3LS4zMyA0LjE3LjV6IiBmaWxsPSIjQ0NENkREIi8+PHBhdGggZD0iTTE1LjcgMTAuM2ExIDEgMCAwMC0xLjQgMEwxMSAxMy41OGwtMy4zLTMuM2ExIDEgMCAxMC0xLjQgMS40MmwzLjcgMy43VjI2YTEgMSAwIDEwMiAwVjE1LjQxbDMuNy0zLjdhMSAxIDAgMDAwLTEuNDJ6IiBmaWxsPSIjRkZDQzREIi8+PHBhdGggZD0iTTE3IDMxYTIgMiAwIDAxLTIgMkg3YTIgMiAwIDAxLTItMnYtNmgxMnY2eiIgZmlsbD0iIzk5QUFCNSIvPjxwYXRoIGQ9Ik01IDMyYTEgMSAwIDAxLS4xNi0xLjk5bDEyLTJhMSAxIDAgMTEuMzMgMS45N2wtMTIgMkEuOTMuOTMgMCAwMTUgMzJ6bTAtNGExIDEgMCAwMS0uMTYtMS45OWwxMi0yYTEgMSAwIDExLjMzIDEuOTdsLTEyIDJBLjkzLjkzIDAgMDE1IDI4eiIgZmlsbD0iI0NDRDZERCIvPjwvZz48L3N2Zz4K"; -// lightbulb off $icon-bulb-off: "data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjIgMzUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbC1ydWxlPSJub256ZXJvIiBmaWxsPSJub25lIj48cGF0aCBkPSJNMjIgMTEuMDZjMCA2LjQ0LTUgNy40NC01IDEzLjQ0IDAgMy4xLTMuMTIgMy4zNi01LjUgMy4zNi0yLjA1IDAtNi41OS0uNzgtNi41OS0zLjM2IDAtNi00LjkxLTctNC45MS0xMy40NEMwIDUuMDMgNS4yOS4xNCAxMS4wOC4xNCAxNi44OC4xNCAyMiA1LjAzIDIyIDExLjA2eiIgZmlsbD0iI0NDQ0JDQiIvPjxwYXRoIGQ9Ik0xNS4xNyAzMi41YzAgLjgzLTIuMjQgMi41LTQuMTcgMi41LTEuOTMgMC00LjE3LTEuNjctNC4xNy0yLjUgMC0uODMgMi4yNC0uNSA0LjE3LS41IDEuOTMgMCA0LjE3LS4zMyA0LjE3LjV6IiBmaWxsPSIjQ0NENkREIi8+PHBhdGggZD0iTTE1LjcgMTAuM2ExIDEgMCAwMC0xLjQgMEwxMSAxMy41OGwtMy4zLTMuM2ExIDEgMCAxMC0xLjQgMS40MmwzLjcgMy43VjI2YTEgMSAwIDEwMiAwVjE1LjQxbDMuNy0zLjdhMSAxIDAgMDAwLTEuNDJ6IiBmaWxsPSIjN0Q3QTcyIi8+PHBhdGggZD0iTTE3IDMxYTIgMiAwIDAxLTIgMkg3YTIgMiAwIDAxLTItMnYtNmgxMnY2eiIgZmlsbD0iIzk5QUFCNSIvPjxwYXRoIGQ9Ik01IDMyYTEgMSAwIDAxLS4xNi0xLjk5bDEyLTJhMSAxIDAgMTEuMzMgMS45N2wtMTIgMkEuOTMuOTMgMCAwMTUgMzJ6bTAtNGExIDEgMCAwMS0uMTYtMS45OWwxMi0yYTEgMSAwIDExLjMzIDEuOTdsLTEyIDJBLjkzLjkzIDAgMDE1IDI4eiIgZmlsbD0iI0NDRDZERCIvPjwvZz48L3N2Zz4K"; diff --git a/assets/sass/components/_global.scss b/assets/sass/components/_global.scss index 4059c385..be4aef11 100644 --- a/assets/sass/components/_global.scss +++ b/assets/sass/components/_global.scss @@ -67,7 +67,7 @@ a { } strong { - letter-spacing: 0.001em; + letter-spacing: 0.008em; // not sure why the discrepancy between weights } blockquote { diff --git a/content/notes/css-waving-hand-emoji/index.md b/content/notes/css-waving-hand-emoji/index.md index 91cd062d..6bd29402 100644 --- a/content/notes/css-waving-hand-emoji/index.md +++ b/content/notes/css-waving-hand-emoji/index.md @@ -18,38 +18,43 @@ If you examine [my homepage](/) long enough, you might notice the πŸ‘‹ hand emoj Below are the code snippets you can grab and customize to make your own ["waving hand" πŸ‘‹](https://emojipedia.org/waving-hand-sign/) emojis **_actually wave_**, and a [CodePen playground](https://codepen.io/jakejarvis/pen/pBZWZw) for live testing. +## Demo + {{< codepen username="jakejarvis" id="pBZWZw" left-tab="css" right-tab="result" >}} -## CSS: +## CSS ```css -span.wave { - animation-name: wave-animation; /* Refers to the name of your @keyframes element below */ - animation-duration: 2.5s; /* Change to speed up or slow down */ - animation-iteration-count: infinite; /* Never stop waving :) */ - transform-origin: 70% 70%; /* Pivot around the bottom-left palm */ +.wave { + animation-name: wave-animation; /* Refers to the name of your @keyframes element below */ + animation-duration: 2.5s; /* Change to speed up or slow down */ + animation-iteration-count: infinite; /* Never stop waving :) */ + transform-origin: 70% 70%; /* Pivot around the bottom-left palm */ display: inline-block; } @keyframes wave-animation { - 0% { transform: rotate( 0.0deg) } - 10% { transform: rotate(-10.0deg) } /* The following four values can be played with to make the waving more or less extreme */ - 20% { transform: rotate( 12.0deg) } - 30% { transform: rotate(-10.0deg) } - 40% { transform: rotate( 9.0deg) } - 50% { transform: rotate( 0.0deg) } /* Reset for the last half to pause */ - 100% { transform: rotate( 0.0deg) } + 0% { transform: rotate( 0.0deg) } + 10% { transform: rotate(14.0deg) } /* The following five values can be played with to make the waving more or less extreme */ + 20% { transform: rotate(-8.0deg) } + 30% { transform: rotate(14.0deg) } + 40% { transform: rotate(-4.0deg) } + 50% { transform: rotate(10.0deg) } + 60% { transform: rotate( 0.0deg) } /* Reset for the last half to pause */ + 100% { transform: rotate( 0.0deg) } } ``` -## HTML: +## HTML ```html {linenos=false} -πŸ‘‹ +

Hi there! πŸ‘‹

``` -That's it! More skin tones can be [found on πŸ“•Emojipedia](https://emojipedia.org/search/?q=waving+hand). +--- + +That's it! More hands and skin tones can be [found on πŸ“• Emojipedia](https://emojipedia.org/search/?q=waving+hand). ### πŸ‘‹πŸΌ Toodles! diff --git a/layouts/_default/single.amp.html b/layouts/_default/single.amp.html index 5a3b4469..c35481cb 100644 --- a/layouts/_default/single.amp.html +++ b/layouts/_default/single.amp.html @@ -82,7 +82,7 @@ background-color: #d2d2d2; } strong { - letter-spacing: 0.001em; + letter-spacing: 0.008em; } blockquote { border-left: 5px solid #0e6dc2; diff --git a/yarn.lock b/yarn.lock index b94d6d99..1a7518c0 100644 --- a/yarn.lock +++ b/yarn.lock @@ -556,12 +556,12 @@ braces@^3.0.1, braces@~3.0.2: fill-range "^7.0.1" browserslist@^4.1.1, browserslist@^4.12.0, browserslist@^4.12.2: - version "4.12.2" - resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.12.2.tgz#76653d7e4c57caa8a1a28513e2f4e197dc11a711" - integrity sha512-MfZaeYqR8StRZdstAK9hCKDd2StvePCYp5rHzQCPicUjfFliDgmuaBNPHYUTpAywBN8+Wc/d7NYVFkO0aqaBUw== + version "4.13.0" + resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.13.0.tgz#42556cba011e1b0a2775b611cba6a8eca18e940d" + integrity sha512-MINatJ5ZNrLnQ6blGvePd/QOz9Xtu+Ne+x29iQSCHfkU5BugKVJwZKn/iiL8UbpIpa3JhviKjz+XxMo0m2caFQ== dependencies: - caniuse-lite "^1.0.30001088" - electron-to-chromium "^1.3.483" + caniuse-lite "^1.0.30001093" + electron-to-chromium "^1.3.488" escalade "^3.0.1" node-releases "^1.1.58" @@ -679,14 +679,14 @@ camelcase@^6.0.0: integrity sha512-8KMDF1Vz2gzOq54ONPJS65IvTUaB1cHJ2DMM7MbPmLZljDH1qpzzLsWdiN9pHh6qvkRVDTi/07+eNGch/oLU4w== caniuse-db@^1.0.30001090: - version "1.0.30001093" - resolved "https://registry.yarnpkg.com/caniuse-db/-/caniuse-db-1.0.30001093.tgz#5a1cae72d94df1156f40f15d9079456e1b29d050" - integrity sha512-XqXxHR6Z9IN0BXLKMaTJ1NZ+US74cbKritholD6uaDLUWHiDj0QilpSb708wOcoGz0PmPRsXT/6zE+bjx+QSMw== + version "1.0.30001094" + resolved "https://registry.yarnpkg.com/caniuse-db/-/caniuse-db-1.0.30001094.tgz#52b199ae897c2551ac213da4e7e72d32c06c1f31" + integrity sha512-2eh4k7/QnSDJE+/UJI+enGQq9383WGQ+2nvOBrW0KMd17RyODdMXxb64jHTXBTLW7f7eBdB8PbyCJk6ZoiC8fA== -caniuse-lite@^1.0.30000887, caniuse-lite@^1.0.30001087, caniuse-lite@^1.0.30001088: - version "1.0.30001093" - resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001093.tgz#833e80f64b1a0455cbceed2a4a3baf19e4abd312" - integrity sha512-0+ODNoOjtWD5eS9aaIpf4K0gQqZfILNY4WSNuYzeT1sXni+lMrrVjc0odEobJt6wrODofDZUX8XYi/5y7+xl8g== +caniuse-lite@^1.0.30000887, caniuse-lite@^1.0.30001087, caniuse-lite@^1.0.30001093: + version "1.0.30001094" + resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001094.tgz#0b11d02e1cdc201348dbd8e3e57bd9b6ce82b175" + integrity sha512-ufHZNtMaDEuRBpTbqD93tIQnngmJ+oBknjvr0IbFympSdtFpAUFmNv4mVKbb53qltxFx0nK3iy32S9AqkLzUNA== caw@^2.0.0, caw@^2.0.1: version "2.0.1" @@ -892,9 +892,9 @@ color-name@~1.1.4: integrity sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA== colorette@^1.2.0: - version "1.2.0" - resolved "https://registry.yarnpkg.com/colorette/-/colorette-1.2.0.tgz#45306add826d196e8c87236ac05d797f25982e63" - integrity sha512-soRSroY+OF/8OdA3PTQXwaDJeMc7TfknKKrxeSCencL2a4+Tx5zhxmmv7hdpCjhKBjehzp8+bwe/T68K0hpIjw== + version "1.2.1" + resolved "https://registry.yarnpkg.com/colorette/-/colorette-1.2.1.tgz#4d0b921325c14faf92633086a536db6e89564b1b" + integrity sha512-puCDz0CzydiSYOrnXpz/PKd69zRrribezjtE9yd4zvytoRc8+RY/KJPvtPFKZS3E3wP6neGyMe0vOTlHO5L3Pw== commander@^2.19.0, commander@^2.20.0: version "2.20.3" @@ -1349,7 +1349,7 @@ duplexer@~0.1.1: resolved "https://registry.yarnpkg.com/duplexer/-/duplexer-0.1.1.tgz#ace6ff808c1ce66b57d1ebf97977acb02334cfc1" integrity sha1-rOb/gIwc5mtX0ev5eXessCM0z8E= -electron-to-chromium@^1.3.483: +electron-to-chromium@^1.3.488: version "1.3.488" resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.488.tgz#9226229f5fbc825959210e81e0bb3e63035d1c06" integrity sha512-NReBdOugu1yl8ly+0VDtiQ6Yw/1sLjnvflWq0gvY1nfUXU2PbA+1XAVuEb7ModnwL/MfUPjby7e4pAFnSHiy6Q==