新しいデザインを暫定的に作成

This commit is contained in:
harukin-expo-dev-env 2025-06-11 09:58:06 +00:00
parent 0ce2b70669
commit 45b41dcef0

View File

@ -1248,17 +1248,90 @@ export const injectJavascriptData: InjectJavascriptData = (
const returnText2 = (ToData ? ToData+"行 " : ToData)+ TrainNumber;
.innerText = "";
.insertAdjacentHTML('beforebegin', "<p style='font-size:10px;font-weight:bold;padding:0;color: black;'>" + returnText1 + "</p>");
.insertAdjacentHTML('beforebegin', "<div style='display:inline-flex;flex-direction:row;'><p style='font-size:10px;font-weight: bold;padding:0;color:black;'>" + (ToData ? ToData + "行 " : ToData) + "</p><p style='font-size:10px;padding:0;color:black;'>" + TrainNumber + (JRF ? "":"レ") + "</p></div>");
.insertAdjacentHTML('beforebegin', "<div style='display:inline-flex;flex-direction:column;'><p style='font-size:10px;font-weight: bold;padding:0;color:black;'>" + (ToData ? ToData + "行 " : ToData) + "</p><p style='font-size:10px;padding:0;color:black;'>" + TrainNumber + (JRF ? "":"レ") + "</p></div>");
.insertAdjacentHTML('beforebegin', "<p style='font-size:10px;font-weight:bold;padding:0;color: "+(hasProblem ? "red":"black")+";'>" + (hasProblem ? "‼️停止中‼️" : "") + "</p>");
}
`;
const textInsert =
`
const setNewTrainItem = (element)=>{
element.style.borderColor = 'white';
element.style.borderWidth = '2px';
element.style.borderStyle = 'solid';
element.style.borderRadius = '10%';
element.style.backgroundColor = 'rgba(255, 255, 255, 0.8)';
element.style.boxShadow = '0 0 4px rgba(0, 0, 0, 0.2)';
element.style.margin = '2px';
element.style.display = 'flex';
element.style.flexDirection = 'column';
element.style.alignItems = 'center';
element.style.justifyContent = 'center';
element.style.width = '52px';
element.style.height = '80px';
element.getElementsByTagName("p")[0].style.textAlign = "center";
element.getElementsByTagName("p")[0].style.fontSize = '8px';
element.getElementsByTagName("img")[0].style.float = 'unset';
}
//列番付与
const setStrings = () =>{
try {
const elements = document.querySelectorAll('#disp > div > div > div[onclick]');
const elementBaseBase = document.querySelectorAll('[id^="stationBlock"]');
elementBaseBase.forEach(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";
});
});
}
aaa(x[0],"left");
aaa2(x[1]);
aaa(x[2],"right");
});
for (let element of elements) {
if(element.getAttribute('offclick')){ continue; }
element.setAttribute('offclick',element.getAttribute('onclick'))
@ -1289,6 +1362,7 @@ const setStrings = () =>{
}
` : ""}
nameReplace(,,,hasProblem);
setNewTrainItem(element);
}
try{
for(let d of document.getElementById('disp').childNodes){