Granted we (Kalaam) may doing things with SAB that no one else is by exporting the HTML and then making builds for PC and PWA’s but, for us, choosing to put the play bar at the top of a screen would be a great option. Our specific need for this is when we’ve built a PC version and the window for the app goes below the screen. A user may not even realize there is audio for their app. It would be great if there could be a box choosing to put the play bar at the top instead of the bottom.
If you adjust the CSS in css/stylesheet.css, for #toolbar-bottom
from:
bottom: 0px;
to
top: 40px;
then it jumps to the top. Endless tweaking can still be done.
I calculated the 40px by adding the following:
- .navigation-top
- padding-top: 16px;
- padding-bottom: 10px;
-
#book-selector
- padding: 2px; two times for top and bottom
- body
- font-size: 17px;
But 47px seemed too much so I reduced it to 40px
Also adjust the body margin-top: 120px; up from 16px
I get the above.
@ChrisHubbard not that I am aware of. Some things are very HTML output specific rather than relevant to both the app and HTML. If it related to both then we could store it in SAB .appdef file but there are no styles like that. I think the CSS is partly generated from the Styles section but also from the SAB code.
Certainly there could be a setting that gives a different CSS if that setting is selected. It complicates the layout to have the audio bar at the top. So either you need two CSS version if some books don’t have an audio bar or a Javascript script with logic that could detect the presence of the audio bar and adjust the CSS dynamically to suit.