jake/jarv.is
jake/jarv.is
1
Fork 0
mirror of https://github.com/jakejarvis/jarv.is.git synced 2025-04-26 07:05:21 -04:00
Code Issues

run prettier over every file

Browse Source
This commit is contained in:
Jake Jarvis 2021-10-31 16:51:19 -04:00
parent f4ebeeb1b8
commit c7fdda36af
Signed by: jake
GPG Key ID: 2B0C9CF251E69A39
16 changed files with 34 additions and 79 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
.devcontainer/devcontainer.json
View File

@ -32,6 +32,12 @@
// Set *default* container specific settings.json values on container create.
"settings": {
"editor.tabSize": 2,
"editor.insertSpaces": true,
"editor.rulers": [120],
"files.eol": "\n",
"files.insertFinalNewline": true,
"files.trimTrailingWhitespace": true,
"css.validate": false,
"scss.validate": false,
"html.format.templating": true,

2
.prettierrc.json
View File

@ -1,5 +1,5 @@
{
"printWidth": 100,
"printWidth": 120,
"tabWidth": 2,
"singleQuote": false
}

14
.stylelintrc.json
View File

@ -1,22 +1,12 @@
{
"extends": [
"stylelint-config-standard-scss",
"stylelint-config-sass-guidelines",
"stylelint-prettier/recommended"
],
"extends": ["stylelint-config-standard-scss", "stylelint-config-sass-guidelines", "stylelint-prettier/recommended"],
"plugins": ["stylelint-no-unsupported-browser-features", "stylelint-prettier"],
"rules": {
"color-hex-length": "long",
"max-nesting-depth": 6,
"order/order": null,
"order/properties-alphabetical-order": null,
"plugin/no-unsupported-browser-features": [
true,
{
"severity": "warning",
"ignore": ["flexbox"]
}
],
"plugin/no-unsupported-browser-features": [true, { "severity": "warning", "ignore": ["flexbox"] }],
"selector-max-compound-selectors": null,
"selector-max-id": null,
"selector-no-qualifying-type": null,

8
api/contact.js
View File

@ -4,8 +4,7 @@ import queryString from "query-string";
// fallback to dummy secret for testing: https://docs.hcaptcha.com/#integration-testing-test-keys
const HCAPTCHA_SITE_KEY = process.env.HCAPTCHA_SITE_KEY || "10000000-ffff-ffff-ffff-000000000001";
const HCAPTCHA_SECRET_KEY =
process.env.HCAPTCHA_SECRET_KEY || "0x0000000000000000000000000000000000000000";
const HCAPTCHA_SECRET_KEY = process.env.HCAPTCHA_SECRET_KEY || "0x0000000000000000000000000000000000000000";
const HCAPTCHA_API_ENDPOINT = "https://hcaptcha.com/siteverify";
const { AIRTABLE_API_KEY, AIRTABLE_BASE } = process.env;
@ -37,9 +36,8 @@ export default async (req, res) => {
const { body } = req;
// these are both backups to client-side validations just in case someone
// squeezes through without them. the codes are identical so they're caught
// in the same fashion.
// these are both backups to client-side validations just in case someone squeezes through without them. the codes
// are identical so they're caught in the same fashion.
if (!body.name || !body.email || !body.message) {
// all fields are required
throw new Error("USER_MISSING_DATA");

11
api/tracks.js
View File

@ -27,11 +27,7 @@ export default async (req, res) => {
if (req.method !== "GET") {
throw new Error(`Method ${req.method} not allowed.`);
}
if (
!process.env.SPOTIFY_CLIENT_ID ||
!process.env.SPOTIFY_CLIENT_SECRET ||
!process.env.SPOTIFY_REFRESH_TOKEN
) {
if (!process.env.SPOTIFY_CLIENT_ID || !process.env.SPOTIFY_CLIENT_SECRET || !process.env.SPOTIFY_REFRESH_TOKEN) {
throw new Error("Spotify API credentials aren't set.");
}
@ -47,10 +43,7 @@ export default async (req, res) => {
response = await getTopTracks();
// let Vercel edge and browser cache results for 3 hours
res.setHeader(
"Cache-Control",
"public, max-age=10800, s-maxage=10800, stale-while-revalidate"
);
res.setHeader("Cache-Control", "public, max-age=10800, s-maxage=10800, stale-while-revalidate");
}
res.setHeader("Access-Control-Allow-Methods", "GET");

7
assets/js/src/contact.js
View File

@ -29,10 +29,9 @@ if (contactForm) {
// https://simonplend.com/how-to-use-fetch-to-post-form-data-as-json-to-your-api/
const formData = Object.fromEntries(new FormData(event.currentTarget).entries());
// some client-side validation, these are all also checked on the server
// to be safe but we can save some unnecessary requests here.
// we throw identical error messages to the server's so they're caught in
// the same way below.
// some client-side validation. these are all also checked on the server to be safe but we can save some
// unnecessary requests here.
// we throw identical error messages to the server's so they're caught in the same way below.
if (!formData.name || !formData.email || !formData.message) {
throw new Error("USER_MISSING_DATA");
}

3
assets/js/src/dark-mode.js
View File

@ -17,8 +17,7 @@ initDarkMode({
// make toggle visible now that we know JS is enabled
t.style.display = "block";
// HACK: re-enable theme transitions after a very short delay, otherwise
// there's a weird race condition (2/2)
// HACK: re-enable theme transitions after a very short delay, otherwise there's a weird race condition (2/2)
setTimeout(() => {
document.head.removeChild(disableTransitionCSSHack);
}, 500);

5
assets/js/src/projects.js
View File

@ -28,10 +28,7 @@ if (wrapper) {
<div class="repo-meta">
${repo.language
? html`<div class="repo-meta-item">
<span
class="repo-language-color"
style="background-color: ${ifDefined(repo.language.color)}"
></span>
<span class="repo-language-color" style="background-color: ${ifDefined(repo.language.color)}"></span>
<span>${repo.language.name}</span>
</div>`
: null}

23
assets/sass/abstracts/_functions.scss
View File

@ -7,13 +7,12 @@
// Gradient hack to get our custom underline to wrap:
// https://www.dannyguo.com/blog/animated-multiline-link-underlines-with-css/
@function underline-hack($color) {
// [deprecated] Calculate lighter underline color compared to text
// color by mix()'ing with background (#fff) to give the impression
// of opacity but with MUCH better compatibility.
// [deprecated] Calculate lighter underline color compared to text color by mix()'ing with background (#fff) to give
// the impression of opacity but with MUCH better compatibility.
// $color-opaque-hex: mix($color, $link-opacity-color, $link-underline-opacity);
// Less compatible but better for light/dark mode switching.
// We fall back to non-alpha hex colors with postcss-color-rgba-fallback to mitigate this.
// Less compatible but better for light/dark mode switching. We fall back to non-alpha hex colors with
// postcss-color-rgba-fallback to mitigate this.
// stylelint-disable-next-line color-function-notation
$color-opaque-alpha: rgba($color, math.div(settings.$link-underline-opacity, 100%));
@ -22,8 +21,7 @@
@return linear-gradient($color-opaque-alpha, $color-opaque-alpha);
}
// Returns a list of strings from a given string separated by a given
// separator (defaults to comma).
// Returns a list of strings from a given string separated by a given separator (defaults to comma).
// https://stackoverflow.com/a/65853667/1438024
@function str-split($str, $separator: ",") {
// return immediately if this function isn't necessary
@ -35,17 +33,10 @@
@while string.index("#{$str}", "#{$separator}") != null {
@if string.index("#{$str}", "#{$separator}") > 1 {
$str-list: list.append(
$str-list,
string.slice("#{$str}", 1, string.index("#{$str}", "#{$separator}") - 1)
);
$str-list: list.append($str-list, string.slice("#{$str}", 1, string.index("#{$str}", "#{$separator}") - 1));
}
$str: string.slice(
"#{$str}",
string.index("#{$str}", "#{$separator}") + 1,
string.length("#{$str}")
);
$str: string.slice("#{$str}", string.index("#{$str}", "#{$separator}") + 1, string.length("#{$str}"));
}
@if string.slice("#{$str}", 1, string.length("#{$str}")) != "" {

7
assets/sass/abstracts/_settings.scss
View File

@ -9,10 +9,9 @@ $webfont-mono-variable: "Roboto Mono var";
// System fonts
// https://markdotto.com/2018/02/07/github-system-fonts/
// stylelint-disable-next-line value-keyword-case
$system-fonts-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif,
"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
$system-fonts-monospace: "SFMono-Regular", "Consolas", "Liberation Mono", "Menlo", "Courier",
monospace;
$system-fonts-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji",
"Segoe UI Emoji", "Segoe UI Symbol";
$system-fonts-monospace: "SFMono-Regular", "Consolas", "Liberation Mono", "Menlo", "Courier", monospace;
$font-stack-sans: list.join($webfont-sans, $system-fonts-sans);
$font-stack-variable: list.join($webfont-sans-variable, $system-fonts-sans);
$font-stack-mono: list.join($webfont-mono, $system-fonts-monospace);

4
assets/sass/abstracts/_themes.scss
View File

@ -16,9 +16,7 @@
@each $element in settings.$theme-transition-elements {
$transitions: list.append(
$transitions,
string.unquote(
"#{$element} #{settings.$theme-transition-duration} #{settings.$theme-transition-function}"
)
string.unquote("#{$element} #{settings.$theme-transition-duration} #{settings.$theme-transition-function}")
);
}
@if $moreTransitions != "" {

4
content/notes/dark-mode/index.md
View File

@ -51,9 +51,7 @@ A _very_ barebones example is embedded above ([view the source here](https://git
I have cleaned up this code a bit, added a few features, and packaged it as an [📦 NPM module](https://www.npmjs.com/package/dark-mode-switcheroo) (zero dependencies and still [only ~500 bytes](https://bundlephobia.com/package/dark-mode-switcheroo) minified and gzipped!). Here's a small snippet of the updated method for the browser (pulling the module from [UNPKG](https://unpkg.com/browse/dark-mode-switcheroo/)), but definitely [read the readme](https://github.com/jakejarvis/dark-mode#readme) for much more detail on the API.
```html
<button class="dark-mode-toggle" style="visibility: hidden;">
💡 Click to see the light... or not.
</button>
<button class="dark-mode-toggle" style="visibility: hidden;">💡 Click to see the light... or not.</button>
<script src="https://unpkg.com/dark-mode-switcheroo/dist/dark-mode.min.js"></script>
<script>

2
gulpfile.js
View File

@ -17,7 +17,7 @@ gulp.task(
gulp.series(
clean,
npx("webpack", ["--mode", "production"]),
npx("hugo"),
npx("hugo", ["--verbose"]),
gulp.parallel(optimizeHtml, optimizeImages)
)
);

1
package.json
View File

@ -55,7 +55,6 @@
"@babel/eslint-parser": "^7.16.0",
"@babel/preset-env": "^7.16.0",
"@jakejarvis/eslint-config": "github:jakejarvis/eslint-config#main",
"@types/numeral": "^2.0.2",
"@types/twemoji": "^12.1.2",
"@types/url-parse": "^1.4.4",
"autoprefixer": "^10.4.0",

11
webpack.config.js
View File

@ -20,10 +20,7 @@ const __dirname = path.dirname(fileURLToPath(import.meta.url));
const isProd = process.env.NODE_ENV === "production";
export default {
entry: [
path.resolve(__dirname, "assets/js/index.js"),
path.resolve(__dirname, "assets/sass/main.scss"),
],
entry: [path.resolve(__dirname, "assets/js/index.js"), path.resolve(__dirname, "assets/sass/main.scss")],
mode: isProd ? "production" : "development",
devtool: isProd ? "source-map" : "inline-source-map",
output: {
@ -88,11 +85,7 @@ export default {
[
"@babel/preset-env",
{
include: [
"transform-arrow-functions",
"transform-block-scoping",
"transform-template-literals",
],
include: ["transform-arrow-functions", "transform-block-scoping", "transform-template-literals"],
bugfixes: true,
useBuiltIns: "entry",
corejs: 3,

5
yarn.lock
View File

@ -1220,11 +1220,6 @@
resolved "https://registry.yarnpkg.com/@types/normalize-package-data/-/normalize-package-data-2.4.1.tgz#d3357479a0fdfdd5907fe67e17e0a85c906e1301"
integrity sha512-Gj7cI7z+98M282Tqmp2K5EIsoouUEzbBJhQQzDE3jSIRk6r9gsz0oUokqIUR4u1R3dMHo0pDHM7sNOHyhulypw==
"@types/numeral@^2.0.2":
version "2.0.2"
resolved "https://registry.yarnpkg.com/@types/numeral/-/numeral-2.0.2.tgz#8ea2c4f4e64c0cc948ad7da375f6f827778a7912"
integrity sha512-A8F30k2gYJ/6e07spSCPpkuZu79LCnkPTvqmIWQzNGcrzwFKpVOydG41lNt5wZXjSI149qjyzC2L1+F2PD/NUA==
"@types/parse-json@^4.0.0":
version "4.0.0"
resolved "https://registry.yarnpkg.com/@types/parse-json/-/parse-json-4.0.0.tgz#2f8bb441434d163b35fb8ffdccd7138927ffb8c0"