diff options
author | Yoshie Muranaka <yoshiemuranaka@gmail.com> | 2020-04-22 05:48:38 +0300 |
---|---|---|
committer | Derick Montague <derick.montague@ibm.com> | 2020-04-25 00:47:16 +0300 |
commit | 3111b6fa81cea34c6933491ace636f4fdd1dade3 (patch) | |
tree | c41a307216b94eb0540cd9b147d01209bf0440e6 /src/assets/styles/_bootstrap-grid.scss | |
parent | 077e4a8093e4e1a30b8483d5bfa9b08cbaf6368d (diff) | |
download | webui-vue-3111b6fa81cea34c6933491ace636f4fdd1dade3.tar.xz |
Update layout fluid prop to set max-width
Setting page container fluid prop to 'xl' to allow fluid/100%
container width until reaching the xl breakpoint. After
reaching the xl breakpoint, a max-width is set to the
container.
This will make sure that the page content doesn't stretch
into an unreasonable layout on wide viewports.
https://bootstrap-vue.org/docs/components/layout#fluid-width-container
Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: Ic50dd3b4339d532663279350afdcc30e59bb0c74
Diffstat (limited to 'src/assets/styles/_bootstrap-grid.scss')
-rw-r--r-- | src/assets/styles/_bootstrap-grid.scss | 8 |
1 files changed, 8 insertions, 0 deletions
diff --git a/src/assets/styles/_bootstrap-grid.scss b/src/assets/styles/_bootstrap-grid.scss new file mode 100644 index 00000000..7ad7c81b --- /dev/null +++ b/src/assets/styles/_bootstrap-grid.scss @@ -0,0 +1,8 @@ +.container-xl { + // Fluid layout container class sets 100% + // width until xl breakpoint. Once a max-width + // is set, setting the left margin to 0 is needed + // so the content doesn't center align + // https://bootstrap-vue.org/docs/components/layout#fluid-width-container + margin-left: 0; +}
\ No newline at end of file |