mirror of
https://github.com/davegallant/rfd-fyi.git
synced 2025-10-03 15:16:00 +00:00
Compare commits
60 Commits
renovate/e
...
b6178bb354
| Author | SHA1 | Date | |
|---|---|---|---|
|
b6178bb354 | ||
|
|
ab2046c714 | ||
|
|
167e8da14d | ||
|
|
bc5389e01b | ||
|
|
1f63e7327b | ||
|
|
2c6a65ffe7 | ||
|
|
ce83c19e5d | ||
|
|
87a82445c2 | ||
|
|
5d2e51cc81 | ||
|
|
a40103768c | ||
|
b1174f2975 | ||
|
|
61eb9e117b | ||
|
|
a2c6eeb3c2 | ||
|
|
a805fa16a9 | ||
|
|
def4338a2d | ||
|
|
9355275ece | ||
|
|
bc73749b75 | ||
|
|
2156330f96 | ||
|
|
c7dc0dba2f | ||
|
|
f22c8a561b | ||
| b29377a962 | |||
|
|
80f650736f | ||
|
|
48c4162746 | ||
| 926617056f | |||
| 485e04afe2 | |||
| 8bae1c4978 | |||
| ce4396dd0d | |||
| f0e33e6060 | |||
| 065c965f00 | |||
|
|
b2bea9a424 | ||
|
|
1969569143 | ||
|
|
286da4cf54 | ||
|
|
eebf0478c5 | ||
|
|
34478e9ede | ||
|
|
a8dd3a4839 | ||
|
|
10a6ae4964 | ||
|
|
fcbdf15180 | ||
|
|
968a417f60 | ||
|
|
05fb199525 | ||
|
|
9e4a84dbbb | ||
|
|
665edf0c80 | ||
|
|
ef7448f02f | ||
|
|
60dfad2c66 | ||
|
|
f60dd55178 | ||
|
|
e7a47adca5 | ||
|
|
d54b07172e | ||
| f60e4cf1cf | |||
|
|
d4253ed8e2 | ||
|
|
a0ee6bb6c8 | ||
|
|
5f7e848670 | ||
|
|
f2c05bce92 | ||
|
|
0e34c00b99 | ||
|
|
c20f4fb32a | ||
|
|
052e2d92d9 | ||
|
|
b367ad0a46 | ||
|
|
16ef189fe4 | ||
|
|
89d3d70ef9 | ||
|
|
00e3c8ad5e | ||
|
|
6444cac6ee | ||
| b15a4fa107 |
4
.browserslistrc
Normal file
4
.browserslistrc
Normal file
@@ -0,0 +1,4 @@
|
|||||||
|
> 1%
|
||||||
|
last 2 versions
|
||||||
|
not dead
|
||||||
|
not ie 11
|
||||||
2
.github/workflows/dependency-review.yml
vendored
2
.github/workflows/dependency-review.yml
vendored
@@ -15,6 +15,6 @@ jobs:
|
|||||||
runs-on: ubuntu-latest
|
runs-on: ubuntu-latest
|
||||||
steps:
|
steps:
|
||||||
- name: 'Checkout Repository'
|
- name: 'Checkout Repository'
|
||||||
uses: actions/checkout@v4
|
uses: actions/checkout@v5
|
||||||
- name: 'Dependency Review'
|
- name: 'Dependency Review'
|
||||||
uses: actions/dependency-review-action@v4
|
uses: actions/dependency-review-action@v4
|
||||||
|
|||||||
4
.github/workflows/publish-containers.yml
vendored
4
.github/workflows/publish-containers.yml
vendored
@@ -10,7 +10,7 @@ jobs:
|
|||||||
name: Publish rfd-fyi-backend
|
name: Publish rfd-fyi-backend
|
||||||
runs-on: ubuntu-latest
|
runs-on: ubuntu-latest
|
||||||
steps:
|
steps:
|
||||||
- uses: actions/checkout@v4
|
- uses: actions/checkout@v5
|
||||||
|
|
||||||
- name: Prepare
|
- name: Prepare
|
||||||
id: prep
|
id: prep
|
||||||
@@ -50,7 +50,7 @@ jobs:
|
|||||||
name: Publish rfd-fyi-frontend
|
name: Publish rfd-fyi-frontend
|
||||||
runs-on: ubuntu-latest
|
runs-on: ubuntu-latest
|
||||||
steps:
|
steps:
|
||||||
- uses: actions/checkout@v4
|
- uses: actions/checkout@v5
|
||||||
|
|
||||||
- name: Prepare
|
- name: Prepare
|
||||||
id: prep
|
id: prep
|
||||||
|
|||||||
@@ -1,5 +1,4 @@
|
|||||||
rfd.fyi
|
rfd.davegallant.ca {
|
||||||
|
|
||||||
file_server
|
file_server
|
||||||
|
|
||||||
reverse_proxy /api/* backend:8080
|
reverse_proxy /api/* backend:8080
|
||||||
|
}
|
||||||
|
|||||||
@@ -10,7 +10,7 @@ COPY . .
|
|||||||
|
|
||||||
RUN npm run build
|
RUN npm run build
|
||||||
|
|
||||||
FROM caddy:2.9.1-alpine as runtime
|
FROM caddy:2.10.2-alpine as runtime
|
||||||
|
|
||||||
WORKDIR /my-site
|
WORKDIR /my-site
|
||||||
|
|
||||||
|
|||||||
3
Makefile
3
Makefile
@@ -20,8 +20,7 @@ backend:
|
|||||||
|
|
||||||
## frontend: Build and run the frontend from source
|
## frontend: Build and run the frontend from source
|
||||||
frontend:
|
frontend:
|
||||||
@npm install @vue/cli-service
|
@npm run serve
|
||||||
@npx vue-cli-service serve
|
|
||||||
.PHONY: frontend
|
.PHONY: frontend
|
||||||
|
|
||||||
## dev: Build and run in docker compose
|
## dev: Build and run in docker compose
|
||||||
|
|||||||
@@ -1,11 +1,9 @@
|
|||||||
# rfd.fyi
|
# rfd-fyi
|
||||||
|
|
||||||
This repository provides a simple, less-distracting overlay for hot deals posted on https://forums.redflagdeals.com.
|
This repository provides a simple, less-distracting overlay for hot deals posted on https://forums.redflagdeals.com.
|
||||||
|
|
||||||
The frontend is made with Vue 3 and the backend is written in Go. The backend exists for caching purposes; to prevent excessive requests to RedFlagDeals itself.
|
The frontend is made with Vue 3 and the backend is written in Go. The backend exists for caching purposes; to prevent excessive requests to RedFlagDeals itself.
|
||||||
|
|
||||||
It is hosted at [rfd.fyi](https://rfd.fyi).
|
|
||||||
|
|
||||||
## Local Development
|
## Local Development
|
||||||
|
|
||||||
To get up and running locally: in one pane/tab, run:
|
To get up and running locally: in one pane/tab, run:
|
||||||
|
|||||||
@@ -1,4 +1,4 @@
|
|||||||
# syntax=docker/dockerfile:1.14
|
# syntax=docker/dockerfile:1.18
|
||||||
FROM cgr.dev/chainguard/go:latest as build
|
FROM cgr.dev/chainguard/go:latest as build
|
||||||
|
|
||||||
WORKDIR /src
|
WORKDIR /src
|
||||||
|
|||||||
@@ -10,8 +10,12 @@
|
|||||||
rel="stylesheet"
|
rel="stylesheet"
|
||||||
href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200"
|
href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200"
|
||||||
/>
|
/>
|
||||||
<title>rfd.fyi - An overlay of hot deals</title>
|
<title>rfd-fyi - An overlay of hot deals</title>
|
||||||
<script defer src="https://umami.snake-cloud.ts.net/script.js" data-website-id="59ffe8be-509a-471e-8cd6-a63c5b35b7aa"></script>
|
<script
|
||||||
|
defer
|
||||||
|
src="https://umami.snake-cloud.ts.net/script.js"
|
||||||
|
data-website-id="59ffe8be-509a-471e-8cd6-a63c5b35b7aa"
|
||||||
|
></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<noscript>
|
<noscript>
|
||||||
@@ -21,6 +25,7 @@
|
|||||||
>
|
>
|
||||||
</noscript>
|
</noscript>
|
||||||
<div id="app"></div>
|
<div id="app"></div>
|
||||||
|
<script type="module" src="/src/main.js"></script>
|
||||||
<!-- built files will be auto injected -->
|
<!-- built files will be auto injected -->
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
3414
package-lock.json
generated
3414
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
38
package.json
38
package.json
@@ -3,36 +3,42 @@
|
|||||||
"version": "0.1.0",
|
"version": "0.1.0",
|
||||||
"private": true,
|
"private": true,
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"serve": "vue-cli-service serve",
|
"serve": "vite",
|
||||||
"build": "vue-cli-service build",
|
"preview": "vite preview",
|
||||||
"lint": "vue-cli-service lint"
|
"build": "vite build",
|
||||||
|
"lint": "eslint . --fix"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
"@fontsource/roboto": "5.2.8",
|
||||||
"@github/hotkey": "^3.0.0",
|
"@github/hotkey": "^3.0.0",
|
||||||
|
"@mdi/font": "7.4.47",
|
||||||
"@popperjs/core": "^2.11.8",
|
"@popperjs/core": "^2.11.8",
|
||||||
"axios": "^1.6.0",
|
"axios": "^1.12.0",
|
||||||
"bootstrap": "^5.3.1",
|
|
||||||
"bootstrap-vue": "^2.22.0",
|
|
||||||
"core-js": "^3.32.1",
|
"core-js": "^3.32.1",
|
||||||
"cssnano": "^7.0.0",
|
"cssnano": "^7.0.0",
|
||||||
"jquery": "^3.7.0",
|
"jquery": "^3.7.0",
|
||||||
"moment": "^2.29.4",
|
"moment": "^2.29.4",
|
||||||
"vue": "^3.3.4",
|
"vue": "^3.5.17",
|
||||||
"vue-github-button": "^3.0.3",
|
"vue-github-button": "^3.0.3",
|
||||||
"vue-loading-overlay": "^6.0.3",
|
"vue-loading-overlay": "^6.0.3",
|
||||||
"vue-router": "4.5.0"
|
"vue-router": "^4.5.1",
|
||||||
|
"vuetify": "^3.9.6"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@babel/core": "^7.22.10",
|
"@babel/core": "^7.22.10",
|
||||||
"@babel/eslint-parser": "^7.22.10",
|
"@babel/eslint-parser": "^7.22.10",
|
||||||
"@types/bootstrap": "^5.2.6",
|
"@vitejs/plugin-vue": "^5.2.3",
|
||||||
"@types/mousetrap": "^1.6.11",
|
|
||||||
"@vue/cli-plugin-babel": "~5.0.0",
|
"@vue/cli-plugin-babel": "~5.0.0",
|
||||||
"@vue/cli-plugin-eslint": "~5.0.0",
|
"@vue/cli-plugin-eslint": "~5.0.0",
|
||||||
"@vue/cli-service": "^5.0.8",
|
"@vue/cli-service": "^5.0.9",
|
||||||
"eslint": "^8.47.0",
|
"eslint": "^8.47.0",
|
||||||
"eslint-plugin-vue": "^9.17.0",
|
"eslint-plugin-vue": "^9.17.0",
|
||||||
"postcss-cli": "^11.0.0"
|
"postcss-cli": "^11.0.0",
|
||||||
|
"sass-embedded": "^1.89.2",
|
||||||
|
"unplugin-fonts": "^1.3.1",
|
||||||
|
"unplugin-vue-components": "^29.0.0",
|
||||||
|
"vite": "^6.3.6",
|
||||||
|
"vite-plugin-vuetify": "^2.1.1"
|
||||||
},
|
},
|
||||||
"eslintConfig": {
|
"eslintConfig": {
|
||||||
"root": true,
|
"root": true,
|
||||||
@@ -47,11 +53,5 @@
|
|||||||
"parser": "@babel/eslint-parser"
|
"parser": "@babel/eslint-parser"
|
||||||
},
|
},
|
||||||
"rules": {}
|
"rules": {}
|
||||||
},
|
}
|
||||||
"browserslist": [
|
|
||||||
"> 1%",
|
|
||||||
"last 2 versions",
|
|
||||||
"not dead",
|
|
||||||
"not ie 11"
|
|
||||||
]
|
|
||||||
}
|
}
|
||||||
|
|||||||
213
src/App.vue
213
src/App.vue
@@ -2,33 +2,37 @@
|
|||||||
import axios from "axios";
|
import axios from "axios";
|
||||||
import moment from "moment";
|
import moment from "moment";
|
||||||
import Loading from "vue-loading-overlay";
|
import Loading from "vue-loading-overlay";
|
||||||
import GithubButton from "vue-github-button";
|
|
||||||
import { install } from "@github/hotkey";
|
import { install } from "@github/hotkey";
|
||||||
|
|
||||||
import "vue-loading-overlay/dist/css/index.css";
|
import "vue-loading-overlay/dist/css/index.css";
|
||||||
|
import { ref } from "vue";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
ascending: this.ascending,
|
ascending: this.ascending,
|
||||||
filter: window.location.href.split("filter=")[1] || "",
|
filter: window.location.href.split("filter=")[1] || "",
|
||||||
isLoading: false,
|
|
||||||
sortColumn: this.sortColumn,
|
sortColumn: this.sortColumn,
|
||||||
topics: [],
|
topics: [],
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
// Install all the hotkeys on the page
|
window.addEventListener("keydown", this.handleKeyDown);
|
||||||
for (const el of document.querySelectorAll("[data-hotkey]")) {
|
|
||||||
install(el);
|
|
||||||
}
|
|
||||||
this.sortColumn = localStorage.getItem("sortColumn") || "score";
|
|
||||||
this.ascending =
|
|
||||||
localStorage.getItem("ascending") === "false" ? false : true;
|
|
||||||
this.isLoading = true;
|
|
||||||
this.fetchDeals();
|
this.fetchDeals();
|
||||||
},
|
},
|
||||||
|
beforeUnmount() {
|
||||||
|
window.removeEventListener("keydown", this.handleKeyDown);
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
handleKeyDown(event) {
|
||||||
|
const isInput = ["INPUT", "TEXTAREA"].includes(
|
||||||
|
document.activeElement.tagName
|
||||||
|
);
|
||||||
|
if (event.key === "/" && !isInput) {
|
||||||
|
event.preventDefault(); // prevent typing `/` into whatever is focused
|
||||||
|
this.$refs.filter.focus();
|
||||||
|
}
|
||||||
|
},
|
||||||
createFilterRoute(params) {
|
createFilterRoute(params) {
|
||||||
this.$refs.filter.blur();
|
this.$refs.filter.blur();
|
||||||
history.pushState(
|
history.pushState(
|
||||||
@@ -38,49 +42,15 @@ export default {
|
|||||||
);
|
);
|
||||||
},
|
},
|
||||||
fetchDeals() {
|
fetchDeals() {
|
||||||
this.isLoading = true;
|
|
||||||
axios
|
axios
|
||||||
.get("api/v1/topics")
|
.get("api/v1/topics")
|
||||||
.then((response) => {
|
.then((response) => {
|
||||||
this.topics = response.data;
|
this.topics = response.data;
|
||||||
this.isLoading = false;
|
|
||||||
this.sortTable(this.sortColumn, false);
|
|
||||||
})
|
})
|
||||||
.catch((err) => {
|
.catch((err) => {
|
||||||
console.log(err.response);
|
console.log(err.response);
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
sortTable: function sortTable(col, flipAscending) {
|
|
||||||
if (this.sortColumn === col && flipAscending) {
|
|
||||||
this.ascending = !this.ascending;
|
|
||||||
}
|
|
||||||
|
|
||||||
var ascending = this.ascending;
|
|
||||||
|
|
||||||
localStorage.setItem("ascending", this.ascending);
|
|
||||||
localStorage.setItem("sortColumn", col);
|
|
||||||
this.sortColumn = col;
|
|
||||||
|
|
||||||
this.topics.sort(function (a, b) {
|
|
||||||
if (a[col] > b[col]) {
|
|
||||||
return ascending ? -1 : 1;
|
|
||||||
} else if (a[col] < b[col]) {
|
|
||||||
return ascending ? 1 : -1;
|
|
||||||
}
|
|
||||||
return 0;
|
|
||||||
});
|
|
||||||
},
|
|
||||||
isMobile() {
|
|
||||||
if (
|
|
||||||
/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
|
|
||||||
navigator.userAgent
|
|
||||||
)
|
|
||||||
) {
|
|
||||||
return true;
|
|
||||||
} else {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
formatDate() {
|
formatDate() {
|
||||||
@@ -88,14 +58,6 @@ export default {
|
|||||||
return moment(String(v)).format("hh:mm A z (MM/DD)");
|
return moment(String(v)).format("hh:mm A z (MM/DD)");
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
columns() {
|
|
||||||
return {
|
|
||||||
Deal: "deal",
|
|
||||||
Score: "score",
|
|
||||||
Views: "total_views",
|
|
||||||
"Last Reply": "last_post_time",
|
|
||||||
};
|
|
||||||
},
|
|
||||||
filteredTopics() {
|
filteredTopics() {
|
||||||
return this.topics.filter((row) => {
|
return this.topics.filter((row) => {
|
||||||
const titles = (
|
const titles = (
|
||||||
@@ -119,111 +81,81 @@ export default {
|
|||||||
};
|
};
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
components: {
|
|
||||||
Loading,
|
|
||||||
GithubButton,
|
|
||||||
},
|
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
const headers = [
|
||||||
|
{ title: "Deal", value: "title", align: "center" },
|
||||||
|
{ title: "Score", value: "score", align: "center", sortable: true },
|
||||||
|
{ title: "Views", value: "total_views", align: "center", sortable: true },
|
||||||
|
{
|
||||||
|
title: "Last Post",
|
||||||
|
value: "last_post_time",
|
||||||
|
align: "center",
|
||||||
|
sortable: true,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
const sortBy = ref([{ key: "score", order: "desc" }]); // Vuetify 3 format
|
||||||
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
<v-app>
|
||||||
|
<v-main>
|
||||||
<link rel="shortcut icon" type="image/png" href="/favicon.png" />
|
<link rel="shortcut icon" type="image/png" href="/favicon.png" />
|
||||||
<body>
|
<body>
|
||||||
<input
|
<v-text-field
|
||||||
class="form-control"
|
|
||||||
type="text"
|
|
||||||
id="filter"
|
|
||||||
placeholder="Filter"
|
|
||||||
|
|
||||||
data-hotkey="/"
|
|
||||||
v-model="filter"
|
v-model="filter"
|
||||||
v-on:keyup.enter="createFilterRoute(this.filter.toString())"
|
label="Filter"
|
||||||
v-on:keyup.escape="this.$refs.filter.blur()"
|
|
||||||
ref="filter"
|
ref="filter"
|
||||||
|
@keyup.enter="createFilterRoute(filter.toString())"
|
||||||
|
@keyup.esc="$refs.filter.blur()"
|
||||||
|
hide-details="true"
|
||||||
/>
|
/>
|
||||||
<table class="table table-hover">
|
<v-data-table
|
||||||
<thead class="thead text-muted">
|
:headers="headers"
|
||||||
<tr>
|
:items="filteredTopics"
|
||||||
<th
|
:sort-by="sortColumn"
|
||||||
v-for="(col, key) in columns"
|
v-model:sortBy="sortBy"
|
||||||
v-on:click="sortTable(col, true)"
|
:items-per-page="25"
|
||||||
:key="col"
|
|
||||||
>
|
>
|
||||||
{{ key }}
|
<template #item.title="{ item }">
|
||||||
<div
|
|
||||||
class="arrow"
|
|
||||||
v-if="col == sortColumn"
|
|
||||||
v-bind:class="ascending ? 'arrow_up' : 'arrow_down'"
|
|
||||||
></div>
|
|
||||||
</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
<loading
|
|
||||||
v-model:active="isLoading"
|
|
||||||
color="#ccc"
|
|
||||||
opacity="0"
|
|
||||||
loader="bars"
|
|
||||||
:is-full-page="false"
|
|
||||||
>
|
|
||||||
</loading>
|
|
||||||
<tr
|
|
||||||
scope="row"
|
|
||||||
v-for="(topic, index) in filteredTopics"
|
|
||||||
:key="`topic.topic_id-${index}`"
|
|
||||||
>
|
|
||||||
<td scope="col">
|
|
||||||
<a
|
<a
|
||||||
:href="`https://forums.redflagdeals.com${topic.web_path}`"
|
:href="`https://forums.redflagdeals.com${item.web_path}`"
|
||||||
target="_blank"
|
target="_blank"
|
||||||
v-html="
|
v-html="
|
||||||
highlightMatches(
|
highlightMatches(
|
||||||
topic.title + ' [' + topic.Offer.dealer_name + '] '
|
item.title + ' [' + item.Offer.dealer_name + '] '
|
||||||
)
|
)
|
||||||
"
|
"
|
||||||
></a>
|
></a>
|
||||||
<a
|
<a :href="item.Offer.url" target="_blank" v-if="item.Offer.url">
|
||||||
:href="`${topic.Offer.url}`"
|
<span class="material-symbols-outlined"> link </span>
|
||||||
target="_blank"
|
</a>
|
||||||
v-if="topic.Offer.url"
|
<span v-else class="material-symbols-outlined"> link_off </span>
|
||||||
><span class="material-symbols-outlined"> link </span></a
|
</template>
|
||||||
|
|
||||||
|
<template #item.score="{ item }">
|
||||||
|
<span v-if="item.score > 0" class="green-score"
|
||||||
|
>+{{ item.score }}</span
|
||||||
>
|
>
|
||||||
<span v-if="!topic.Offer.url" class="material-symbols-outlined">
|
<span v-else-if="item.score < 0" class="red-score">{{
|
||||||
link_off
|
item.score
|
||||||
</span>
|
}}</span>
|
||||||
</td>
|
<span v-else>{{ item.score }}</span>
|
||||||
<td v-if="topic.score > 0" scope="col" class="green-score">
|
</template>
|
||||||
+{{ topic.score }}
|
|
||||||
</td>
|
<template #item.last_post_time="{ item }">
|
||||||
<td v-if="topic.score < 0" scope="col" class="red-score">
|
{{ formatDate(item.last_post_time) }}
|
||||||
{{ topic.score }}
|
</template>
|
||||||
</td>
|
|
||||||
<td v-if="topic.score == 0" scope="col">
|
<template #loading>
|
||||||
{{ topic.score }}
|
<v-progress-linear indeterminate color="grey" />
|
||||||
</td>
|
</template>
|
||||||
<td scope="col">{{ topic.total_views }}</td>
|
</v-data-table>
|
||||||
<td scope="col">{{ formatDate(topic.last_post_time) }}</td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
<div v-if="!isMobile()">
|
|
||||||
<footer class="fixed-bottom">
|
|
||||||
<small
|
|
||||||
>Press '/' to begin filtering (i.e.
|
|
||||||
<a
|
|
||||||
href="/#/filter=costco"
|
|
||||||
onclick="setTimeout(location.reload.bind(location), 1)"
|
|
||||||
>https://rfd.fyi/#/filter=costco</a
|
|
||||||
>)</small
|
|
||||||
>
|
|
||||||
<div class="footer-right">
|
|
||||||
<github-button href="https://github.com/davegallant/rfd-fyi"
|
|
||||||
>Star</github-button
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
</footer>
|
|
||||||
</div>
|
|
||||||
</body>
|
</body>
|
||||||
|
</v-main>
|
||||||
|
</v-app>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
@@ -234,4 +166,9 @@ export default {
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
color: #2c3e50;
|
color: #2c3e50;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.fixed-bottom {
|
||||||
|
background: #ffc;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -2,11 +2,10 @@ import { createApp } from "vue";
|
|||||||
import App from "./App.vue";
|
import App from "./App.vue";
|
||||||
import { createRouter, createWebHashHistory } from "vue-router";
|
import { createRouter, createWebHashHistory } from "vue-router";
|
||||||
|
|
||||||
import "bootstrap/dist/css/bootstrap.min.css";
|
|
||||||
import "bootstrap/dist/js/bootstrap.min.js";
|
|
||||||
|
|
||||||
import "./theme.css";
|
import "./theme.css";
|
||||||
|
|
||||||
|
import { registerPlugins } from "@/plugins";
|
||||||
|
|
||||||
const routes = [];
|
const routes = [];
|
||||||
|
|
||||||
const router = createRouter({
|
const router = createRouter({
|
||||||
@@ -16,5 +15,7 @@ const router = createRouter({
|
|||||||
|
|
||||||
const app = createApp(App);
|
const app = createApp(App);
|
||||||
|
|
||||||
|
registerPlugins(app);
|
||||||
|
|
||||||
app.use(router);
|
app.use(router);
|
||||||
app.mount("#app");
|
app.mount("#app");
|
||||||
|
|||||||
3
src/plugins/README.md
Normal file
3
src/plugins/README.md
Normal file
@@ -0,0 +1,3 @@
|
|||||||
|
# Plugins
|
||||||
|
|
||||||
|
Plugins are a way to extend the functionality of your Vue application. Use this folder for registering plugins that you want to use globally.
|
||||||
12
src/plugins/index.js
Normal file
12
src/plugins/index.js
Normal file
@@ -0,0 +1,12 @@
|
|||||||
|
/**
|
||||||
|
* plugins/index.js
|
||||||
|
*
|
||||||
|
* Automatically included in `./src/main.js`
|
||||||
|
*/
|
||||||
|
|
||||||
|
// Plugins
|
||||||
|
import vuetify from './vuetify'
|
||||||
|
|
||||||
|
export function registerPlugins (app) {
|
||||||
|
app.use(vuetify)
|
||||||
|
}
|
||||||
35
src/plugins/vuetify.js
Normal file
35
src/plugins/vuetify.js
Normal file
@@ -0,0 +1,35 @@
|
|||||||
|
/**
|
||||||
|
* plugins/vuetify.js
|
||||||
|
*
|
||||||
|
* Framework documentation: https://vuetifyjs.com`
|
||||||
|
*/
|
||||||
|
|
||||||
|
// Styles
|
||||||
|
import "@mdi/font/css/materialdesignicons.css";
|
||||||
|
import "vuetify/styles";
|
||||||
|
|
||||||
|
const tokyoNight = {
|
||||||
|
dark: true,
|
||||||
|
colors: {
|
||||||
|
background: "#1a1b26",
|
||||||
|
surface: "#24283b",
|
||||||
|
primary: "#7aa2f7",
|
||||||
|
secondary: "#b4f9f8",
|
||||||
|
accent: "#ff9e64",
|
||||||
|
error: "#f7768e",
|
||||||
|
info: "#2ac3de",
|
||||||
|
success: "#9ece6a",
|
||||||
|
warning: "#e0af68",
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
// Composables
|
||||||
|
import { createVuetify } from "vuetify";
|
||||||
|
|
||||||
|
// https://vuetifyjs.com/en/introduction/why-vuetify/#feature-guides
|
||||||
|
export default createVuetify({
|
||||||
|
theme: {
|
||||||
|
defaultTheme: "tokyoNight",
|
||||||
|
themes: { tokyoNight },
|
||||||
|
},
|
||||||
|
});
|
||||||
@@ -2,11 +2,6 @@ body {
|
|||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.thead {
|
|
||||||
position: sticky;
|
|
||||||
top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
html {
|
html {
|
||||||
font-family: sans-serif;
|
font-family: sans-serif;
|
||||||
min-width: 100%;
|
min-width: 100%;
|
||||||
@@ -14,16 +9,6 @@ html {
|
|||||||
-ms-text-size-adjust: 100%;
|
-ms-text-size-adjust: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
|
||||||
color: #96ada5; /**/
|
|
||||||
}
|
|
||||||
a:visited {
|
|
||||||
color: #53514f; /**/
|
|
||||||
}
|
|
||||||
a:hover {
|
|
||||||
color: #d65d03; /**/
|
|
||||||
}
|
|
||||||
|
|
||||||
footer {
|
footer {
|
||||||
background: #212529;
|
background: #212529;
|
||||||
color: white;
|
color: white;
|
||||||
@@ -41,28 +26,29 @@ footer {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.green-score {
|
.green-score {
|
||||||
color: rgb(22, 120, 63) !important;
|
color: rgb(158, 206, 106) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.red-score {
|
.red-score {
|
||||||
color: rgb(175, 21, 21) !important;
|
color: rgb(247, 118, 142) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.arrow_down {
|
a {
|
||||||
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB8AAAAaCAYAAABPY4eKAAAAAXNSR0IArs4c6QAAAvlJREFUSA29Vk1PGlEUHQaiiewslpUJiyYs2yb9AyRuJGm7c0VJoFXSX9A0sSZN04ULF12YEBQDhMCuSZOm1FhTiLY2Rky0QPlQBLRUsICoIN/0PCsGyox26NC3eTNn3r3n3TvnvvsE1PkwGo3yUqkkEQqFgw2Mz7lWqwng7ztN06mxsTEv8U0Aam5u7r5EInkplUol/f391wAJCc7nEAgE9Uwmkzo4OPiJMa1Wq6cFs7Ozt0H6RqlUDmJXfPIx+qrX69Ti4mIyHA5r6Wq1egND+j+IyW6QAUoul18XiUTDNHaSyGazKcZtdgk8wqhUKh9o/OMvsVgsfHJy0iWqVrcQNRUMBnd6enqc9MjISAmRP3e73T9al3XnbWNjIw2+KY1Gc3imsNHR0YV4PP5+d3e32h3K316TySQFoX2WyWR2glzIO5fLTSD6IElLNwbqnFpbWyO/96lCoai0cZjN5kfYQAYi5H34fL6cxWIZbya9iJyAhULBHAqFVlMpfsV/fHxMeb3er+Vy+VUzeduzwWC45XA4dlD/vEXvdDrj8DvURsYEWK3WF4FA4JQP9mg0WrHZbEYmnpa0NxYgPVObm5teiLABdTQT8a6vrwdRWhOcHMzMzCiXlpb2/yV6qDttMpkeshEzRk4Wo/bfoe4X9vb2amzGl+HoXNT29vZqsVi0sK1jJScG+Xx+HGkL4Tew2TPi5zUdQQt9otPpuBk3e0TaHmMDh1zS7/f780S0zX6Yni+NnBj09fUZUfvudDrNZN+GkQbl8Xi8RLRtHzsB9Hr9nfn5+SjSeWUCXC7XPq5kw53wsNogjZNohYXL2EljstvtrAL70/mVaW8Y4OidRO1/gwgbUMvcqGmcDc9aPvD1gnTeQ+0nmaInokRj0nHh+uvIiVOtVvt2a2vLv7Ky0tL3cRTXIcpPAwMDpq6R4/JXE4vFQ5FI5CN+QTaRSFCYc8vLy1l0rge4ARe5kJ/d27kYkLXoy2Jo4C7K8CZOsEBvb+9rlUp1xNXPL7v3IDwxvPD6AAAAAElFTkSuQmCC");
|
color: var(--v-theme-primary);
|
||||||
}
|
|
||||||
.arrow_up {
|
|
||||||
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAaCAYAAACgoey0AAAAAXNSR0IArs4c6QAAAwpJREFUSA21Vt1PUmEYP4dvkQ8JFMwtBRocWAkDbiqXrUWXzU1rrTt0bdVqXbb1tbW16C9IBUSmm27cODdneoXjputa6069qwuW6IIBIdLvdaF4OAcOiGeDc87zPs/vd57P96WpFq7p6enbGo1mjKZpeTabjU1MTCRagGnOZHFxcXxtbe1XKpUq7+zslJeXl//Mz8+Hy+Uy3RxSE9qTk5M3otFooVQqgef4Wl9f343FYoEmoISrxuNxFX5f9vb2jhn/PxUKhfLS0tIPfFifUESRUMV8Pv/M6XReRm5rTGQyGeXxeGxYe1ezeBpBOBx2rKysbO7v79d4Wy3Y2Nj4GQqFbgnhaugxwiuGJx99Pp9FLBbXxYTXvTqd7v3MzIy6riIWGxJnMpl7AwMD14xGYyMsSq1WUyQdUqn0eSPlusQIsbGrq+vl4OCgvhFQZd1utyv1en0gEolcqsi47nWJlUrlG5fLZVcoFFy2nDKSDpIWlUoVTCQSEk4lCHmJMZ2GTCbTiMVikfIZ88l7enoos9l8dXt7+z6fDicxSJUokqDX6xXcl2wCROoc0vQCWL3sNfLOSdzR0fHY4XC4tVotl40gmVwup9xuN4OQv+UyqCFGH9rg7SOGYVRcBs3IEG4J0nVnamrqOtvuBDGGgQg9+wHFcVEi4a0LNkbdd6TrPKo8ODc311mteIIYjT/a398/jK+s1jnVM0kXoufCFvq0GuiIGEVgQIhfoygM1QrteEa9dAL7ITiYCt4RMabOK5AyKKzKWtvupLcRciu8D5J0EuDDPyT/Snd39yh6VtY2NhYQSR9G79Ds7OxdskRjEyAufvb7/cPoO5Z6e1+xtVKrq6vfcFzyi/A3ZrPZ3GdNSlwgo5ekE4X2RIQGf2C1WlufFE0GBeGWYQ8YERWLxQtnUVB830MKLZfL9RHir8lkssCn2G751tZWEWe03zTKm15YWPiEiXXTYDB0Ig/t7yd8PRws4EicwWHxO4jHD8/C5HiTTqd1BwcHFozKU89origB+y/kmzgYpgOBQP4fGmUiZmJ+WNgAAAAASUVORK5CYII=");
|
|
||||||
}
|
|
||||||
.arrow {
|
|
||||||
float: right;
|
|
||||||
width: 10px;
|
|
||||||
height: 12px;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
background-size: contain;
|
|
||||||
background-position-y: bottom;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.material-symbols-outlined {
|
a:hover {
|
||||||
font-size: medium;
|
color: #d65d03;
|
||||||
|
}
|
||||||
|
|
||||||
|
a:visited {
|
||||||
|
color: #53514f;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 769px) {
|
||||||
|
.v-data-table-header th,
|
||||||
|
.v-data-table__td,
|
||||||
|
.v-data-footer {
|
||||||
|
font-size: 1.2rem;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
58
vite.config.mjs
Normal file
58
vite.config.mjs
Normal file
@@ -0,0 +1,58 @@
|
|||||||
|
// Plugins
|
||||||
|
import Components from "unplugin-vue-components/vite";
|
||||||
|
import Vue from "@vitejs/plugin-vue";
|
||||||
|
import Vuetify, { transformAssetUrls } from "vite-plugin-vuetify";
|
||||||
|
import Fonts from "unplugin-fonts/vite";
|
||||||
|
|
||||||
|
// Utilities
|
||||||
|
import { defineConfig } from "vite";
|
||||||
|
import { fileURLToPath, URL } from "node:url";
|
||||||
|
|
||||||
|
// https://vitejs.dev/config/
|
||||||
|
export default defineConfig({
|
||||||
|
plugins: [
|
||||||
|
Vue({
|
||||||
|
template: { transformAssetUrls },
|
||||||
|
}),
|
||||||
|
// https://github.com/vuetifyjs/vuetify-loader/tree/master/packages/vite-plugin#readme
|
||||||
|
Vuetify(),
|
||||||
|
Components(),
|
||||||
|
Fonts({
|
||||||
|
fontsource: {
|
||||||
|
families: [
|
||||||
|
{
|
||||||
|
name: "Roboto",
|
||||||
|
weights: [100, 300, 400, 500, 700, 900],
|
||||||
|
styles: ["normal", "italic"],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
}),
|
||||||
|
],
|
||||||
|
optimizeDeps: {
|
||||||
|
exclude: ["vuetify"],
|
||||||
|
},
|
||||||
|
define: { "process.env": {} },
|
||||||
|
resolve: {
|
||||||
|
alias: {
|
||||||
|
"@": fileURLToPath(new URL("src", import.meta.url)),
|
||||||
|
},
|
||||||
|
extensions: [".js", ".json", ".jsx", ".mjs", ".ts", ".tsx", ".vue"],
|
||||||
|
},
|
||||||
|
server: {
|
||||||
|
port: 3000,
|
||||||
|
proxy: {
|
||||||
|
"/api": "http://localhost:8080",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
css: {
|
||||||
|
preprocessorOptions: {
|
||||||
|
sass: {
|
||||||
|
api: "modern-compiler",
|
||||||
|
},
|
||||||
|
scss: {
|
||||||
|
api: "modern-compiler",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
||||||
@@ -1,7 +0,0 @@
|
|||||||
const { defineConfig } = require("@vue/cli-service");
|
|
||||||
module.exports = defineConfig({
|
|
||||||
transpileDependencies: true,
|
|
||||||
devServer: {
|
|
||||||
proxy: "http://localhost:8080",
|
|
||||||
},
|
|
||||||
});
|
|
||||||
Reference in New Issue
Block a user