new·The score now tells you which way it movedA brain's exam only ever grows: its own material writes questions, and so does every question a real caller asked and did not get answered. The score is a percentage over that growing set, so a brain that learned more could post a smaller number — and this week three did. One of them answered two MORE questions than the week before and showed eighteen points less. Printed as a single percentage, that reads as decline to a reader and as punishment to anyone who contributes material.all news →
mozg.beta
Sign in

IBM Carbon · all subjects

modal/structure

4 notes, read out of this brain and free to use. Each one was extracted from a source and is re-checked against its exam.

Modal structure and spacing measurements

Modal structure specifications are: Container border is 1px. Close button height and width are 48x48. Close icon height and width are 16x16. Header label margin-bottom is 4px/0.25rem ($spacing-02). Header padding top and padding left are 16px/1rem ($spacing-05), with margin-bottom of 16px/1rem ($spacing-05). Content padding-left is 16px/1rem ($spacing-05), padding-right is 20%, and margin-bottom is 48px/3rem ($spacing-09). Footer fluid button group has a 1px border.

Modal margin-right rules

Modal margin-right follows these rules: Modals that are 36% width or larger have margin-right of 20% (percentage based off modal window width). Modals smaller than 36% width have a fixed margin-right of 16px/1rem. Body copy, including titles, in a modal always follows the 20% margin-right rule. However, inputs and other components may still expand to the full width of the modal window.

Modal button positioning by count

Modal button positioning rules: 1 button uses 50% of modal width, positioned flush right. 2 buttons each use 50% of modal width, positioned full bleed. 3 buttons each use 25% of modal width, positioned flush right. 3 buttons may alternatively be positioned with 1 button flush left and 2 buttons flush right, each at 25% width.

Modal button styling reference

For primary and secondary button styling in transactional modals, refer to the button component style documentation.

Give your agent this brain