Framework7 5.6.0 Released!

New version arrived with new features and fixes:

  • Core
    • App
      • Added new app instance boolean property app.darkTheme. This property has effect only when autoDarkTheme enabled and indicates whether the dark theme active or not
      • Added new app instance event darkThemeChange. It has effect only when autoDarkTheme enabled and fires on device preferred color scheme change
    • Checkbox
      • Fixed styles in RTL mode
    • Device
      • Added nwjs property that is true when app running under NW.js environment
    • Router
      • New pageTabShow/page:tabshow and pageTabHide/page:tabhide page events. These events fires on page’s parent View-Tab show/hide
    • Segmented
      • Added animation for “strong” segmented active button
      • BREAKING CHANGE - now “strong” segmented requires new <span class="segmented-highlight"> element
  • React/Vue/Svelte
    • Input
      • Added support for inpumode input attribute
    • ListInput
      • Added support for inpumode input attribute
      • Fixed issue with errorMessage in Svelte
    • ListItem
      • Added tabLink and tabLinkActive props to make list item as a tab link
    • Page
      • New pageTabShow/page:tabshow and pageTabHide/page:tabhide page events. These events fire on page’s parent View-Tab show/hide
  • Minor fixes

Full Release Notes

https://framework7.io/release-notes/

12 Likes

really great! thanks
how to enable auto dark mode??

woooo, thanks man DarkTheme support!
that’s really cool

well done for the hardwork :+1:

1 Like

Set ‘autoDarkTheme: true’ in app statement:

var app = new Framework7({
  ...
  autoDarkTheme: true
  ...
});

Or call the following method after app initialization:

app.enableAutoDarkTheme();

2 Likes

Excellent. Thank you Vladimir to add animation to f7Segmented!

1 Like

Это при инициализации F7 прописать?

var app = new Framework7({
nwjs: true

Так?

Это свойство app.device.nwjs, доступно для чтения