Skip to content

Commit

Permalink
fix dropdown styles on other browsers
Browse files Browse the repository at this point in the history
  • Loading branch information
mozzius committed Dec 19, 2024
1 parent ec660f5 commit 45336d3
Show file tree
Hide file tree
Showing 4 changed files with 17 additions and 8 deletions.
2 changes: 1 addition & 1 deletion .eslintrc.js
Original file line number Diff line number Diff line change
Expand Up @@ -104,7 +104,6 @@ module.exports = {
'*.lock',
'.husky',
'patches',
'bskyweb',
'*.html',
'bskyweb',
'bskyembed',
Expand All @@ -117,5 +116,6 @@ module.exports = {
parserOptions: {
sourceType: 'module',
ecmaVersion: 'latest',
projectSerivce: true,
},
}
2 changes: 1 addition & 1 deletion bskyembed/.eslintrc
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,6 @@
"parserOptions": {
"sourceType": "module",
"ecmaVersion": "latest",
"project": "./tsconfig.json"
"project": "./bskyembed/tsconfig.json"
}
}
11 changes: 11 additions & 0 deletions bskyembed/src/index.css
Original file line number Diff line number Diff line change
Expand Up @@ -9,3 +9,14 @@
:root {
color-scheme: light dark;
}

select {
background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' height='14px' width='14px' fill='none' viewBox='0 0 24 24'><path fill='black' fill-rule='evenodd' d='M3.293 8.293a1 1 0 0 1 1.414 0L12 15.586l7.293-7.293a1 1 0 1 1 1.414 1.414l-8 8a1 1 0 0 1-1.414 0l-8-8a1 1 0 0 1 0-1.414Z' clip-rule='evenodd'/></svg>");
background-repeat: no-repeat;
background-position: calc(100% - 0.75rem) center;
padding-right: 2rem;

@media (prefers-color-scheme: dark) {
background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' height='14px' width='14px' fill='none' viewBox='0 0 24 24'><path fill='white' fill-rule='evenodd' d='M3.293 8.293a1 1 0 0 1 1.414 0L12 15.586l7.293-7.293a1 1 0 1 1 1.414 1.414l-8 8a1 1 0 0 1-1.414 0l-8-8a1 1 0 0 1 0-1.414Z' clip-rule='evenodd'/></svg>");
}
}
10 changes: 4 additions & 6 deletions bskyembed/src/screens/landing.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -125,7 +125,7 @@ function LandingPage() {

<h1 className="text-4xl font-bold text-center">Embed a Bluesky Post</h1>

<div className="flex flex-col w-full max-w-[600px] gap-4">
<div className="flex flex-col w-full max-w-[600px] gap-6">
<input
type="text"
value={uri}
Expand All @@ -134,10 +134,8 @@ function LandingPage() {
placeholder={DEFAULT_POST}
/>

<div>
<label
className="block pb-1.5 text-sm font-medium"
for="colorModeSelect">
<div className="flex flex-col gap-1.5">
<label className="text-sm font-medium" for="colorModeSelect">
Theme
</label>
<select
Expand All @@ -149,7 +147,7 @@ function LandingPage() {
}
}}
id="colorModeSelect"
className="bg-white block border w-full rounded-lg text-sm px-3 py-2 dark:bg-dimmedBg dark:border-slate-500">
className="appearance-none bg-white border w-full rounded-lg text-sm px-3 py-2 dark:bg-dimmedBg dark:border-slate-500">
<option value="system">System</option>
<option value="light">Light</option>
<option value="dark">Dark</option>
Expand Down

0 comments on commit 45336d3

Please sign in to comment.