feat: unify project responsive layouts
This commit is contained in:
@@ -237,6 +237,7 @@ const savePoems = () => {
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@use "../../styles/adaptive-frame-profiles.scss" as adaptive;
|
||||
.poem-page {
|
||||
display: flex;
|
||||
min-height: 100vh;
|
||||
@@ -247,14 +248,13 @@ const savePoems = () => {
|
||||
z-index: 3;
|
||||
}
|
||||
.poem-panel {
|
||||
@include adaptive.adaptive-genealogy-state-panel;
|
||||
z-index: 2;
|
||||
width: calc(100% - 32rpx);
|
||||
min-height: min(650px, calc((100vw - 16px) * 1.5));
|
||||
margin: 18rpx auto 0;
|
||||
padding: 76rpx 8%;
|
||||
box-sizing: border-box;
|
||||
background: url("/static/assets/modules/genealogy/transparent/g01-empty-panel-frame.png")
|
||||
center / 100% 100% no-repeat;
|
||||
}
|
||||
.poem-panel > .app-loading {
|
||||
grid-area: 1 / 1 / -1 / -1;
|
||||
@@ -289,13 +289,12 @@ const savePoems = () => {
|
||||
margin-top: 18rpx;
|
||||
}
|
||||
.poem-row {
|
||||
@include adaptive.adaptive-genealogy-form-field;
|
||||
display: grid;
|
||||
min-height: 72rpx;
|
||||
margin-top: 10rpx;
|
||||
grid-template-columns: 48% auto 1fr auto;
|
||||
align-items: center;
|
||||
background: url("/static/assets/modules/genealogy/transparent/g-form-field-frame.png")
|
||||
center / 100% 100% no-repeat;
|
||||
}
|
||||
.poem-row__number {
|
||||
z-index: 1;
|
||||
@@ -347,11 +346,10 @@ const savePoems = () => {
|
||||
letter-spacing: 2rpx;
|
||||
}
|
||||
.poem-field {
|
||||
@include adaptive.adaptive-genealogy-form-field;
|
||||
display: grid;
|
||||
min-height: 118rpx;
|
||||
margin-top: 22rpx;
|
||||
background: url("/static/assets/modules/genealogy/transparent/g-form-field-frame.png")
|
||||
center / 100% 100% no-repeat;
|
||||
}
|
||||
.poem-field > text {
|
||||
z-index: 1;
|
||||
|
||||
Reference in New Issue
Block a user