true1ann/blhs
1
0
Fork 0
Code Issues Pull requests Projects Releases 3 Packages Wiki Activity Actions

Fix display issues with, fix minor bugs, update AppIcon and add 'Made with' to Settings.vue

Browse source
This commit is contained in:
Annie 2025-04-04 14:21:40 +03:00
parent 29fade983d
commit 9683b8eafa
14 changed files with 89 additions and 49 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
dist/assets/index-Byzfhg1j.css vendored
View file

@ -1 +0,0 @@
body{margin:0;padding:0;box-sizing:border-box;background-color:gray}#applist{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-snap-stop:always}#applist-wrapper{width:100%}.applist-page{scroll-snap-align:start;display:flex;flex-direction:row;flex-wrap:wrap;min-width:100vw;justify-content:flex-start;align-content:flex-start;padding-bottom:10%;padding-top:5%}.applist-page>*{min-width:25%;margin-bottom:5%}#dock{padding:5%;margin:5%;gap:15px;border-radius:24px;background-color:#00000040;border:1px solid white;display:flex;justify-content:center;position:fixed;bottom:0;left:0;right:0}.section{padding:5%;margin:0 5% 5%;border-radius:15px;background-color:#00000040;border:1px solid white;width:100%}.ui-button{border:none;border:1px solid white;border-radius:6px;padding:2%;background-color:#00000080;color:#fff;margin:1%}.app-icon[data-v-fa001907]{display:flex;align-items:center;flex-direction:column;width:max-content;height:max-content}.app-icon .app-icon[data-v-fa001907]>*:nth-child(n+2){padding-bottom:10px}.app-image[data-v-fa001907]{width:60px;height:60px;border-radius:12px}.app-label[data-v-fa001907]{font-size:12px;color:var(--label-color)}.app-package[data-v-fa001907]{font-size:3px;color:#0000}

17
dist/assets/index-C4iP7xdQ.js vendored
View file

File diff suppressed because one or more lines are too long

1
dist/assets/index-M6NLxF6S.css vendored Normal file
View file

@ -0,0 +1 @@
body{margin:0;padding:0;background-color:gray}*{box-sizing:border-box}#applist{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-snap-stop:always}#applist-wrapper{width:100%}.applist-page{scroll-snap-align:start;display:grid;grid-template-columns:repeat(4,25%);grid-template-rows:repeat(5,20%);place-items:center;align-items:start;min-width:100vw;max-width:100vw;width:100vw;padding-bottom:25%;padding-top:5%}.applist-page>*:not(.section){width:auto;margin-bottom:5%;display:flex;flex-direction:column;align-items:center}.applist-page:has(.section){display:flex;flex-direction:column;align-items:center;padding:5%;gap:5%}#dock{padding:5%;margin:5%;gap:15px;border-radius:24px;background-color:#00000040;border:1px solid white;display:flex;justify-content:center;position:fixed;bottom:0;left:0;right:0}.section{padding:5%;border-radius:15px;background-color:#00000080;border:1px solid white;width:100%;color:#fff}.ui-button{border:none;border:1px solid white;border-radius:6px;padding:2%;background-color:#00000080;color:#fff;margin:1%}.app-icon[data-v-a45179cd]{display:flex;align-items:center;flex-direction:column;width:max-content;height:max-content}.app-icon .app-icon[data-v-a45179cd]>*:nth-child(n+2){padding-bottom:10px}.app-image[data-v-a45179cd]{width:14vw;height:auto;border-radius:12px}.app-label[data-v-a45179cd]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:10pt;color:var(--label-color)}.app-package[data-v-a45179cd]{font-size:1px;color:#0000}img[data-v-27ae4006]{width:15%;height:auto}

17
dist/assets/index-zJphMIID.js vendored Normal file
View file

File diff suppressed because one or more lines are too long

BIN
dist/bundle.zip vendored Normal file
View file

Binary file not shown.

BIN
dist/com.tored.bridgelauncher.png vendored Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 6.8 KiB

6
dist/index.html vendored
View file

@ -5,10 +5,10 @@
<link rel="icon" type="image/svg+xml" href="/vite.svg" /> <link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>SpringBoard</title> <title>SpringBoard</title>
<script type="module" crossorigin src="/assets/index-C4iP7xdQ.js"></script> <script type="module" crossorigin src="/assets/index-zJphMIID.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-Byzfhg1j.css"> <link rel="stylesheet" crossorigin href="/assets/index-M6NLxF6S.css">
</head> </head>
<body> <body style="background-color:transparent;">
<div id="app"></div> <div id="app"></div>
</body> </body>
</html> </html>

2
index.html
View file

@ -6,7 +6,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>SpringBoard</title> <title>SpringBoard</title>
</head> </head>
<body> <body style="background-color:transparent;">
<div id="app"></div> <div id="app"></div>
<script type="module" src="/src/main.js"></script> <script type="module" src="/src/main.js"></script>
</body> </body>

5
package.json
View file

@ -5,8 +5,9 @@
"type": "module", "type": "module",
"scripts": { "scripts": {
"dev": "vite", "dev": "vite",
"build": "vite build", "build": "vite build && rm -rf dist/mock",
"preview": "vite preview" "preview": "vite preview",
"zip": "zip -r dist/bundle.zip dist/"
}, },
"dependencies": { "dependencies": {
"@bridgelauncher/api-mock": "^0.1.0", "@bridgelauncher/api-mock": "^0.1.0",

BIN
public/com.tored.bridgelauncher.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 6.8 KiB

20
src/components/AppIcon.vue
View file

@ -1,7 +1,6 @@
<script setup> <script setup>
import { defineProps, ref, onMounted } from 'vue' import { defineProps, ref } from 'vue'
// Define component props
const props = defineProps({ const props = defineProps({
packageName: { packageName: {
type: String, type: String,
@ -24,12 +23,12 @@ if (Bridge.getSystemNightMode() == 'yes') {
} else { } else {
darkLabel = false; darkLabel = false;
} }
// Create a ref to hold the icon URL
const icon = ref(''); const icon = ref('');
icon.value = await Bridge.getDefaultAppIconURL(props.packageName); icon.value = await Bridge.getDefaultAppIconURL(props.packageName);
const label = ref('') const label = ref('')
if (props.label.length >= 10) { if (props.label.length >= 12) {
label.value = `${props.label.slice(0, 10 - 3).trim()}...`; label.value = `${props.label.slice(0, 12 - 3).trim()}...`;
} else { } else {
label.value = props.label; label.value = props.label;
} }
@ -65,18 +64,21 @@ function handleClick() {
} }
.app-image { .app-image {
width: 60px; width: 14vw;
height: 60px; height: auto;
border-radius: 12px; border-radius: 12px;
} }
.app-label { .app-label {
font-size: 12px; white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-size: 10pt;
color: var(--label-color); color: var(--label-color);
} }
.app-package { .app-package {
font-size: 3px; font-size: 1px;
color: #00000000; color: #00000000;
} }
</style> </style>

25
src/components/Settings.vue
View file

@ -1,4 +1,5 @@
<script setup> <script setup>
import { ref } from 'vue';
function toggleBridgeButton() { function toggleBridgeButton() {
console.log('Changed Bridge Button visibility to...') console.log('Changed Bridge Button visibility to...')
if (Bridge.getBridgeButtonVisibility() == 'shown') { if (Bridge.getBridgeButtonVisibility() == 'shown') {
@ -11,13 +12,15 @@ function toggleBridgeButton() {
} }
function toggleSystemWallpapers() { function toggleSystemWallpapers() {
console.log('Changed system wallpapers to...') console.log('Changed draw system wallpapers to...')
if (Bridge.getDrawSystemWallpaperBehindWebViewEnabled()) { if (Bridge.getDrawSystemWallpaperBehindWebViewEnabled()) {
Bridge.requestSetDrawSystemWallpaperBehindWebViewEnabled(false); Bridge.requestSetDrawSystemWallpaperBehindWebViewEnabled(false);
document.body.style.backgroundColor = '';
console.log('false'); console.log('false');
} else { } else {
Bridge.requestSetDrawSystemWallpaperBehindWebViewEnabled(true); Bridge.requestSetDrawSystemWallpaperBehindWebViewEnabled(true);
console.log('true'); console.log('true');
document.body.style.backgroundColor = 'transparent';
} }
} }
@ -38,6 +41,7 @@ function openBridgeAppDrawer() {
function reloadWindow() { function reloadWindow() {
window.location.reload(); window.location.reload();
} }
</script> </script>
<template> <template>
@ -48,6 +52,21 @@ function reloadWindow() {
<button class="ui-button" @click="toggleOverscrolling()">Toggle overscrolling</button> <button class="ui-button" @click="toggleOverscrolling()">Toggle overscrolling</button>
<button class="ui-button" @click="reloadWindow()">Reload</button> <button class="ui-button" @click="reloadWindow()">Reload</button>
<br> <br>
<small style="font-size:xx-small;color:white">Everything else can be configured through Bridge's Settings</small> <small style="font-size:xx-small;">Everything else can be configured through Bridge's Settings</small>
</div> </div>
</template> <div class="section" style="display:flex;flex-direction:column;align-items: center;">
<span style="width:max-content;">Made with</span>
<div style="display:flex;justify-content:space-around;width:100%;">
<img src="/vite.svg">
<img src="/vue.svg">
<img src="/com.tored.bridgelauncher.png" alt="Bridge">
</div>
</div>
</template>
<style scoped>
img {
width: 15%;
height: auto;
}
</style>

40
src/style.scss
View file

@ -1,10 +1,13 @@
body { body {
margin: 0; margin: 0;
padding: 0; padding: 0;
box-sizing: border-box;
background-color: #808080; background-color: #808080;
} }
* {
box-sizing: border-box;
}
#applist { #applist {
display: flex; display: flex;
overflow-x: auto; overflow-x: auto;
@ -18,18 +21,30 @@ body {
.applist-page { .applist-page {
scroll-snap-align: start; scroll-snap-align: start;
display: flex; display: grid;
flex-direction: row; grid-template-columns: repeat(4, 25%);
flex-wrap: wrap; grid-template-rows: repeat(5, 20%);
place-items: center;
align-items: start;
min-width: 100vw; min-width: 100vw;
justify-content: flex-start; max-width: 100vw;
align-content: flex-start; width: 100vw;
padding-bottom: 10%; padding-bottom: 25%;
padding-top: 5%; padding-top: 5%;
& > * { & > *:not(.section) {
min-width: 25%; // 4 columns width: auto;
margin-bottom: 5%; margin-bottom: 5%;
display: flex;
flex-direction: column;
align-items: center;
} }
&:has(.section) {
display: flex;
flex-direction: column;
align-items: center;
padding: 5%;
gap: 5%;
}
} }
#dock { #dock {
@ -49,12 +64,11 @@ body {
.section { .section {
padding: 5%; padding: 5%;
margin: 5%;
margin-top: 0;
border-radius: 15px; border-radius: 15px;
background-color: rgba(0,0,0,0.25); background-color: rgba(0,0,0,0.5);
border: 1px solid white; border: 1px solid white;
width: 100% width: 100%;
color: white;
} }
.ui-button { .ui-button {

4
vite.config.js
View file

@ -12,4 +12,8 @@ export default defineConfig({
}, },
}, },
}, },
build: {
outDir: 'dist',
emptyOutDir: true,
},
}) })