新型CSSの形態調整
This commit is contained in:
parent
326cd60733
commit
0c10bcc339
@ -1421,57 +1421,70 @@ const setStrings = () =>{
|
||||
try {
|
||||
const elements = document.querySelectorAll('#disp > div > div > div[onclick]');
|
||||
const setNewTrainItemUI = ()=>{
|
||||
const elementBaseBase = document.querySelectorAll('[id^="stationBlock"]');
|
||||
elementBaseBase.forEach(e=>{ //それぞれの駅ブロック横一列
|
||||
const aaa = (x2,pos) => {
|
||||
x2.style.display = 'flex';
|
||||
x2.style.flexDirection = 'row';
|
||||
if(pos == "right"){
|
||||
x2.style.alignItems = 'flex-start';
|
||||
x2.style.justifyContent = 'flex-start';
|
||||
}else if(pos == "left"){
|
||||
x2.style.alignItems = 'flex-end';
|
||||
x2.style.justifyContent = 'flex-end';
|
||||
}
|
||||
x2.style.flexWrap = 'wrap';
|
||||
x2.style.width = '100%';
|
||||
x2.style.height = "100%";
|
||||
|
||||
}
|
||||
const aaa2 = (x2) => {
|
||||
x2.style.display = 'flex';
|
||||
x2.style.flexDirection = 'row';
|
||||
x2.style.alignItems = 'center';
|
||||
x2.style.justifyContent = 'center';
|
||||
x2.style.flexWrap = 'wrap';
|
||||
x2.style.width = '100%';
|
||||
x2.style.height = "unset";
|
||||
const x3 = x2.querySelectorAll(":scope > div");
|
||||
x3.forEach(i=>{
|
||||
i.style.position = "unset";
|
||||
i.style.display = "flex";
|
||||
i.style.flexDirection = "column";
|
||||
i.style.flex = "1";
|
||||
i.style.backgroundColor = "#00000000";
|
||||
i.querySelectorAll(":scope > *").forEach(j=>{
|
||||
j.style.width = "100%";
|
||||
j.style.textAlign = "center";
|
||||
j.style.margin = "5px";
|
||||
j.style.padding = "5px";
|
||||
});
|
||||
});
|
||||
}
|
||||
const layoutBase = (e)=>{
|
||||
e.style.display = 'flex';
|
||||
e.style.height = "unset";
|
||||
e.style.flexDirection = 'row';
|
||||
//e.style.alignItems = "left";
|
||||
e.style.justifyContent = 'center';
|
||||
const x = e.querySelectorAll(':scope > div');//配下のdiv要素を選択
|
||||
//x[0] 登りブロック x[2] 下りブロック x[1] 駅ブロック
|
||||
const aaa = (x2,pos) => {
|
||||
x2.style.display = 'flex';
|
||||
x2.style.flexDirection = 'row';
|
||||
if(pos == "right"){
|
||||
x2.style.alignItems = 'flex-start';
|
||||
x2.style.justifyContent = 'flex-start';
|
||||
}else if(pos == "left"){
|
||||
x2.style.alignItems = 'flex-end';
|
||||
x2.style.justifyContent = 'flex-end';
|
||||
}
|
||||
x2.style.flexWrap = 'wrap';
|
||||
x2.style.width = '100%';
|
||||
x2.style.height = "100%";
|
||||
|
||||
}
|
||||
const aaa2 = (x2) => {
|
||||
x2.style.display = 'flex';
|
||||
x2.style.flexDirection = 'row';
|
||||
x2.style.alignItems = 'center';
|
||||
x2.style.justifyContent = 'center';
|
||||
x2.style.flexWrap = 'wrap';
|
||||
x2.style.width = '100%';
|
||||
x2.style.height = "unset";
|
||||
const x3 = x2.querySelectorAll(":scope > div");
|
||||
x3.forEach(i=>{
|
||||
i.style.position = "unset";
|
||||
i.style.display = "flex";
|
||||
i.style.flexDirection = "column";
|
||||
i.style.flex = "1";
|
||||
i.style.backgroundColor = "#00000000";
|
||||
i.querySelectorAll(":scope > *").forEach(j=>{
|
||||
j.style.width = "100%";
|
||||
j.style.textAlign = "center";
|
||||
j.style.margin = "5px";
|
||||
j.style.padding = "5px";
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
const elementBaseBase = document.querySelectorAll('[id^="stationBlock"]');
|
||||
const elementNotBase = document.querySelectorAll('#disp > [id*="~"]');
|
||||
elementNotBase.forEach(e=>{
|
||||
layoutBase(e);
|
||||
const x = e.querySelectorAll(':scope > [id^="Up"], :scope > [id^="Id"], :scope > [id^="Down"]');//配下のdiv要素を選択
|
||||
aaa(x[0],"left");
|
||||
aaa2(x[1]);
|
||||
aaa(x[2],"right");
|
||||
const upTrainCrossBarElement = e.querySelector(':scope > [id="upTrainCrossBar"]');
|
||||
if (upTrainCrossBarElement) {
|
||||
upTrainCrossBarElement.style.left = '0px';
|
||||
}
|
||||
});
|
||||
elementBaseBase.forEach(e=>{ //それぞれの駅ブロック横一列
|
||||
layoutBase(e);
|
||||
const x = e.querySelectorAll(':scope > div');//配下のdiv要素を選択
|
||||
//x[0] 登りブロック x[2] 下りブロック x[1] 駅ブロック
|
||||
aaa(x[0],"left");
|
||||
aaa2(x[1]);
|
||||
aaa(x[2],"right");
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user