Zoom scale
Hello, I wondered if you could tell me a nice way to reduce the scale or zoom of the entire application in a nice way? If I set the browser view zoom to 80% this gives the desired look I am wanting but I want to know the best way to do this within the code? Many thanks Lewis
Replies (3)
Hi,
May I know which template and version are you using ? You can reduce the root font size in px and the layout and components use REM(relative to the root font size) for padding, font size, and margin attributes. Default root font size is 13px so you can try to change it 11px or 12px by overriding the defaults for Metronic v8.1 demo1 in src/sass/layout/_variables.custom.scss
$app-general-root-font-size-desktop: 11px !default;
$app-general-root-font-size-tablet: 11px !default;
$app-general-root-font-size-mobile: 11px !default;Or for other versions of Metronic or other templates in
src/sass/layout/_variables.scss:// Root font Sizes
$root-font-size: 11px; // Root font size for desktop mode
$root-font-size-lg: 11px; // Root font size for tablet mode
$root-font-size-md: 11px; // Root font size for mobile modeThen recompile the theme assets with gulp or webpack.
For more info about using Metronic please check the Theme Documentation
and Video Tutorials
Regards.
Regards.
Hi there many thanks for your response, I have tried the method you suggested and it seems to take no effect? I am using the Laravel version 8.0.37.
Are you able to provide some more specific instruction? Many thanks for your help
Hi,
Have u recompiled the assets after changing the source via sass ? If you do so it should have worked as expexted. Can u check your style.css that your laravel app loads. Does it use the changed font-size: 11px for the root html/body elements ?
Regards.
