mirror of
https://github.com/gurnec/removeddit.git
synced 2026-03-11 08:54:27 +00:00
Add dark/light/system mode switch
Also give more space to the selftext of posts. Closes #6
This commit is contained in:
Christopher Gurnee
parent
46c64f9498
commit
77895e8d71
16 changed files with 628 additions and 204 deletions
3
dist/main.css
vendored
3
dist/main.css
vendored
File diff suppressed because one or more lines are too long
130
package-lock.json
generated
130
package-lock.json
generated
|
|
@ -27,6 +27,7 @@
|
|||
"@babel/preset-react": "^7.16.7",
|
||||
"acorn": "^8.7.0",
|
||||
"babel-loader": "^8.2.4",
|
||||
"css-toggle-switch": "^4.1.0",
|
||||
"eslint": "^8.11.0",
|
||||
"sass": "^1.49.9",
|
||||
"standard": "^16.0.4",
|
||||
|
|
@ -2416,6 +2417,7 @@
|
|||
"version": "3.2.1",
|
||||
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
|
||||
"integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"color-convert": "^1.9.0"
|
||||
},
|
||||
|
|
@ -2613,7 +2615,8 @@
|
|||
"node_modules/balanced-match": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
|
||||
"integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw=="
|
||||
"integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/batch": {
|
||||
"version": "0.6.1",
|
||||
|
|
@ -2702,6 +2705,7 @@
|
|||
"version": "1.1.11",
|
||||
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
|
||||
"integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"balanced-match": "^1.0.0",
|
||||
"concat-map": "0.0.1"
|
||||
|
|
@ -2811,6 +2815,7 @@
|
|||
"version": "2.4.2",
|
||||
"resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
|
||||
"integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"ansi-styles": "^3.2.1",
|
||||
"escape-string-regexp": "^1.0.5",
|
||||
|
|
@ -2883,6 +2888,7 @@
|
|||
"version": "1.9.3",
|
||||
"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
|
||||
"integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"color-name": "1.1.3"
|
||||
}
|
||||
|
|
@ -2890,7 +2896,8 @@
|
|||
"node_modules/color-name": {
|
||||
"version": "1.1.3",
|
||||
"resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
|
||||
"integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU="
|
||||
"integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/colorette": {
|
||||
"version": "2.0.16",
|
||||
|
|
@ -2961,7 +2968,8 @@
|
|||
"node_modules/concat-map": {
|
||||
"version": "0.0.1",
|
||||
"resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
|
||||
"integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s="
|
||||
"integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/connect-history-api-fallback": {
|
||||
"version": "1.6.0",
|
||||
|
|
@ -3099,6 +3107,15 @@
|
|||
"node": ">= 8"
|
||||
}
|
||||
},
|
||||
"node_modules/css-toggle-switch": {
|
||||
"version": "4.1.0",
|
||||
"resolved": "https://registry.npmjs.org/css-toggle-switch/-/css-toggle-switch-4.1.0.tgz",
|
||||
"integrity": "sha512-XdA6fyaQqlBqTmFa6NX58tLPJj4SgDLAxV4Ec73GHQYRTYUTZoEyYHYxWGacLNTP8sTiVycKcAMBrPBKaiIZ9g==",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">=4"
|
||||
}
|
||||
},
|
||||
"node_modules/debug": {
|
||||
"version": "4.3.4",
|
||||
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
|
||||
|
|
@ -3431,6 +3448,7 @@
|
|||
"version": "1.0.5",
|
||||
"resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
|
||||
"integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">=0.8.0"
|
||||
}
|
||||
|
|
@ -4142,7 +4160,8 @@
|
|||
"node_modules/fastest-levenshtein": {
|
||||
"version": "1.0.12",
|
||||
"resolved": "https://registry.npmjs.org/fastest-levenshtein/-/fastest-levenshtein-1.0.12.tgz",
|
||||
"integrity": "sha512-On2N+BpYJ15xIC974QNVuYGMOlEVt4s0EOI3wwMqOmK1fdDY+FN/zltPV8vosq4ad4c/gJ1KHScUn/6AWIgiow=="
|
||||
"integrity": "sha512-On2N+BpYJ15xIC974QNVuYGMOlEVt4s0EOI3wwMqOmK1fdDY+FN/zltPV8vosq4ad4c/gJ1KHScUn/6AWIgiow==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/fastq": {
|
||||
"version": "1.13.0",
|
||||
|
|
@ -4339,7 +4358,8 @@
|
|||
"node_modules/fs.realpath": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
|
||||
"integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
|
||||
"integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/fsevents": {
|
||||
"version": "2.3.2",
|
||||
|
|
@ -4434,6 +4454,7 @@
|
|||
"version": "7.2.0",
|
||||
"resolved": "https://registry.npmjs.org/glob/-/glob-7.2.0.tgz",
|
||||
"integrity": "sha512-lmLf6gtyrPq8tTjSmrO94wBeQbFR3HbLHbuyD69wuyQkImp2hWqMGB47OX65FBkPffO641IP9jWa1z4ivqG26Q==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"fs.realpath": "^1.0.0",
|
||||
"inflight": "^1.0.4",
|
||||
|
|
@ -4508,7 +4529,8 @@
|
|||
"node_modules/graceful-fs": {
|
||||
"version": "4.2.9",
|
||||
"resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.9.tgz",
|
||||
"integrity": "sha512-NtNxqUcXgpW2iMrfqSfR73Glt39K+BLwWsPs94yR63v45T0Wbej7eRmL5cWfwEgqXnmjQp3zaJTshdRW/qC2ZQ=="
|
||||
"integrity": "sha512-NtNxqUcXgpW2iMrfqSfR73Glt39K+BLwWsPs94yR63v45T0Wbej7eRmL5cWfwEgqXnmjQp3zaJTshdRW/qC2ZQ==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/handle-thing": {
|
||||
"version": "2.0.1",
|
||||
|
|
@ -4541,6 +4563,7 @@
|
|||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
|
||||
"integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0=",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">=4"
|
||||
}
|
||||
|
|
@ -4596,7 +4619,8 @@
|
|||
"node_modules/hosted-git-info": {
|
||||
"version": "2.8.9",
|
||||
"resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.8.9.tgz",
|
||||
"integrity": "sha512-mxIDAb9Lsm6DoOJ7xH+5+X4y1LU/4Hi50L9C5sIswK3JzULS4bwk1FvjdBgvYR4bzT4tuUQiC15FE2f5HbLvYw=="
|
||||
"integrity": "sha512-mxIDAb9Lsm6DoOJ7xH+5+X4y1LU/4Hi50L9C5sIswK3JzULS4bwk1FvjdBgvYR4bzT4tuUQiC15FE2f5HbLvYw==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/hpack.js": {
|
||||
"version": "2.1.6",
|
||||
|
|
@ -4805,6 +4829,7 @@
|
|||
"version": "1.0.6",
|
||||
"resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
|
||||
"integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"once": "^1.3.0",
|
||||
"wrappy": "1"
|
||||
|
|
@ -4813,7 +4838,8 @@
|
|||
"node_modules/inherits": {
|
||||
"version": "2.0.4",
|
||||
"resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
|
||||
"integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ=="
|
||||
"integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/internal-slot": {
|
||||
"version": "1.0.3",
|
||||
|
|
@ -5176,7 +5202,8 @@
|
|||
"node_modules/isexe": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
|
||||
"integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA="
|
||||
"integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA=",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/isobject": {
|
||||
"version": "3.0.1",
|
||||
|
|
@ -5568,6 +5595,7 @@
|
|||
"version": "3.1.2",
|
||||
"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
|
||||
"integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"brace-expansion": "^1.1.7"
|
||||
},
|
||||
|
|
@ -5579,12 +5607,14 @@
|
|||
"name": "minimist-lite",
|
||||
"version": "2.2.1",
|
||||
"resolved": "git+ssh://git@github.com/meszaros-lajos-gyorgy/minimist-lite.git#3c9cad3b85e9792aa1905bd69d0794d61f4c89ce",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/mkdirp": {
|
||||
"version": "0.5.6",
|
||||
"resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.6.tgz",
|
||||
"integrity": "sha512-FP+p8RB8OWpF3YZBCrP5gtADmtXApB5AMLn+vdyA+PyxCjrCs00mjyUozssO33cwDeT3wNGdLxJ5M//YqtHAJw==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"minimist": "^1.2.6"
|
||||
},
|
||||
|
|
@ -5595,7 +5625,8 @@
|
|||
"node_modules/ms": {
|
||||
"version": "2.1.2",
|
||||
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
|
||||
"integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
|
||||
"integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/multicast-dns": {
|
||||
"version": "6.2.3",
|
||||
|
|
@ -8021,6 +8052,7 @@
|
|||
"version": "1.4.0",
|
||||
"resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
|
||||
"integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"wrappy": "1"
|
||||
}
|
||||
|
|
@ -8185,6 +8217,7 @@
|
|||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
|
||||
"integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
|
|
@ -8991,6 +9024,7 @@
|
|||
"version": "3.0.2",
|
||||
"resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
|
||||
"integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"glob": "^7.1.3"
|
||||
},
|
||||
|
|
@ -9102,6 +9136,7 @@
|
|||
"version": "6.3.0",
|
||||
"resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
|
||||
"integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
|
||||
"dev": true,
|
||||
"bin": {
|
||||
"semver": "bin/semver.js"
|
||||
}
|
||||
|
|
@ -10202,6 +10237,7 @@
|
|||
"version": "5.5.0",
|
||||
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
|
||||
"integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"has-flag": "^3.0.0"
|
||||
},
|
||||
|
|
@ -10365,7 +10401,8 @@
|
|||
"node_modules/text-table": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz",
|
||||
"integrity": "sha1-f17oI66AUgfACvLfSoTsP8+lcLQ="
|
||||
"integrity": "sha1-f17oI66AUgfACvLfSoTsP8+lcLQ=",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/thunky": {
|
||||
"version": "1.1.0",
|
||||
|
|
@ -11010,6 +11047,7 @@
|
|||
"version": "2.0.2",
|
||||
"resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
|
||||
"integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"isexe": "^2.0.0"
|
||||
},
|
||||
|
|
@ -11054,7 +11092,8 @@
|
|||
"node_modules/wrappy": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
|
||||
"integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8="
|
||||
"integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/ws": {
|
||||
"version": "8.5.0",
|
||||
|
|
@ -12854,6 +12893,7 @@
|
|||
"version": "3.2.1",
|
||||
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
|
||||
"integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"color-convert": "^1.9.0"
|
||||
}
|
||||
|
|
@ -13001,7 +13041,8 @@
|
|||
"balanced-match": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
|
||||
"integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw=="
|
||||
"integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
|
||||
"dev": true
|
||||
},
|
||||
"batch": {
|
||||
"version": "0.6.1",
|
||||
|
|
@ -13080,6 +13121,7 @@
|
|||
"version": "1.1.11",
|
||||
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
|
||||
"integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"balanced-match": "^1.0.0",
|
||||
"concat-map": "0.0.1"
|
||||
|
|
@ -13151,6 +13193,7 @@
|
|||
"version": "2.4.2",
|
||||
"resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
|
||||
"integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"ansi-styles": "^3.2.1",
|
||||
"escape-string-regexp": "^1.0.5",
|
||||
|
|
@ -13200,6 +13243,7 @@
|
|||
"version": "1.9.3",
|
||||
"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
|
||||
"integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"color-name": "1.1.3"
|
||||
}
|
||||
|
|
@ -13207,7 +13251,8 @@
|
|||
"color-name": {
|
||||
"version": "1.1.3",
|
||||
"resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
|
||||
"integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU="
|
||||
"integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=",
|
||||
"dev": true
|
||||
},
|
||||
"colorette": {
|
||||
"version": "2.0.16",
|
||||
|
|
@ -13271,7 +13316,8 @@
|
|||
"concat-map": {
|
||||
"version": "0.0.1",
|
||||
"resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
|
||||
"integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s="
|
||||
"integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=",
|
||||
"dev": true
|
||||
},
|
||||
"connect-history-api-fallback": {
|
||||
"version": "1.6.0",
|
||||
|
|
@ -13369,6 +13415,12 @@
|
|||
"which": "^2.0.1"
|
||||
}
|
||||
},
|
||||
"css-toggle-switch": {
|
||||
"version": "4.1.0",
|
||||
"resolved": "https://registry.npmjs.org/css-toggle-switch/-/css-toggle-switch-4.1.0.tgz",
|
||||
"integrity": "sha512-XdA6fyaQqlBqTmFa6NX58tLPJj4SgDLAxV4Ec73GHQYRTYUTZoEyYHYxWGacLNTP8sTiVycKcAMBrPBKaiIZ9g==",
|
||||
"dev": true
|
||||
},
|
||||
"debug": {
|
||||
"version": "4.3.4",
|
||||
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
|
||||
|
|
@ -13631,7 +13683,8 @@
|
|||
"escape-string-regexp": {
|
||||
"version": "1.0.5",
|
||||
"resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
|
||||
"integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ="
|
||||
"integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=",
|
||||
"dev": true
|
||||
},
|
||||
"eslint": {
|
||||
"version": "8.11.0",
|
||||
|
|
@ -14166,7 +14219,8 @@
|
|||
"fastest-levenshtein": {
|
||||
"version": "1.0.12",
|
||||
"resolved": "https://registry.npmjs.org/fastest-levenshtein/-/fastest-levenshtein-1.0.12.tgz",
|
||||
"integrity": "sha512-On2N+BpYJ15xIC974QNVuYGMOlEVt4s0EOI3wwMqOmK1fdDY+FN/zltPV8vosq4ad4c/gJ1KHScUn/6AWIgiow=="
|
||||
"integrity": "sha512-On2N+BpYJ15xIC974QNVuYGMOlEVt4s0EOI3wwMqOmK1fdDY+FN/zltPV8vosq4ad4c/gJ1KHScUn/6AWIgiow==",
|
||||
"dev": true
|
||||
},
|
||||
"fastq": {
|
||||
"version": "1.13.0",
|
||||
|
|
@ -14317,7 +14371,8 @@
|
|||
"fs.realpath": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
|
||||
"integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
|
||||
"integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=",
|
||||
"dev": true
|
||||
},
|
||||
"fsevents": {
|
||||
"version": "2.3.2",
|
||||
|
|
@ -14381,6 +14436,7 @@
|
|||
"version": "7.2.0",
|
||||
"resolved": "https://registry.npmjs.org/glob/-/glob-7.2.0.tgz",
|
||||
"integrity": "sha512-lmLf6gtyrPq8tTjSmrO94wBeQbFR3HbLHbuyD69wuyQkImp2hWqMGB47OX65FBkPffO641IP9jWa1z4ivqG26Q==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"fs.realpath": "^1.0.0",
|
||||
"inflight": "^1.0.4",
|
||||
|
|
@ -14436,7 +14492,8 @@
|
|||
"graceful-fs": {
|
||||
"version": "4.2.9",
|
||||
"resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.9.tgz",
|
||||
"integrity": "sha512-NtNxqUcXgpW2iMrfqSfR73Glt39K+BLwWsPs94yR63v45T0Wbej7eRmL5cWfwEgqXnmjQp3zaJTshdRW/qC2ZQ=="
|
||||
"integrity": "sha512-NtNxqUcXgpW2iMrfqSfR73Glt39K+BLwWsPs94yR63v45T0Wbej7eRmL5cWfwEgqXnmjQp3zaJTshdRW/qC2ZQ==",
|
||||
"dev": true
|
||||
},
|
||||
"handle-thing": {
|
||||
"version": "2.0.1",
|
||||
|
|
@ -14462,7 +14519,8 @@
|
|||
"has-flag": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
|
||||
"integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0="
|
||||
"integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0=",
|
||||
"dev": true
|
||||
},
|
||||
"has-symbols": {
|
||||
"version": "1.0.3",
|
||||
|
|
@ -14503,7 +14561,8 @@
|
|||
"hosted-git-info": {
|
||||
"version": "2.8.9",
|
||||
"resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.8.9.tgz",
|
||||
"integrity": "sha512-mxIDAb9Lsm6DoOJ7xH+5+X4y1LU/4Hi50L9C5sIswK3JzULS4bwk1FvjdBgvYR4bzT4tuUQiC15FE2f5HbLvYw=="
|
||||
"integrity": "sha512-mxIDAb9Lsm6DoOJ7xH+5+X4y1LU/4Hi50L9C5sIswK3JzULS4bwk1FvjdBgvYR4bzT4tuUQiC15FE2f5HbLvYw==",
|
||||
"dev": true
|
||||
},
|
||||
"hpack.js": {
|
||||
"version": "2.1.6",
|
||||
|
|
@ -14667,6 +14726,7 @@
|
|||
"version": "1.0.6",
|
||||
"resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
|
||||
"integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"once": "^1.3.0",
|
||||
"wrappy": "1"
|
||||
|
|
@ -14675,7 +14735,8 @@
|
|||
"inherits": {
|
||||
"version": "2.0.4",
|
||||
"resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
|
||||
"integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ=="
|
||||
"integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==",
|
||||
"dev": true
|
||||
},
|
||||
"internal-slot": {
|
||||
"version": "1.0.3",
|
||||
|
|
@ -14915,7 +14976,8 @@
|
|||
"isexe": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
|
||||
"integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA="
|
||||
"integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA=",
|
||||
"dev": true
|
||||
},
|
||||
"isobject": {
|
||||
"version": "3.0.1",
|
||||
|
|
@ -15214,18 +15276,21 @@
|
|||
"version": "3.1.2",
|
||||
"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
|
||||
"integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"brace-expansion": "^1.1.7"
|
||||
}
|
||||
},
|
||||
"minimist": {
|
||||
"version": "git+ssh://git@github.com/meszaros-lajos-gyorgy/minimist-lite.git#3c9cad3b85e9792aa1905bd69d0794d61f4c89ce",
|
||||
"dev": true,
|
||||
"from": "minimist@git+https://github.com/meszaros-lajos-gyorgy/minimist-lite#semver:^v2.2.1"
|
||||
},
|
||||
"mkdirp": {
|
||||
"version": "0.5.6",
|
||||
"resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.6.tgz",
|
||||
"integrity": "sha512-FP+p8RB8OWpF3YZBCrP5gtADmtXApB5AMLn+vdyA+PyxCjrCs00mjyUozssO33cwDeT3wNGdLxJ5M//YqtHAJw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"minimist": "git+https://github.com/meszaros-lajos-gyorgy/minimist-lite#semver:^v2.2.1"
|
||||
}
|
||||
|
|
@ -15233,7 +15298,8 @@
|
|||
"ms": {
|
||||
"version": "2.1.2",
|
||||
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
|
||||
"integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
|
||||
"integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
|
||||
"dev": true
|
||||
},
|
||||
"multicast-dns": {
|
||||
"version": "6.2.3",
|
||||
|
|
@ -16895,6 +16961,7 @@
|
|||
"version": "1.4.0",
|
||||
"resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
|
||||
"integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"wrappy": "1"
|
||||
}
|
||||
|
|
@ -17010,7 +17077,8 @@
|
|||
"path-is-absolute": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
|
||||
"integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18="
|
||||
"integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=",
|
||||
"dev": true
|
||||
},
|
||||
"path-key": {
|
||||
"version": "3.1.1",
|
||||
|
|
@ -17628,6 +17696,7 @@
|
|||
"version": "3.0.2",
|
||||
"resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
|
||||
"integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"glob": "^7.1.3"
|
||||
}
|
||||
|
|
@ -17702,7 +17771,8 @@
|
|||
"semver": {
|
||||
"version": "6.3.0",
|
||||
"resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
|
||||
"integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw=="
|
||||
"integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
|
||||
"dev": true
|
||||
},
|
||||
"send": {
|
||||
"version": "0.17.2",
|
||||
|
|
@ -18528,6 +18598,7 @@
|
|||
"version": "5.5.0",
|
||||
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
|
||||
"integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"has-flag": "^3.0.0"
|
||||
}
|
||||
|
|
@ -18638,7 +18709,8 @@
|
|||
"text-table": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz",
|
||||
"integrity": "sha1-f17oI66AUgfACvLfSoTsP8+lcLQ="
|
||||
"integrity": "sha1-f17oI66AUgfACvLfSoTsP8+lcLQ=",
|
||||
"dev": true
|
||||
},
|
||||
"thunky": {
|
||||
"version": "1.1.0",
|
||||
|
|
@ -19115,6 +19187,7 @@
|
|||
"version": "2.0.2",
|
||||
"resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
|
||||
"integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"isexe": "^2.0.0"
|
||||
}
|
||||
|
|
@ -19147,7 +19220,8 @@
|
|||
"wrappy": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
|
||||
"integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8="
|
||||
"integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=",
|
||||
"dev": true
|
||||
},
|
||||
"ws": {
|
||||
"version": "8.5.0",
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@
|
|||
"scripts": {
|
||||
"start": "webpack-dev-server --mode development",
|
||||
"build": "webpack --mode production",
|
||||
"css": "sass --style compressed --no-source-map src/sass/index.sass dist/main.css"
|
||||
"css": "sass -s compressed src/sass/index.sass >dist/main.css && sass -s compressed node_modules/css-toggle-switch/dist/toggle-switch-px.css >>dist/main.css"
|
||||
},
|
||||
"dependencies": {
|
||||
"core-js": "^3.21.1",
|
||||
|
|
@ -46,6 +46,7 @@
|
|||
"@babel/preset-react": "^7.16.7",
|
||||
"acorn": "^8.7.0",
|
||||
"babel-loader": "^8.2.4",
|
||||
"css-toggle-switch": "^4.1.0",
|
||||
"eslint": "^8.11.0",
|
||||
"sass": "^1.49.9",
|
||||
"standard": "^16.0.4",
|
||||
|
|
|
|||
|
|
@ -1,15 +1,29 @@
|
|||
import React from 'react'
|
||||
import { Link } from 'react-router-dom'
|
||||
import { connect } from '../../state'
|
||||
import { theme } from '../../state'
|
||||
|
||||
const Header = props => (
|
||||
<header>
|
||||
<div id='header'>
|
||||
<h1>
|
||||
<Link to='/about'>Unddit</Link>
|
||||
</h1>
|
||||
<h1>Unddit</h1>
|
||||
<nav>
|
||||
<Link to='/about'>about & FAQ</Link>
|
||||
<span className='switch-toggle switch-candy-blue nowrap'>
|
||||
<input type='radio' name='mode' id={theme.dark} value={theme.dark}
|
||||
defaultChecked={props.global.curTheme === theme.dark}
|
||||
onChange={e => props.global.setTheme(e.target.value)} />
|
||||
<label htmlFor={theme.dark} title='Dark mode'>🌜︎</label>
|
||||
<input type='radio' name='mode' id={theme.light} value={theme.light}
|
||||
defaultChecked={props.global.curTheme === theme.light}
|
||||
onChange={e => props.global.setTheme(e.target.value)} />
|
||||
<label htmlFor={theme.light} title='Light mode'>☀︎</label>
|
||||
<input type='radio' name='mode' id={theme.system} value={theme.system}
|
||||
defaultChecked={props.global.curTheme === theme.system}
|
||||
onChange={e => props.global.setTheme(e.target.value)} />
|
||||
<label htmlFor={theme.system} title='Same mode as system'>💻︎</label>
|
||||
<a />
|
||||
</span>
|
||||
<Link className='nowrap' to='/about'>about & FAQ</Link>
|
||||
</nav>
|
||||
</div>
|
||||
<div id='status'>
|
||||
|
|
|
|||
|
|
@ -60,8 +60,22 @@ export default (props) => {
|
|||
|
||||
const [showEdited, setShowEdited] = useState(false)
|
||||
|
||||
return (
|
||||
<div className={`thread ${props.removed ? 'removed' : props.deleted ? 'deleted' : ''}`}>
|
||||
const totalComments = <div className='total-comments'>
|
||||
{props.reloadingComments ?
|
||||
<span>{props.num_comments} comments</span> :
|
||||
<Link to={props.permalink}>{props.num_comments} comments</Link>}
|
||||
<a href={`https://www.reddit.com${props.permalink}`}>reddit</a>
|
||||
<a href={`https://reveddit.com${props.permalink}`}>reveddit</a>
|
||||
{props.hasOwnProperty('edited_selftext') &&
|
||||
<a onClick= {() => setShowEdited(!showEdited)}
|
||||
onKeyDown={e => e.key == 'Enter' && setShowEdited(!showEdited)}
|
||||
tabIndex= {0}
|
||||
title= {showEdited ? 'The most recent version is shown; click to show the earliest archived' : 'The earliest archived version is shown; click to show the most recent'}
|
||||
>*edited</a>}
|
||||
</div>
|
||||
|
||||
return <div className={props.removed ? 'removed' : props.deleted ? 'deleted' : undefined}>
|
||||
<div className='thread'>
|
||||
{props.position &&
|
||||
<span className='post-rank'>{props.position}</span>}
|
||||
<div className='thread-score-box'>
|
||||
|
|
@ -72,33 +86,25 @@ export default (props) => {
|
|||
{thumbnail}
|
||||
<div className='thread-content'>
|
||||
<a className='thread-title' href={url}>{props.title}</a>
|
||||
{
|
||||
props.link_flair_text &&
|
||||
{props.link_flair_text &&
|
||||
<span className='link-flair'>{props.link_flair_text}</span>
|
||||
}
|
||||
<span className='domain'>({props.domain})</span>
|
||||
<div className='thread-info'>
|
||||
submitted <span className='thread-time' title={exactDateTime(props.created_utc)}>{prettyDate(props.created_utc)}</span>
|
||||
{props.edited &&
|
||||
<span className='thread-time' title={exactDateTime(props.edited)}> * (last edited {prettyDate(props.edited)})</span>}
|
||||
<span className='thread-time' title={exactDateTime(props.edited)}> * (last edited {prettyDate(props.edited)})</span>
|
||||
}
|
||||
by <a className='thread-author author' href={userLink}>{props.author}</a> to /r/{props.subreddit}
|
||||
</div>
|
||||
{innerHTML !== undefined &&
|
||||
<div className='thread-selftext user-text' dangerouslySetInnerHTML={{ __html: showEdited ? editedInnerHTML : innerHTML }} />}
|
||||
<div className='total-comments'>
|
||||
{props.reloadingComments ?
|
||||
<span>{props.num_comments} comments</span> :
|
||||
<Link to={props.permalink}>{props.num_comments} comments</Link>}
|
||||
<a href={`https://www.reddit.com${props.permalink}`}>reddit</a>
|
||||
<a href={`https://reveddit.com${props.permalink}`}>reveddit</a>
|
||||
{props.hasOwnProperty('edited_selftext') &&
|
||||
<a onClick= {() => setShowEdited(!showEdited)}
|
||||
onKeyDown={e => e.key == "Enter" && setShowEdited(!showEdited)}
|
||||
tabIndex= {0}
|
||||
title= {showEdited ? 'The most recent version is shown; click to show the earliest archived' : 'The earliest archived version is shown; click to show the most recent'}
|
||||
>*edited</a>}
|
||||
</div>
|
||||
{innerHTML === undefined && totalComments}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
{innerHTML !== undefined &&
|
||||
<div className='thread-content'>
|
||||
<div className='thread-selftext user-text' dangerouslySetInnerHTML={{ __html: showEdited ? editedInnerHTML : innerHTML }} />
|
||||
{totalComments}
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -106,7 +106,7 @@ class Thread extends React.Component {
|
|||
if (!post.deleted && !post.removed && !post.edited) {
|
||||
this.setState({ post })
|
||||
if (this.state.loadingComments)
|
||||
this.props.global.setLoading('Loading comments from Pushshift...')
|
||||
this.props.global.setLoading('Loading comments...')
|
||||
|
||||
// Fetch the post from Pushshift if it was deleted/removed/edited
|
||||
} else {
|
||||
|
|
@ -145,7 +145,7 @@ class Thread extends React.Component {
|
|||
}
|
||||
|
||||
if (this.state.loadingComments)
|
||||
this.props.global.setLoading('Loading comments from Pushshift...')
|
||||
this.props.global.setLoading('Loading comments...')
|
||||
})
|
||||
.catch(error => {
|
||||
console.timeEnd('Load comments')
|
||||
|
|
@ -167,12 +167,12 @@ class Thread extends React.Component {
|
|||
document.title = removedPost.title
|
||||
this.setState({ post: { ...removedPost, removed: true } })
|
||||
if (this.state.loadingComments)
|
||||
this.props.global.setLoading('Loading comments from Pushshift...')
|
||||
this.props.global.setLoading('Loading comments...')
|
||||
} else {
|
||||
if (origMessage.startsWith('403')) { // If Reddit admits it exists but Pushshift can't find it, then
|
||||
this.setState({ post: { id: threadID, subreddit, removed: true } }) // create a dummy post and continue
|
||||
if (this.state.loadingComments)
|
||||
this.props.global.setLoading('Loading comments from Pushshift...')
|
||||
this.props.global.setLoading('Loading comments...')
|
||||
} else {
|
||||
console.timeEnd('Load comments')
|
||||
this.props.global.setError({ message: '404 Post not found' })
|
||||
|
|
@ -249,7 +249,7 @@ class Thread extends React.Component {
|
|||
if (loadingMoreComments) {
|
||||
this.props.global.state.loadingMoreComments = 0
|
||||
this.setState({reloadingComments: true})
|
||||
this.props.global.setLoading('Loading more comments from Pushshift...')
|
||||
this.props.global.setLoading('Loading comments...')
|
||||
console.time('Load comments')
|
||||
this.updateCurContig()
|
||||
this.getComments(loadingMoreComments, true)
|
||||
|
|
@ -261,7 +261,7 @@ class Thread extends React.Component {
|
|||
const { commentID } = this.props.match.params
|
||||
if (commentID === undefined) {
|
||||
this.setState({loadingComments: true})
|
||||
this.props.global.setLoading('Loading comments from Pushshift...')
|
||||
this.props.global.setLoading('Loading comments...')
|
||||
console.time('Load comments')
|
||||
this.contigs.unshift({firstCreated: EARLIEST_CREATED})
|
||||
this.setCurContig(0)
|
||||
|
|
@ -271,7 +271,7 @@ class Thread extends React.Component {
|
|||
} else if (!this.commentIdAttempts.has(commentID)) {
|
||||
this.commentIdAttempts.add(commentID)
|
||||
this.setState({reloadingComments: true})
|
||||
this.props.global.setLoading('Loading comments from Pushshift...')
|
||||
this.props.global.setLoading('Loading comments...')
|
||||
console.time('Load comments')
|
||||
let createdUtcNotFound // true if Reddit doesn't have the comment's created_utc
|
||||
getRedditComments([commentID])
|
||||
|
|
@ -421,7 +421,7 @@ class Thread extends React.Component {
|
|||
return
|
||||
|
||||
// Finished retrieving comments from Pushshift; wait for processing to finish
|
||||
this.props.global.setLoading('Comparing comments to Reddit API...')
|
||||
this.props.global.setLoading('Comparing comments...')
|
||||
Promise.all(pushshiftPromises).then(lengths => {
|
||||
const pushshiftComments = lengths.reduce((a,b) => a+b, 0)
|
||||
console.log('Pushshift:', pushshiftComments, 'comments')
|
||||
|
|
|
|||
|
|
@ -2,43 +2,52 @@
|
|||
margin: 0 auto
|
||||
padding: 20px
|
||||
border-radius: 5px
|
||||
color: $light
|
||||
color: var(--light)
|
||||
word-wrap: break-word
|
||||
max-width: 800px
|
||||
background-color: #161616
|
||||
background-color: var(--about-bg)
|
||||
@media (prefers-color-scheme: light)
|
||||
color: var(--l-light)
|
||||
background-color: var(--l-about-bg)
|
||||
|
||||
h2
|
||||
margin: 20px 0px 12px
|
||||
|
||||
h2.about
|
||||
margin: 0
|
||||
color: $red
|
||||
color: $removed
|
||||
h2.todo
|
||||
color: #239f2b
|
||||
color: $about-todo
|
||||
h2.contact
|
||||
color: #1b767a
|
||||
color: $about-contact
|
||||
|
||||
.highlighted
|
||||
animation: highlighted-anim 3s ease-out
|
||||
|
||||
@keyframes highlighted-anim
|
||||
0%
|
||||
background-color: lightblue
|
||||
background-color: var(--about-q)
|
||||
@media (prefers-color-scheme: light)
|
||||
@keyframes highlighted-anim
|
||||
0%
|
||||
background-color: var(--l-about-q)
|
||||
|
||||
.question
|
||||
font-size: 18px
|
||||
color: lightblue
|
||||
|
||||
color: var(--about-q)
|
||||
@media (prefers-color-scheme: light)
|
||||
color: var(--l-about-q)
|
||||
|
||||
ul
|
||||
padding-left: 30px
|
||||
margin: 0
|
||||
|
||||
.bookmarklet
|
||||
background: $red
|
||||
color: #fff
|
||||
background: $removed
|
||||
color: $white
|
||||
padding: 9px
|
||||
font-size: large
|
||||
font-weight: bold
|
||||
display: inline-block
|
||||
border-radius: 5px
|
||||
margin: 0 7px
|
||||
margin: 0 7px
|
||||
|
|
|
|||
|
|
@ -1,9 +1,209 @@
|
|||
$background: #262626
|
||||
$light: #ddd
|
||||
$border: #767676
|
||||
$red: #c70300
|
||||
$blue: #0000ff
|
||||
$link: #8cb3d9
|
||||
$author: #6a98af
|
||||
$removed: #840c09
|
||||
$deleted: #00007d
|
||||
$background: #262626
|
||||
$scrolltrack: black
|
||||
$scrollthumb: #888
|
||||
$light: #ddd
|
||||
$white: white
|
||||
$border: #767676
|
||||
$border-lt: #808080
|
||||
$removed: #c70300
|
||||
$deleted: #0000ff
|
||||
$removed-bg: #840c09
|
||||
$deleted-bg: #00007d
|
||||
$link: #8cb3d9
|
||||
$author: #6a98af
|
||||
$dim: #828282
|
||||
$poster: #0055df
|
||||
$score: #b4b4b4
|
||||
$rank: #505050
|
||||
$odd-bg: #121212
|
||||
$even-bg: #161616
|
||||
$comment-brd: #333
|
||||
|
||||
$thread-title: #a6a6a6
|
||||
$thread-score: #646464
|
||||
$thread-domain: #888
|
||||
$thread-flair: #c8c8c8
|
||||
$thread-flr-bg: #404040
|
||||
$thread-flr-brd: #4d4d4d
|
||||
$thread-brd: #666
|
||||
$thread-rest: #ccc
|
||||
$thread-rest-bg: #264d73
|
||||
$thread-rest-brd: #2966a3
|
||||
|
||||
$about-bg: $even-bg
|
||||
$about-todo: #239f2b
|
||||
$about-contact: #1b767a
|
||||
$about-q: #add8e6
|
||||
|
||||
$l-background: #f1f1f1
|
||||
$l-scrolltrack: #e7e7e7
|
||||
$l-scrollthumb: #eee
|
||||
$l-light: #111
|
||||
$l-white: black
|
||||
$l-border: #898989
|
||||
$l-border-lt: #7f7f7f
|
||||
$l-removed-bg: #ff9494
|
||||
$l-deleted-bg: #a3c2ff
|
||||
$l-link: #00e
|
||||
$l-author: #369
|
||||
$l-dim: #737373
|
||||
$l-score: #4b4b4b
|
||||
$l-rank: #afafaf
|
||||
$l-odd-bg: #f6f6f6
|
||||
$l-even-bg: white
|
||||
$l-comment-brd: #ccc
|
||||
|
||||
$l-thread-title: #4d4d4d
|
||||
$l-thread-score: #878787
|
||||
$l-thread-domain: #777
|
||||
$l-thread-flair: black
|
||||
$l-thread-flr-bg: #c9c9c9
|
||||
$l-thread-flr-brd: #999
|
||||
$l-thread-brd: #999
|
||||
$l-thread-rest: #333
|
||||
$l-thread-rest-bg: #d9b28c
|
||||
$l-thread-rest-brd: #d6995c
|
||||
|
||||
$l-about-bg: $l-even-bg
|
||||
$l-about-q: #522719
|
||||
|
||||
|
||||
:root
|
||||
|
||||
--background: #{$background}
|
||||
--scrolltrack: #{$scrolltrack}
|
||||
--scrollthumb: #{$scrollthumb}
|
||||
--scrollbar: #{$scrollthumb} #{$scrolltrack}
|
||||
--light: #{$light}
|
||||
--white: #{$white}
|
||||
--border: #{$border}
|
||||
--border-lt: #{$border-lt}
|
||||
--deleted-bg: #{$deleted-bg}
|
||||
--removed-bg: #{$removed-bg}
|
||||
--link: #{$link}
|
||||
--author: #{$author}
|
||||
--dim: #{$dim}
|
||||
--score: #{$score}
|
||||
--rank: #{$rank}
|
||||
--odd-bg: #{$odd-bg}
|
||||
--even-bg: #{$even-bg}
|
||||
--comment-brd: #{$comment-brd}
|
||||
|
||||
--thread-title: #{$thread-title}
|
||||
--thread-score: #{$thread-score}
|
||||
--thread-domain: #{$thread-domain}
|
||||
--thread-flair: #{$thread-flair}
|
||||
--thread-flr-bg: #{$thread-flr-bg}
|
||||
--thread-flr-brd: #{$thread-flr-brd}
|
||||
--thread-brd: #{$thread-brd}
|
||||
--thread-rest: #{$thread-rest}
|
||||
--thread-rest-bg: #{$thread-rest-bg}
|
||||
--thread-rest-brd: #{$thread-rest-brd}
|
||||
|
||||
--about-bg: #{$about-bg}
|
||||
--about-q: #{$about-q}
|
||||
|
||||
--l-background: #{$background}
|
||||
--l-scrolltrack: #{$scrolltrack}
|
||||
--l-scrollthumb: #{$scrollthumb}
|
||||
--l-scrollbar: #{$scrollthumb} #{$scrolltrack}
|
||||
--l-light: #{$light}
|
||||
--l-white: #{$white}
|
||||
--l-border: #{$border}
|
||||
--l-border-lt: #{$border-lt}
|
||||
--l-deleted-bg: #{$deleted-bg}
|
||||
--l-removed-bg: #{$removed-bg}
|
||||
--l-link: #{$link}
|
||||
--l-author: #{$author}
|
||||
--l-dim: #{$dim}
|
||||
--l-score: #{$score}
|
||||
--l-rank: #{$rank}
|
||||
--l-odd-bg: #{$odd-bg}
|
||||
--l-even-bg: #{$even-bg}
|
||||
--l-comment-brd: #{$comment-brd}
|
||||
|
||||
--l-thread-title: #{$thread-title}
|
||||
--l-thread-score: #{$thread-score}
|
||||
--l-thread-domain: #{$thread-domain}
|
||||
--l-thread-flair: #{$thread-flair}
|
||||
--l-thread-flr-bg: #{$thread-flr-bg}
|
||||
--l-thread-flr-brd: #{$thread-flr-brd}
|
||||
--l-thread-brd: #{$thread-brd}
|
||||
--l-thread-rest: #{$thread-rest}
|
||||
--l-thread-rest-bg: #{$thread-rest-bg}
|
||||
--l-thread-rest-brd: #{$thread-rest-brd}
|
||||
|
||||
--l-about-bg: #{$about-bg}
|
||||
--l-about-q: #{$about-q}
|
||||
|
||||
|
||||
[data-theme='LIGHT']
|
||||
|
||||
--background: #{$l-background}
|
||||
--scrolltrack: #{$l-scrolltrack}
|
||||
--scrollthumb: #{$l-scrollthumb}
|
||||
--scrollbar: auto
|
||||
--light: #{$l-light}
|
||||
--white: #{$l-white}
|
||||
--border: #{$l-border}
|
||||
--border-lt: #{$l-border-lt}
|
||||
--deleted-bg: #{$l-deleted-bg}
|
||||
--removed-bg: #{$l-removed-bg}
|
||||
--link: #{$l-link}
|
||||
--author: #{$l-author}
|
||||
--dim: #{$l-dim}
|
||||
--score: #{$l-score}
|
||||
--rank: #{$l-rank}
|
||||
--odd-bg: #{$l-odd-bg}
|
||||
--even-bg: #{$l-even-bg}
|
||||
--comment-brd: #{$l-comment-brd}
|
||||
|
||||
--thread-title: #{$l-thread-title}
|
||||
--thread-score: #{$l-thread-score}
|
||||
--thread-domain: #{$l-thread-domain}
|
||||
--thread-flair: #{$l-thread-flair}
|
||||
--thread-flr-bg: #{$l-thread-flr-bg}
|
||||
--thread-flr-brd: #{$l-thread-flr-brd}
|
||||
--thread-brd: #{$l-thread-brd}
|
||||
--thread-rest: #{$l-thread-rest}
|
||||
--thread-rest-bg: #{$l-thread-rest-bg}
|
||||
--thread-rest-brd: #{$l-thread-rest-brd}
|
||||
|
||||
--about-bg: #{$l-about-bg}
|
||||
--about-q: #{$l-about-q}
|
||||
|
||||
|
||||
[data-theme='LIGHT'], [data-theme='SYSTEM']
|
||||
|
||||
--l-background: #{$l-background}
|
||||
--l-scrolltrack: #{$l-scrolltrack}
|
||||
--l-scrollthumb: #{$l-scrolltrack}
|
||||
--l-scrollbar: auto
|
||||
--l-light: #{$l-light}
|
||||
--l-white: #{$l-white}
|
||||
--l-border: #{$l-border}
|
||||
--l-border-lt: #{$l-border-lt}
|
||||
--l-deleted-bg: #{$l-deleted-bg}
|
||||
--l-removed-bg: #{$l-removed-bg}
|
||||
--l-link: #{$l-link}
|
||||
--l-author: #{$l-author}
|
||||
--l-dim: #{$l-dim}
|
||||
--l-score: #{$l-score}
|
||||
--l-rank: #{$l-rank}
|
||||
--l-odd-bg: #{$l-odd-bg}
|
||||
--l-even-bg: #{$l-even-bg}
|
||||
--l-comment-brd: #{$l-comment-brd}
|
||||
|
||||
--l-thread-title: #{$l-thread-title}
|
||||
--l-thread-score: #{$l-thread-score}
|
||||
--l-thread-domain: #{$l-thread-domain}
|
||||
--l-thread-flair: #{$l-thread-flair}
|
||||
--l-thread-flr-bg: #{$l-thread-flr-bg}
|
||||
--l-thread-flr-brd: #{$l-thread-flr-brd}
|
||||
--l-thread-brd: #{$l-thread-brd}
|
||||
--l-thread-rest: #{$l-thread-rest}
|
||||
--l-thread-rest-bg: #{$l-thread-rest-bg}
|
||||
--l-thread-rest-brd: #{$l-thread-rest-brd}
|
||||
|
||||
--l-about-bg: #{$l-about-bg}
|
||||
--l-about-q: #{$l-about-q}
|
||||
|
|
|
|||
|
|
@ -1,11 +1,14 @@
|
|||
.comment
|
||||
.comment
|
||||
min-width: 240px
|
||||
margin: 0 0 8px 0
|
||||
padding: 5px 8px 5px 20px
|
||||
border: 1px solid #333
|
||||
border: 1px solid var(--comment-brd)
|
||||
border-radius: 3px
|
||||
color: $light
|
||||
color: var(--light)
|
||||
font-size: 14px
|
||||
@media (prefers-color-scheme: light)
|
||||
border-color: var(--l-comment-brd)
|
||||
color: var(--l-light)
|
||||
|
||||
.comment-head
|
||||
font-size: 10px
|
||||
|
|
@ -14,48 +17,58 @@
|
|||
cursor: pointer
|
||||
|
||||
.comment-collapsed span, .comment-collapsed a:not(.comment-collapse)
|
||||
color: #828282
|
||||
color: var(--dim)
|
||||
font-style: oblique
|
||||
@media (prefers-color-scheme: light)
|
||||
color: var(--l-dim)
|
||||
|
||||
.comment-author
|
||||
.comment-author
|
||||
font-weight: bold
|
||||
|
||||
.comment-author:not([href])
|
||||
color: #828282
|
||||
color: var(--dim)
|
||||
@media (prefers-color-scheme: light)
|
||||
color: var(--l-dim)
|
||||
|
||||
.comment-poster
|
||||
color: $light
|
||||
background-color: #0055df
|
||||
background-color: $poster
|
||||
padding: 0 2px
|
||||
border-radius: 3px
|
||||
|
||||
.comment-score
|
||||
color: #b4b4b4
|
||||
color: var(--score)
|
||||
font-weight: bold
|
||||
@media (prefers-color-scheme: light)
|
||||
color: var(--l-score)
|
||||
|
||||
.comment-time
|
||||
color: #828282
|
||||
color: var(--dim)
|
||||
@media (prefers-color-scheme: light)
|
||||
color: var(--l-dim)
|
||||
|
||||
.comment-body
|
||||
max-width: 840px
|
||||
line-height: 20px
|
||||
|
||||
|
||||
p
|
||||
margin: 5px 0
|
||||
line-height: 20px
|
||||
|
||||
|
||||
a:hover
|
||||
text-decoration: none
|
||||
|
||||
.comment-links
|
||||
.comment-links
|
||||
margin-bottom: 6px
|
||||
|
||||
.comment-links a
|
||||
color: #828282
|
||||
color: var(--dim)
|
||||
font-weight: bold
|
||||
font-size: 10px
|
||||
margin-right: 4px
|
||||
cursor: pointer
|
||||
@media (prefers-color-scheme: light)
|
||||
color: var(--l-dim)
|
||||
|
||||
.comment-links a.wait
|
||||
cursor: wait
|
||||
|
|
@ -64,7 +77,11 @@
|
|||
text-decoration: none
|
||||
|
||||
.comment-odd
|
||||
background-color: #121212
|
||||
background-color: var(--odd-bg)
|
||||
@media (prefers-color-scheme: light)
|
||||
background-color: var(--l-odd-bg)
|
||||
|
||||
.comment-even
|
||||
background-color: #161616
|
||||
background-color: var(--even-bg)
|
||||
@media (prefers-color-scheme: light)
|
||||
background-color: var(--l-even-bg)
|
||||
|
|
|
|||
|
|
@ -1,31 +1,71 @@
|
|||
html, body
|
||||
html
|
||||
margin: 0
|
||||
padding: 0
|
||||
background-color: $background
|
||||
background-color: var(--background)
|
||||
font-family: verdana, arial, helvetica, sans-serif
|
||||
@media (prefers-color-scheme: light)
|
||||
background-color: var(--l-background)
|
||||
|
||||
// Blink (Chromium)
|
||||
//
|
||||
::-webkit-scrollbar
|
||||
background-color: var(--scrolltrack)
|
||||
@media (prefers-color-scheme: light)
|
||||
background-color: var(--l-scrolltrack)
|
||||
//
|
||||
::-webkit-scrollbar-thumb
|
||||
-webkit-box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.8)
|
||||
background-color: var(--scrollthumb)
|
||||
@media (prefers-color-scheme: light)
|
||||
background-color: var(--l-scrollthumb)
|
||||
//
|
||||
::-webkit-scrollbar-corner
|
||||
-webkit-box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.8)
|
||||
background-color: var(--scrollthumb)
|
||||
@media (prefers-color-scheme: light)
|
||||
background-color: var(--l-scrollthumb)
|
||||
|
||||
// Gecko (Firefox)
|
||||
//
|
||||
scrollbar-color: var(--scrollbar)
|
||||
@media (prefers-color-scheme: light)
|
||||
scrollbar-color: var(--l-scrollbar)
|
||||
|
||||
transition-property: color, background-color, border, border-color
|
||||
transition-timing-function: ease-out
|
||||
transition-duration: 0s // changed to 0.4s after page loads in src/state.js
|
||||
|
||||
|
||||
.wait
|
||||
cursor: wait
|
||||
|
||||
.main
|
||||
margin: 15px
|
||||
color: white
|
||||
color: var(--white)
|
||||
@media (prefers-color-scheme: light)
|
||||
color: var(--l-white)
|
||||
|
||||
.removed
|
||||
background-color: $removed
|
||||
background-color: var(--removed-bg)
|
||||
@media (prefers-color-scheme: light)
|
||||
background-color: var(--l-removed-bg)
|
||||
|
||||
.deleted
|
||||
background-color: $deleted
|
||||
background-color: var(--deleted-bg)
|
||||
@media (prefers-color-scheme: light)
|
||||
background-color: var(--l-deleted-bg)
|
||||
|
||||
.removed-text
|
||||
color: $red
|
||||
color: $removed
|
||||
|
||||
.deleted-text
|
||||
color: $blue
|
||||
color: $deleted
|
||||
|
||||
a
|
||||
color: $link
|
||||
|
||||
color: var(--link)
|
||||
@media (prefers-color-scheme: light)
|
||||
color: var(--l-link)
|
||||
|
||||
a:link, a:visited, a:active
|
||||
text-decoration: none
|
||||
|
||||
|
|
@ -33,14 +73,16 @@ a:hover
|
|||
text-decoration: underline
|
||||
|
||||
.author
|
||||
color: $author
|
||||
color: var(--author)
|
||||
@media (prefers-color-scheme: light)
|
||||
color: var(--l-author)
|
||||
|
||||
.author:not([href])
|
||||
color: inherit
|
||||
text-decoration: none
|
||||
|
||||
.nowrap
|
||||
display: inline-block
|
||||
display: inline-block !important
|
||||
|
||||
.space
|
||||
margin-left: 5px
|
||||
|
|
@ -48,4 +90,6 @@ a:hover
|
|||
select
|
||||
background: transparent
|
||||
border: 0
|
||||
color: #828282
|
||||
color: var(--dim)
|
||||
@media (prefers-color-scheme: light)
|
||||
color: var(--l-dim)
|
||||
|
|
|
|||
|
|
@ -1,43 +1,43 @@
|
|||
header
|
||||
background-color: $red///*#19171c;/*#181818*/
|
||||
header
|
||||
background-color: $removed
|
||||
color: $white
|
||||
display: flex
|
||||
justify-content: space-between
|
||||
align-items: center
|
||||
padding: 10px
|
||||
|
||||
|
||||
#header
|
||||
a
|
||||
color: #fff
|
||||
|
||||
|
||||
h1
|
||||
margin: 7px 0
|
||||
margin: 0 0 7px
|
||||
text-align: center
|
||||
|
||||
a
|
||||
transition: color 0.3s
|
||||
|
||||
.switch-toggle
|
||||
margin-right: 14px
|
||||
float: left
|
||||
font-size: 14px
|
||||
|
||||
a:hover
|
||||
text-decoration: none
|
||||
color: #ff8b88
|
||||
nav
|
||||
a
|
||||
margin: 0 7px
|
||||
font-size: 20px
|
||||
|
||||
#status
|
||||
label
|
||||
cursor: pointer
|
||||
|
||||
a[href]
|
||||
color: $white
|
||||
font-size: 20px
|
||||
|
||||
#status
|
||||
display: flex
|
||||
justify-content: space-between
|
||||
align-items: center
|
||||
|
||||
#status-text, #status-helpurl
|
||||
color: #fff
|
||||
margin: 0 20px 0 0
|
||||
text-align: center
|
||||
|
||||
#status-helpurl
|
||||
color: $white
|
||||
font-size: 20px
|
||||
|
||||
#status-image
|
||||
#status-image
|
||||
height: 64px
|
||||
width: 64px
|
||||
border-radius: 32px
|
||||
border-radius: 32px
|
||||
|
|
|
|||
|
|
@ -1,24 +1,31 @@
|
|||
#comment-info
|
||||
#comment-info
|
||||
margin-top: 10px
|
||||
font-weight: bold
|
||||
padding-bottom: 5px
|
||||
border-bottom: 1px dotted #808080
|
||||
border-bottom: 1px dotted var(--border-lt)
|
||||
font-size: 16px
|
||||
@media (prefers-color-scheme: light)
|
||||
border-bottom-color: var(--l-border-lt)
|
||||
|
||||
#comment-info span
|
||||
margin-right: 8px
|
||||
|
||||
|
||||
#comment-sort, #comment-sort input
|
||||
color: #808080
|
||||
color: var(--border-lt)
|
||||
font-size: 12px
|
||||
margin: 5px 0
|
||||
background-color: $background
|
||||
background-color: var(--background)
|
||||
@media (prefers-color-scheme: light)
|
||||
color: var(--l-border-lt)
|
||||
background-color: var(--l-background)
|
||||
|
||||
#comment-sort
|
||||
|
||||
input
|
||||
border-color: $border
|
||||
border-color: var(--border)
|
||||
@media (prefers-color-scheme: light)
|
||||
border-color: var(--l-border)
|
||||
|
||||
&[type='number']
|
||||
width: 54px
|
||||
|
|
@ -29,8 +36,13 @@
|
|||
|
||||
input, select
|
||||
&:hover, &:focus
|
||||
color: $light
|
||||
color: var(--light)
|
||||
@media (prefers-color-scheme: light)
|
||||
color: var(--l-light)
|
||||
|
||||
option
|
||||
color: $light
|
||||
background-color: $background
|
||||
color: var(--light)
|
||||
background-color: var(--background)
|
||||
@media (prefers-color-scheme: light)
|
||||
color: var(--l-light)
|
||||
background-color: var(--l-background)
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
//
|
||||
// .search-row
|
||||
// padding: 10px 6px 11px
|
||||
// border-bottom: 1px dotted #ccc
|
||||
// border-bottom: 1px dotted var(--thread-rest)
|
||||
// min-height: 26px
|
||||
//
|
||||
// .search-left
|
||||
|
|
@ -46,7 +46,7 @@
|
|||
// display: block
|
||||
// padding: 9px 16px
|
||||
// font-size: 18px
|
||||
// background: #239f2b
|
||||
// background: $about-todo
|
||||
// border: 0
|
||||
// border-radius: 2px
|
||||
// color: white
|
||||
// color: $white
|
||||
|
|
|
|||
|
|
@ -1,29 +1,31 @@
|
|||
.post-rank
|
||||
min-width: 20px
|
||||
color: #505050
|
||||
color: var(--rank)
|
||||
font-size: 16px
|
||||
text-align: right
|
||||
margin: 14px 4px 0 0
|
||||
@media (prefers-color-scheme: light)
|
||||
color: var(--l-rank)
|
||||
|
||||
//.subreddit-info
|
||||
// border-bottom: 1px dotted gray
|
||||
// border-bottom: 1px dotted var(--border-lt)
|
||||
// padding: 5px 10px
|
||||
// color: #ccc
|
||||
// color: var(--thread-rest)
|
||||
// font-size: 14px
|
||||
// margin-bottom: 5px
|
||||
//
|
||||
// select
|
||||
// background: #262626
|
||||
// color: #808080
|
||||
// background: var(--background)
|
||||
// color: var(--border-lt)
|
||||
// font-size: 14px
|
||||
// font-weight: bold
|
||||
// text-decoration: underline
|
||||
// border: 0
|
||||
//
|
||||
//#pagination
|
||||
// border-top: 1px dotted gray
|
||||
// border-top: 1px dotted var(--border-lt)
|
||||
// padding: 5px 10px
|
||||
// color: #ccc
|
||||
// color: var(--thread-rest)
|
||||
// font-size: 16px
|
||||
// span, a
|
||||
// margin: 5px
|
||||
|
|
@ -35,10 +37,10 @@
|
|||
// margin-left: 5px
|
||||
// font-size: 22px
|
||||
// font-weight: bold
|
||||
// color: white
|
||||
// color: var(--white)
|
||||
//
|
||||
//.subreddit-title-link
|
||||
// margin-bottom: 15px
|
||||
// margin-left: 5px
|
||||
// font-size: 14px
|
||||
// color: white
|
||||
// color: var(--white)
|
||||
|
|
|
|||
|
|
@ -24,8 +24,8 @@
|
|||
background-position: 0px -1267px
|
||||
background-repeat: no-repeat
|
||||
height: 50px
|
||||
|
||||
.thumbnail-image
|
||||
|
||||
.thumbnail-image
|
||||
background-image: url("https://www.redditstatic.com/sprite-reddit.6Om8v6KMv28.png")
|
||||
background-position: 0px -1043px
|
||||
background-repeat: no-repeat
|
||||
|
|
@ -36,11 +36,12 @@
|
|||
background-position: 0px -1155px
|
||||
background-repeat: no-repeat
|
||||
height: 50px
|
||||
|
||||
.thread-score-box
|
||||
margin: 0 7px
|
||||
width: 43px
|
||||
|
||||
.vote
|
||||
.vote
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC0AAAAcCAMAAADC4sagAAABFFBMVEUjJCQiIiIjIyMkIiIkJCQlJSUlJicmJiYnIyEnJycnKCsoKCgpLC8rIyErKyssMDUvLy8wJCAwMDAxMTEyMjI0NDQ2NjY3JR83Nzc5OTk7Ozs8PDw9PT0+Pj4/Pz9AQEBBQUFCQkJDQ0NGRkZISEhKSkpKV2tLS0tMTExOTk5PT09QYHdSUlJTU1NVVVVWVlZXV1dXaINYWFhaWlpabYlbW1tecpBgYGBhYWFid5dkZGRle5xlfJ1pgKRrhKhshKlshapuLhZwirFyjbV0j7h4lL97mcZ9MBR/nsyCo9OOMxGcNQ+eNg+kNw6sOA2vOAy0OQy7Ogq/OwrBOwrDPAnLPQjPPQfTPgfbPwXjQQTrQgPzQwLKxGgxAAAAAXRSTlMAQObYZgAAAAlwSFlzAAALEwAACxMBAJqcGAAAAVlJREFUOMu9lF1TwjAQRTcMvmeQOi1QPmxFBQTxW1ERUUFEUVRU/P//w9yGmBTFyZPnpXNmbju76W6IJM8Uw49rLa6Tz4mpq/mCqY3Gvqnj6XQ61lp0mGd8favCwx2tow8wUlpwGWOZrNJKjXO+UVc6fJcMZzV7IswSOU/qej0l0rwyq33wphhAM1kWkcy70GB7mUfUNqG9V02PyPMTMs2Wig5RaTctwzxVXyPqvJh0VkJBIKJ4huncCRAvHOEZyGKegO4a6UDrIdLGCT4C6/QDsE7fA+v0HdAadWqk0SH9D3sgXkm4uJIDYKTFnwwXd3kMrNOnwDp9BmzS5QuTshN1iDRwfkxV9VJTJXLzSWYM+NzEEjWvFE2oGvCE7/2yDeL8riWzM8xmorRazLlNI2rdgNb3ZYLF1Es/t8VE7X6/39Yqlt4tLLwhiLq3XVNLfumP24fo3Opm+wLGCVa252Y8tQAAAABJRU5ErkJggg==)
|
||||
background-repeat: no-repeat
|
||||
margin-left: auto
|
||||
|
|
@ -49,103 +50,123 @@
|
|||
height: 14px
|
||||
cursor: pointer
|
||||
|
||||
.upvote
|
||||
.upvote
|
||||
background-position: -15px 0px
|
||||
margin-top: 2px
|
||||
|
||||
.downvote
|
||||
.downvote
|
||||
background-position: -15px -14px
|
||||
margin-top: 2px
|
||||
|
||||
.thread-score
|
||||
color: #646464
|
||||
|
||||
.thread-score
|
||||
color: var(--thread-score)
|
||||
font-size: 13px
|
||||
font-weight: bold
|
||||
text-align: center
|
||||
@media (prefers-color-scheme: light)
|
||||
color: var(--l-thread-score)
|
||||
|
||||
.thread-content
|
||||
flex: 1
|
||||
float: left
|
||||
margin-left: 3px
|
||||
|
||||
.link-flair
|
||||
.link-flair
|
||||
display: inline-block
|
||||
color: #c8c8c8
|
||||
background-color: #404040
|
||||
color: var(--thread-flair)
|
||||
background-color: var(--thread-flr-bg)
|
||||
margin-right: 5px
|
||||
border: 1px solid #4d4d4d
|
||||
border: 1px solid var(--thread-flr-brd)
|
||||
border-radius: 2px
|
||||
padding: 0 2px
|
||||
font-size: 10px
|
||||
|
||||
.thread-title
|
||||
color: #a6a6a6
|
||||
@media (prefers-color-scheme: light)
|
||||
color: var(--l-thread-flair)
|
||||
background-color: var(--l-thread-flr-bg)
|
||||
border-color: var(--l-thread-flr-brd)
|
||||
|
||||
.thread-title
|
||||
color: var(--thread-title)
|
||||
margin-right: 5px
|
||||
|
||||
.thread-title:hover
|
||||
@media (prefers-color-scheme: light)
|
||||
color: var(--l-thread-title)
|
||||
|
||||
.thread-title:hover
|
||||
text-decoration: none
|
||||
|
||||
.domain
|
||||
color: #888
|
||||
|
||||
.domain
|
||||
color: var(--thread-domain)
|
||||
font-size: 10px
|
||||
|
||||
.thread-selftext
|
||||
border: 1px solid #666
|
||||
@media (prefers-color-scheme: light)
|
||||
color: var(--l-thread-domain)
|
||||
|
||||
.thread-image
|
||||
max-width: 768px
|
||||
max-height: 768px
|
||||
|
||||
.thread-info
|
||||
color: var(--dim)
|
||||
font-size: 10px
|
||||
margin-top: 2px
|
||||
@media (prefers-color-scheme: light)
|
||||
color: var(--l-dim)
|
||||
|
||||
|
||||
.thread-content
|
||||
margin: 0 7px
|
||||
|
||||
.thread-selftext
|
||||
border: 1px solid var(--thread-brd)
|
||||
border-radius: 7px
|
||||
margin: 5px 0 7px
|
||||
padding: 5px 10px
|
||||
max-width: 840px
|
||||
color: $light
|
||||
color: var(--light)
|
||||
font-size: 14px
|
||||
@media (prefers-color-scheme: light)
|
||||
border-color: var(--l-thread-brd)
|
||||
color: var(--l-light)
|
||||
|
||||
p
|
||||
margin: 5px 0
|
||||
line-height: 20px
|
||||
|
||||
|
||||
a:hover
|
||||
text-decoration: none
|
||||
|
||||
p:first-child
|
||||
p:first-child
|
||||
margin-top: 0px
|
||||
|
||||
|
||||
p:last-child
|
||||
p:last-child
|
||||
margin-bottom: 0px
|
||||
|
||||
|
||||
.thread-image
|
||||
max-width: 768px
|
||||
max-height: 768px
|
||||
|
||||
.thread-info
|
||||
color: #828282
|
||||
font-size: 10px
|
||||
margin-top: 2px
|
||||
|
||||
|
||||
.total-comments
|
||||
.total-comments
|
||||
font-size: 10px
|
||||
font-weight: bold
|
||||
margin: 4px 0
|
||||
margin-top: 4px
|
||||
padding-bottom: 7px
|
||||
|
||||
a, span
|
||||
color: #828282
|
||||
color: var(--dim)
|
||||
margin-right: 4px
|
||||
@media (prefers-color-scheme: light)
|
||||
color: var(--l-dim)
|
||||
|
||||
a
|
||||
cursor: pointer
|
||||
|
||||
|
||||
.view-rest-of-comment
|
||||
background-color: #264d73
|
||||
border-color: #2966a3
|
||||
background-color: var(--thread-rest-bg)
|
||||
border-color: var(--thread-rest-brd)
|
||||
font-size: 13px
|
||||
padding: 10px
|
||||
color: rgb(204, 204, 204)
|
||||
color: var(--thread-rest)
|
||||
margin-bottom: 10px
|
||||
@media (prefers-color-scheme: light)
|
||||
background-color: var(--l-thread-rest-bg)
|
||||
border-color: var(--l-thread-rest-brd)
|
||||
color: var(--l-thread-rest)
|
||||
|
||||
.faux-link
|
||||
color: $link
|
||||
color: var(--link)
|
||||
@media (prefers-color-scheme: light)
|
||||
color: var(--l-link)
|
||||
|
||||
|
||||
.load-more
|
||||
|
|
@ -163,4 +184,8 @@
|
|||
|
||||
@keyframes fade-anim
|
||||
100%
|
||||
color: $background
|
||||
color: var(--background)
|
||||
@media (prefers-color-scheme: light)
|
||||
@keyframes fade-anim
|
||||
100%
|
||||
color: var(--l-background)
|
||||
|
|
|
|||
19
src/state.js
19
src/state.js
|
|
@ -19,6 +19,13 @@ export const filter = {
|
|||
deleted: 'SHOW_DELETED'
|
||||
}
|
||||
|
||||
// Light/Dark mode themes
|
||||
export const theme = {
|
||||
dark: 'DARK',
|
||||
light: 'LIGHT',
|
||||
system: 'SYSTEM'
|
||||
}
|
||||
|
||||
export const maxCommentsDefault = 800
|
||||
export const minCommentsLimit = chunkSize
|
||||
export const maxCommentsLimit = 20000
|
||||
|
|
@ -35,6 +42,10 @@ export const constrainMaxComments = maxComments => {
|
|||
const sortKey = 'commentSort'
|
||||
const filterKey = 'commentFilter'
|
||||
const maxCommentsKey = 'maxComments'
|
||||
const themeKey = 'theme'
|
||||
|
||||
document.documentElement.dataset.theme = get(themeKey, theme.dark)
|
||||
setTimeout(() => document.documentElement.style.transitionDuration = '0.4s')
|
||||
|
||||
class GlobalState extends Container {
|
||||
state = {
|
||||
|
|
@ -49,6 +60,8 @@ class GlobalState extends Container {
|
|||
// Preferred max # of comments to get during (re-)loads
|
||||
maxComments = get(maxCommentsKey, maxCommentsDefault)
|
||||
|
||||
curTheme = document.documentElement.dataset.theme
|
||||
|
||||
setCommentSort (sortType) {
|
||||
put(sortKey, sortType)
|
||||
this.setState({commentSort: sortType})
|
||||
|
|
@ -69,6 +82,12 @@ class GlobalState extends Container {
|
|||
// Loads more comments
|
||||
loadMoreComments = loadingMoreComments => this.setState({loadingMoreComments})
|
||||
|
||||
setTheme (newTheme) {
|
||||
put(themeKey, newTheme)
|
||||
this.curTheme = newTheme
|
||||
document.documentElement.dataset.theme = newTheme
|
||||
}
|
||||
|
||||
setSuccess = () => {
|
||||
this.setState({statusText: '', statusHelpUrl: undefined, statusImage: '/images/success.png'})
|
||||
document.body.classList.remove('wait')
|
||||
|
|
|
|||
Loading…
Reference in a new issue