Skip to content

Commit 239a98b

Browse files
committed
make instruments more like buttons
1 parent 48fe405 commit 239a98b

File tree

4 files changed

+37
-39
lines changed

4 files changed

+37
-39
lines changed

app/components/InstrumentWallCard.tsx

Lines changed: 7 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -9,19 +9,17 @@ export default function InstrumentWallCard({
99
instrument: IfcInstrumentStatus;
1010
}) {
1111
return (
12-
<div
13-
className={`flex items-center justify-between p-3 rounded-lg shadow-sm border-2 border-gray-700 dark:border-gray-200 hover:shadow-lg hover:border-black dark:hover:border-gray-700 transition-all duration-200
14-
${getStatusColour(instrument.runstate || "UNKNOWN")} ${getForegroundColour(
15-
instrument.runstate || "UNKNOWN",
16-
)}`}
17-
>
12+
<div className={"flex"}>
1813
<Link
1914
href={"/instrument?name=" + instrument.name}
20-
className="flex items-center justify-center lg:w-20 w-full h-4"
2115
target="_blank"
16+
className={`flex items-center justify-center text-center p-3 min-w-28 w-auto max-h-12 rounded-lg shadow-sm border-2 border-gray-700 dark:border-gray-200 hover:shadow-lg hover:border-black dark:hover:border-gray-700 transition-all duration-200
17+
${getStatusColour(instrument.runstate || "UNKNOWN")} ${getForegroundColour(
18+
instrument.runstate || "UNKNOWN",
19+
)}`}
2220
>
23-
<div className="flex flex-col justify-center items-center">
24-
<span className="text-sm font-bold truncate line-clamp-1 ">
21+
<div className="flex flex-col">
22+
<span className="text-sm font-bold line-clamp-1 w-full">
2523
{instrument.name}
2624
</span>
2725
<span className="text-xs ">{instrument.runstate || "UNKNOWN"}</span>

app/components/__snapshots__/InstrumentWallCard.test.tsx.snap

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -3,19 +3,19 @@
33
exports[`renders instrumentwallcard unchanged 1`] = `
44
<div>
55
<div
6-
class="flex items-center justify-between p-3 rounded-lg shadow-sm border-2 border-gray-700 dark:border-gray-200 hover:shadow-lg hover:border-black dark:hover:border-gray-700 transition-all duration-200
7-
bg-[#90EE90] text-black"
6+
class="flex"
87
>
98
<a
10-
class="flex items-center justify-center lg:w-20 w-full h-4"
9+
class="flex items-center justify-center text-center p-3 min-w-28 w-auto max-h-12 rounded-lg shadow-sm border-2 border-gray-700 dark:border-gray-200 hover:shadow-lg hover:border-black dark:hover:border-gray-700 transition-all duration-200
10+
bg-[#90EE90] text-black"
1111
href="/instrument?name=Instrument"
1212
target="_blank"
1313
>
1414
<div
15-
class="flex flex-col justify-center items-center"
15+
class="flex flex-col"
1616
>
1717
<span
18-
class="text-sm font-bold truncate line-clamp-1 "
18+
class="text-sm font-bold line-clamp-1 w-full"
1919
>
2020
Instrument
2121
</span>
@@ -33,19 +33,19 @@ exports[`renders instrumentwallcard unchanged 1`] = `
3333
exports[`renders instrumentwallcard unchanged when runstate is unknown 1`] = `
3434
<div>
3535
<div
36-
class="flex items-center justify-between p-3 rounded-lg shadow-sm border-2 border-gray-700 dark:border-gray-200 hover:shadow-lg hover:border-black dark:hover:border-gray-700 transition-all duration-200
37-
bg-[#F08080] text-black"
36+
class="flex"
3837
>
3938
<a
40-
class="flex items-center justify-center lg:w-20 w-full h-4"
39+
class="flex items-center justify-center text-center p-3 min-w-28 w-auto max-h-12 rounded-lg shadow-sm border-2 border-gray-700 dark:border-gray-200 hover:shadow-lg hover:border-black dark:hover:border-gray-700 transition-all duration-200
40+
bg-[#F08080] text-black"
4141
href="/instrument?name=Instrument1"
4242
target="_blank"
4343
>
4444
<div
45-
class="flex flex-col justify-center items-center"
45+
class="flex flex-col"
4646
>
4747
<span
48-
class="text-sm font-bold truncate line-clamp-1 "
48+
class="text-sm font-bold line-clamp-1 w-full"
4949
>
5050
Instrument1
5151
</span>

app/components/__snapshots__/ScienceGroup.test.tsx.snap

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -14,19 +14,19 @@ exports[`renders sciencegroup unchanged 1`] = `
1414
class="flex flex-wrap gap-1"
1515
>
1616
<div
17-
class="flex items-center justify-between p-3 rounded-lg shadow-sm border-2 border-gray-700 dark:border-gray-200 hover:shadow-lg hover:border-black dark:hover:border-gray-700 transition-all duration-200
18-
bg-[#90EE90] text-black"
17+
class="flex"
1918
>
2019
<a
21-
class="flex items-center justify-center lg:w-20 w-full h-4"
20+
class="flex items-center justify-center text-center p-3 min-w-28 w-auto max-h-12 rounded-lg shadow-sm border-2 border-gray-700 dark:border-gray-200 hover:shadow-lg hover:border-black dark:hover:border-gray-700 transition-all duration-200
21+
bg-[#90EE90] text-black"
2222
href="/instrument?name=Instrument"
2323
target="_blank"
2424
>
2525
<div
26-
class="flex flex-col justify-center items-center"
26+
class="flex flex-col"
2727
>
2828
<span
29-
class="text-sm font-bold truncate line-clamp-1 "
29+
class="text-sm font-bold line-clamp-1 w-full"
3030
>
3131
Instrument
3232
</span>
@@ -39,19 +39,19 @@ exports[`renders sciencegroup unchanged 1`] = `
3939
</a>
4040
</div>
4141
<div
42-
class="flex items-center justify-between p-3 rounded-lg shadow-sm border-2 border-gray-700 dark:border-gray-200 hover:shadow-lg hover:border-black dark:hover:border-gray-700 transition-all duration-200
43-
bg-[#DAA520] text-black"
42+
class="flex"
4443
>
4544
<a
46-
class="flex items-center justify-center lg:w-20 w-full h-4"
45+
class="flex items-center justify-center text-center p-3 min-w-28 w-auto max-h-12 rounded-lg shadow-sm border-2 border-gray-700 dark:border-gray-200 hover:shadow-lg hover:border-black dark:hover:border-gray-700 transition-all duration-200
46+
bg-[#DAA520] text-black"
4747
href="/instrument?name=Instrument2"
4848
target="_blank"
4949
>
5050
<div
51-
class="flex flex-col justify-center items-center"
51+
class="flex flex-col"
5252
>
5353
<span
54-
class="text-sm font-bold truncate line-clamp-1 "
54+
class="text-sm font-bold line-clamp-1 w-full"
5555
>
5656
Instrument2
5757
</span>

app/components/__snapshots__/TargetStation.test.tsx.snap

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -14,19 +14,19 @@ exports[`renders targetstation unchanged 1`] = `
1414
class="flex flex-wrap gap-1"
1515
>
1616
<div
17-
class="flex items-center justify-between p-3 rounded-lg shadow-sm border-2 border-gray-700 dark:border-gray-200 hover:shadow-lg hover:border-black dark:hover:border-gray-700 transition-all duration-200
18-
bg-green-900 text-white"
17+
class="flex"
1918
>
2019
<a
21-
class="flex items-center justify-center lg:w-20 w-full h-4"
20+
class="flex items-center justify-center text-center p-3 min-w-28 w-auto max-h-12 rounded-lg shadow-sm border-2 border-gray-700 dark:border-gray-200 hover:shadow-lg hover:border-black dark:hover:border-gray-700 transition-all duration-200
21+
bg-green-900 text-white"
2222
href="/instrument?name=Instrument"
2323
target="_blank"
2424
>
2525
<div
26-
class="flex flex-col justify-center items-center"
26+
class="flex flex-col"
2727
>
2828
<span
29-
class="text-sm font-bold truncate line-clamp-1 "
29+
class="text-sm font-bold line-clamp-1 w-full"
3030
>
3131
Instrument
3232
</span>
@@ -39,19 +39,19 @@ exports[`renders targetstation unchanged 1`] = `
3939
</a>
4040
</div>
4141
<div
42-
class="flex items-center justify-between p-3 rounded-lg shadow-sm border-2 border-gray-700 dark:border-gray-200 hover:shadow-lg hover:border-black dark:hover:border-gray-700 transition-all duration-200
43-
bg-[#FFFF00] text-black"
42+
class="flex"
4443
>
4544
<a
46-
class="flex items-center justify-center lg:w-20 w-full h-4"
45+
class="flex items-center justify-center text-center p-3 min-w-28 w-auto max-h-12 rounded-lg shadow-sm border-2 border-gray-700 dark:border-gray-200 hover:shadow-lg hover:border-black dark:hover:border-gray-700 transition-all duration-200
46+
bg-[#FFFF00] text-black"
4747
href="/instrument?name=Instrument2"
4848
target="_blank"
4949
>
5050
<div
51-
class="flex flex-col justify-center items-center"
51+
class="flex flex-col"
5252
>
5353
<span
54-
class="text-sm font-bold truncate line-clamp-1 "
54+
class="text-sm font-bold line-clamp-1 w-full"
5555
>
5656
Instrument2
5757
</span>

0 commit comments

Comments
 (0)