Fix the full-height problem for all pages (#22905)
Really fix #22883, close #22901 I made a mistake that the global styles in RepoActionView.vue could still pollute global styles (I forgot that the code of this component is still loaded on every page, instead of loaded on demand) This PR makes a complete fix: only change the page's full-height behavior if the component is used. Screenshot after the fix: <details> ![image](https://user-images.githubusercontent.com/2114189/218664776-0dbcd469-2c36-4e17-972f-e44fa3b81ba6.png) </details> Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
This commit is contained in:
parent
d306ab2b8f
commit
e314c9e866
|
@ -268,6 +268,11 @@ export function initRepositoryActionView() {
|
||||||
const el = document.getElementById('repo-action-view');
|
const el = document.getElementById('repo-action-view');
|
||||||
if (!el) return;
|
if (!el) return;
|
||||||
|
|
||||||
|
// TODO: the parent element's full height doesn't work well now,
|
||||||
|
// but we can not pollute the global style at the moment, only fix the height problem for pages with this component
|
||||||
|
const parentFullHeight = document.querySelector('body > div.full.height');
|
||||||
|
if (parentFullHeight) parentFullHeight.style.paddingBottom = '0';
|
||||||
|
|
||||||
const view = createApp(sfc, {
|
const view = createApp(sfc, {
|
||||||
runIndex: el.getAttribute('data-run-index'),
|
runIndex: el.getAttribute('data-run-index'),
|
||||||
jobIndex: el.getAttribute('data-job-index'),
|
jobIndex: el.getAttribute('data-job-index'),
|
||||||
|
@ -412,11 +417,6 @@ export function initRepositoryActionView() {
|
||||||
<style lang="less">
|
<style lang="less">
|
||||||
// some elements are not managed by vue, so we need to use global style
|
// some elements are not managed by vue, so we need to use global style
|
||||||
|
|
||||||
// TODO: the parent element's full height doesn't work well now
|
|
||||||
body > div.full.height {
|
|
||||||
padding-bottom: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.job-status-rotate {
|
.job-status-rotate {
|
||||||
animation: job-status-rotate-keyframes 1s linear infinite;
|
animation: job-status-rotate-keyframes 1s linear infinite;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue