Conversation
| // - + 2 inter-column gaps | ||
| // - − half a gap (because it’s visually shared with the next block) | ||
|
|
||
| $grid-exception-input-width-small: calc(#{$sz-32} * 2.5 + 2 * var(--sp-xs) - (var(--sp-xs) / 2)); |
There was a problem hiding this comment.
While the var is named $grid-exception-input-width-small in the docs is referred as grid-exception-input-small. Not sure if I am missing some context
| ;; https://tree.taiga.io/project/penpot/task/13704 | ||
|
|
||
| (if token-numeric-inputs | ||
| ;; TODO: Rename this section when duplicated code is deleted |
There was a problem hiding this comment.
Rename or remove?
In the previous comment you say it should be removed.
;; Once the feature is released, the duplicated ClojureScript and SCSS code should be removed.
And, by section you mean the contents of the <section> element? (or this includes the conditional
| :tooltip-placement "top-left" | ||
| :icon i/lock}])] | ||
|
|
||
| [:section {:class (stl/css-case :element-set-content true |
There was a problem hiding this comment.
Not sure if this is a nested section. Is fine to nest sections, just to ensure that it makes sense.
The aria label is not translated but should be a tr label so the user gets the information right
| (if token-numeric-inputs | ||
| ;; TODO: Rename this section when duplicated code is deleted | ||
| [:section {:class (stl/css :element-set-content-token) | ||
| :aria-label "layer-menu-section"} |
There was a problem hiding this comment.
The aria label is not translated but should be a tr label so the user gets the information right
| @use "ds/_borders.scss" as *; | ||
| @use "ds/typography.scss" as t; | ||
|
|
||
| // This code should be remove when numeric-input-tokens are activated |
There was a problem hiding this comment.
All this file must be removed?
| nil)}] | ||
| (if token-numeric-inputs | ||
| [:section {:class (dm/str class " " (stl/css :radius-token)) | ||
| :aria-label "border-radius-section"} |
There was a problem hiding this comment.
This aria-label must be translated to display the right information
|
|
||
| :value (:r3 values)}]])] | ||
| [:section {:class (dm/str class " " (stl/css :radius)) | ||
| :aria-label "border-radius-section"} |
There was a problem hiding this comment.
This aria-label must be translated to display the right information
| [:on-change {:optional true} fn?] | ||
| [:variant {:optional true} [:maybe [:enum "default" "ghost"]]]]) | ||
| [:dropdown-alignment {:optional true} [:maybe [:enum :left :right]]] | ||
| [:variant {:optional true} [:maybe [:enum "default" "ghost" "icon-only"]]]]) |
There was a problem hiding this comment.
Is this new variant in the design file?
There was a problem hiding this comment.
Guillermo was working on adding it to the DS file yes.
Related Ticket
This PR closes this task https://tree.taiga.io/project/penpot/task/13108
Summary
The small input fields have been updated.
Steps to reproduce
To test this PR you need to have this flag activated.
enable-feature-token-inputThe design is here -> https://hourly.penpot.dev/#/workspace?team-id=07b53c5e-b83c-8160-8007-94e9670cec80&file-id=07b53c5e-b83c-8160-8007-94e983058831&page-id=07b53c5e-b83c-8160-8007-94e983058832&layout=tokens&wasm=true&board-id=808fcf3d-bd30-8078-8007-99f97e53e7c6
Each commit is one input type.
This PR is under feature flag, no changes for QA are shown now.
Checklist
developby default.CHANGES.mdfile, referencing the related GitHub issue, if applicable.