Skip to content

Commit ffc8339

Browse files
committed
Make open settings responsive
1 parent 5f91af2 commit ffc8339

File tree

1 file changed

+8
-7
lines changed

1 file changed

+8
-7
lines changed

app/components/verification/Settings.tsx

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -94,17 +94,18 @@ export default function Settings() {
9494
showSettings ? "rounded-t-lg" : "rounded-lg"
9595
}`}
9696
>
97-
<div className="flex items-center justify-between py-1 px-4">
98-
<div className="text-sm text-gray-700">
99-
<span className="font-medium">Sourcify Server:</span> <span className="font-mono">{serverUrl}</span>
97+
<div className="flex items-center justify-between py-1 px-2 sm:px-4">
98+
<div className="text-sm text-gray-700 min-w-0 flex-1 mr-2">
99+
<span className="font-medium">Sourcify Server:</span>{" "}
100+
<span className="font-mono truncate block sm:inline max-w-full sm:max-w-none">{serverUrl}</span>
100101
</div>
101102
<button
102103
type="button"
103104
onClick={() => setShowSettings(!showSettings)}
104-
className="flex items-center space-x-2 px-3 py-2 text-sm text-gray-600 hover:text-gray-900 hover:bg-gray-100 rounded-md transition-colors"
105+
className="flex items-center space-x-1 sm:space-x-2 px-2 sm:px-3 py-2 text-sm text-gray-600 hover:text-gray-900 hover:bg-gray-100 rounded-md transition-colors flex-shrink-0"
105106
>
106107
<IoSettings className="w-4 h-4" />
107-
<span>{showSettings ? "Close Settings" : "Open Settings"}</span>
108+
<span className="hidden sm:inline">{showSettings ? "Close Settings" : "Open Settings"}</span>
108109
</button>
109110
</div>
110111

@@ -113,8 +114,8 @@ export default function Settings() {
113114
showSettings ? "max-h-96 opacity-100" : "max-h-0 opacity-0"
114115
}`}
115116
>
116-
<div className="px-4 pb-6 pt-4">
117-
<h3 className="text-lg font-semibold text-gray-900 mb-4">Server Settings</h3>
117+
<div className="px-2 sm:px-4 pb-4 sm:pb-6 pt-4">
118+
<h3 className="text-base sm:text-lg font-semibold text-gray-900 mb-4">Server Settings</h3>
118119
<div className="space-y-4">
119120
<div>
120121
<label className="block text-sm font-medium text-gray-700 mb-2">Select Server URL</label>

0 commit comments

Comments
 (0)