You can use this page to identify the retired Bootstrap layout path in MDriven Turnkey and move your ViewModel layouts to CSS Grid.
Status
Bootstrap is deprecated and is no longer available as the MDriven layout renderer. Do not create new layouts that depend on Bootstrap behavior.
MDriven Turnkey renders layouts with CSS Grid. CSS Grid uses placement information from the ViewModel, so MDriven can place content based on the model rather than on assumptions about the surrounding HTML environment.
Use CSS Grid for layout
CSS Grid is the replacement for Bootstrap layout rendering.
You can control CSS Grid rendering at two levels:
| Scope | Setting | Result |
|---|---|---|
| One ViewModel | Add the tagged value CSSGrid=true to the ViewModel.
|
That ViewModel renders as CSS Grid. |
| Turnkey default | Set <UseCSSGridByDefault>True</UseCSSGridByDefault> in the TurnkeySettings file.
|
Turnkey renders with CSS Grid unless a ViewModel explicitly sets CSSGrid=false.
|
For example, when a ViewModel contains controls that must retain a defined placement, use CSS Grid. MDriven reads the CSS Grid values from the ViewModel and manages the placement of the rendered content. This also means that a generic component does not need to know the HTML surroundings in which it is rendered.
What to change in an existing solution
If an older solution contains Bootstrap-specific layout settings, review the ViewModels and CSS before updating the application.
- Open the affected ViewModel in MDriven Designer.
- Remove assumptions that the generated layout will be Bootstrap-based.
- Use CSS Grid placement for the ViewModel layout.
- Check whether the solution has a TurnkeySettings default for
UseCSSGridByDefault. - Test pages that contain reusable or generic components. Their placement is managed from the CSS Grid values in the ViewModel.
- Review custom CSS and theme files for selectors or classes that depend on Bootstrap-generated markup.
Do not use the retired Bootstrap-related settings Column.FixColSize or Span.FixColSize for new work. Span.CSSGrid is also deprecated and defaults to true.
Styling is separate from layout
CSS Grid replaces the layout renderer; it does not prevent you from styling a Turnkey application with CSS. Continue to use the styling mechanisms appropriate to the rendered controls and your own CSS.
For example, a ViewModel control can use Style ref to add a class to the rendered control. Define that class in your CSS rather than relying on Bootstrap layout classes. For data-driven styling, a ViewModel string attribute named Style renders an HTML style attribute, while CssClass adds a CSS class. A table cell can use an attribute such as Status_CssClass to apply a class based on the row's status.
Read Styling and CSS for Bootstrap, Angular and MVC for the supported styling conventions, including control, image, row, column, and cell styling. See UI & Styling for the wider UI customization documentation.
Legacy Bootstrap themes and views
A legacy Bootstrap theme may contain colors, fonts, and CSS that you want to retain, but it must not be treated as a Bootstrap layout dependency. Review the theme's CSS, assets, and external resources when adapting it to a current Turnkey application.
For legacy theme material, see Apply Bootstrap Theme to MDriven Turnkey. If your solution overrides Turnkey AngularJS views, also verify those overrides against the current rendered structure; see Overriding AngularJS MDriven Turnkey Views.
