gib/Bang
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Make prettier

Browse Source
This commit is contained in:
Gabriel Brown 2025-02-28 10:06:04 -06:00
parent 8f77173b8b
commit 69239287b2
2 changed files with 31 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
src/global.css
View File

@ -93,17 +93,25 @@ textarea {
} }
/* --- Container layout unchanged --- */ /* --- Container layout unchanged --- */
.url-container { .main-container {
display: flex; display: flex;
flex-direction: column;
align-items: center; align-items: center;
gap: 8px; justify-content: center;
margin-top: 16px; min-height: 100vh;
padding: 20px 0px;
} }
.content-container { .content-container {
max-width: 36rem; max-width: 36rem;
text-align: center; text-align: center;
padding: 0 8px; padding: 0 8px;
} }
.url-container {
display: flex;
align-items: center;
gap: 8px;
margin-top: 16px;
}
/* --- URL input element styling adjustments --- */ /* --- URL input element styling adjustments --- */
.url-input { .url-input {
@ -168,23 +176,13 @@ textarea {
flex-direction: row; flex-direction: row;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
gap: 32px; gap: 24px;
}
@media (max-width: 500px) {
.settings-links-container {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 32px;
}
} }
.browser-link-container { .browser-link-container {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 12px; gap: 8px;
margin-bottom: 16px;
} }
.browser-instruction { .browser-instruction {
display: flex; display: flex;
@ -208,3 +206,19 @@ textarea {
background-color: var(--input-bg-color); background-color: var(--input-bg-color);
width: 100px; width: 100px;
} }
/* --- Mobile --- */
@media (max-width: 500px) {
.settings-links-container {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 32px;
}
.main-container {
justify-content: flex-start;
padding: 40px;
}
}

4
src/main.ts
View File

@ -4,7 +4,7 @@ import "./global.css";
function noSearchDefaultPageRender() { function noSearchDefaultPageRender() {
const app = document.querySelector<HTMLDivElement>("#app")!; const app = document.querySelector<HTMLDivElement>("#app")!;
app.innerHTML = ` app.innerHTML = `
<div style="display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100vh;"> <main class="main-container">
<div class="content-container"> <div class="content-container">
<h1 class="bang-title">💣 Bang!</h1> <h1 class="bang-title">💣 Bang!</h1>
<p> <p>
@ -75,7 +75,7 @@ function noSearchDefaultPageRender() {
</div> </div>
</div> </div>
</div> </div>
</div> </main>
`; `;
const copyButton = app.querySelector<HTMLButtonElement>(".copy-button")!; const copyButton = app.querySelector<HTMLButtonElement>(".copy-button")!;