feat: css query for first, last, and solo niri workspace(s)

[ThatOneCalculator]

Closes #3610

Was able to achieve this effect with

#workspaces button {
	margin-top: 4px;
	margin-bottom: 0px;
	padding: 0 7px;
	border-radius: 0;
	background: #1f1d2e;
	color: #6e6a86;
	transition: color 0.2s ease-in-out;
}

#workspaces button.first {
	padding-left: 12px;
	border-radius: 10px 0 0 10px;
	margin-left: 8px;
}

#workspaces button.last {
	padding-right: 12px;
	border-radius: 0 10px 10px 0;
}

#workspaces button.solo {
	border-radius: 10px;
	padding: 0 12px;
	margin-left: 8px;
	border-radius: 10px;
}

#workspaces button.active {
	color: #e0def4;
	background: #1f1d2e;
}

Video_2024-09-15_17-10-02.webm

[ThatOneCalculator]

Now covers a case that's actually impossible to screen record -- if there's only one workspace (despite niri normally having two minimum) by going to the 2nd workspace with zero windows open, it has a class called solo.

Also, adds a class called first to the first workspace, makes things semantically easier & fixes issue with priority when using the named/indexed version.

[Alexays]

Lgtm, can you add some documentations to the man?

[ThatOneCalculator]

As pointed out by @YaLTeR in #3610 (comment) , this PR is unnecessary.

#workspaces button:first-child {
	padding-left: 12px;
	border-radius: 10px 0 0 10px;
	margin-left: 8px;
}

#workspaces button:last-child {
	padding-right: 12px;
	border-radius: 0 10px 10px 0;
}

#workspaces button:first-child:last-child {
	border-radius: 10px;
	padding: 0 12px;
	margin-left: 8px;
	border-radius: 10px;
}