![]() Split button color variantīy default the left split button uses the same variant as the toggle button. This prop accepts either a string or array of strings. You can also apply arbitrary classes to the toggle button via the toggle-class prop. Action Another action Something else here Action Another action Something else here Action Another action Something else here See the Variant Reference for a full list of built-in contextual variants. The dropdown toggle button can have one of the standard Bootstrap contextual variants applied by setting the prop variant to success, primary, info, danger, link, outline-dark, etc. Note: changing the size of the button(s) does not affect the size of the menu items! Dropdown color variants Action Another action Something else here. Action Another action Something else here Action Another action Something else here. Split button supportĬreate a split dropdown button, where the left button provides standard click event and link support, while the right hand side is the dropdown menu toggle button. Note: The props offset, boundary and no-flip may loose their effect when you overwrite the Popper.js configuration. Head to the Popper.js docs to see all the configuration options. If you need some advanced Popper.js configuration to make dropdowns behave to your needs, you can use the popper-opts prop to pass down a custom configuration object which will be deeply merged with the BootstrapVue defaults. In these cases you may need to wrap your dropdown inside another element. In some situations this may affect your layout or positioning of the dropdown trigger button. Note: When boundary is any value other than the default of 'scrollParent', the style position: static is applied to to the dropdown component's root element in order to allow the menu to "break-out" of its scroll container. The boundary value is passed directly to Popper.js's boundariesElement configuration option. Supported values are 'scrollParent' (the default), 'viewport', 'window' or a reference to an HTML element. To get around this, you can specify a boundary element via the boundary prop. ![]() However, if you place a dropdown inside an element that has overflow: scroll (or similar) set, the dropdown menu may - in some situations - get cut off. Action Another action Something else here Boundary constraintīy default, dropdowns are visually constrained to its scroll parent, which will suffice in most situations. 0.3rem, 4px, 1.2em, etc.) passed as a string. Specify the distance in CSS units (i.e.Specified as a number of pixels: positive for right shift, negative for left shift.Like to move your menu away from the toggle buttons a bit? Then use the offset prop to specify the number of pixels to push right (or left when negative) from the toggle button: To disable this auto-flip feature, set the no-flip prop. Action Another action Something else here Action Another action Something else here Auto "flipping"īy default, dropdowns may flip to the top, or to the bottom, based on their current position in the viewport.
0 Comments
Leave a Reply. |
Details
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |