Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
13 changes: 13 additions & 0 deletions CONTRIBUTING.md
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,7 @@ This focus helps guide our project decisions as a community and what we choose t
- [Naming conventions](#naming-conventions)
- [Vue components](#vue-components)
- [Internal linking](#internal-linking)
- [Cursor and navigation](#cursor-and-navigation)
- [RTL Support](#rtl-support)
- [Localization (i18n)](#localization-i18n)
- [Approach](#approach)
Expand Down Expand Up @@ -392,6 +393,18 @@ For package links, use the auto-imported `packageRoute()` utility from `app/util
| `~username` | `/~:username` | `username` |
| `~username-orgs` | `/~:username/orgs` | `username` |

### Cursor and navigation

**npmx** uses `cursor: pointer` only for links to match users’ everyday experience. For all other interactive elements, including buttons, use the default cursor (_or another appropriate cursor to indicate state_).

> [!NOTE]
> A link is any element that leads to another content (_go to another page, authorize_)
> A button is any element that operates an action (_show tooltip, open menu, "like" package, open dropdown_)
> If you're unsure which element to use - feel free to ask question in the issue or on discord
> [!IMPORTANT]
> Always Prefer implementing navigation as real links whenever possible. This ensures they can be opened in a new tab, shared or reloaded, and so the same content is available at a stable URL
## RTL Support

We support `right-to-left` languages, we need to make sure that the UI is working correctly in both directions.
Expand Down
2 changes: 1 addition & 1 deletion app/components/Button/Base.vue
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ defineExpose({
<template>
<button
ref="el"
class="group cursor-pointer gap-x-1 items-center justify-center font-mono border border-border rounded-md transition-all duration-200 disabled:(opacity-40 cursor-not-allowed border-transparent)"
class="group gap-x-1 items-center justify-center font-mono border border-border rounded-md transition-all duration-200 disabled:(opacity-40 cursor-not-allowed border-transparent)"
:class="{
'inline-flex': !block,
'flex': block,
Expand Down
Loading