From 8b907d5a86218927f888dca1f0ee9bf46ad22d68 Mon Sep 17 00:00:00 2001 From: kalips003 Date: Fri, 27 Mar 2026 20:17:21 +0100 Subject: [PATCH] transfer --- Transcendence/srcs/frontend/src/favicon.ico | Bin 0 -> 1151 bytes Transcendence/srcs/frontend/src/index.html | 50 +++------ Transcendence/srcs/frontend/src/index.js | 19 ++++ Transcendence/srcs/frontend/src/index2.html | 32 ++++++ Transcendence/srcs/frontend/src/notes.js | 115 ++++++++++++++++++++ Transcendence/srcs/frontend/src/style.css | 5 + 6 files changed, 189 insertions(+), 32 deletions(-) create mode 100644 Transcendence/srcs/frontend/src/favicon.ico create mode 100644 Transcendence/srcs/frontend/src/index.js create mode 100644 Transcendence/srcs/frontend/src/index2.html create mode 100644 Transcendence/srcs/frontend/src/notes.js create mode 100644 Transcendence/srcs/frontend/src/style.css diff --git a/Transcendence/srcs/frontend/src/favicon.ico b/Transcendence/srcs/frontend/src/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..0c3679e74fd5c80fdbe4be6116f5a62b1f1555d8 GIT binary patch literal 1151 zcmV-_1c3XAP)Px#1ZP1_K>z@;j|==^1poj532;bRa{vGi!vFvd!vV){sAK>D1Qba`K~#8N?U~C@ z6Hye#XWIHmT$&g`0wuUWR!X3S7zA{qF(xh%BQF<7qQtmRbM|7tP4Q)sIopTIK(h!DeC7JsrlV5K;oi_LT?m4#|-7pNz$#O9r zD>VU3$4X5A)3H($z;vwC1TY;dH33Y=N=*RMu}awll$837#KFTgE5|3m_WuKld_}n6 zz>V`5SDxtrC#R-#JYdOrp^4Cv=hH2f0J{<(j>e;Lj33pMf^~gkU}$O@PA5x9%=A5` zr|JAuOLYOJZSs1(IJAU+i##kWEHn~FA|aBJ#gg~s=H}v%^ZDhJN!5Ur)&TQbm$fR- zXJ=(6pfw!$1G;#M``_n-b=mwpr=w-?3)uK60^ZA7NY8@8b8}#-Yk^9D)dcib`!SX( zALq-oH*E#?9V7?;CEz(ZTb|bd)^-klX-O(!K{HcW{y zcNg>C!LEd;1XxW#>#i*ryLr3UGD-b>;N}Hzc(xam>wACE8sBlM6VzR9aHgvn)C_X? z*uzm!y2=n=&%^Dc>~sJ$|GKm)m4MZD0onP@arHJkCfcz3FzEAB*BBe4{e#Ej0bev7 z0?VsvK^MRO*zG6aa<#!~O;8E2ngEeFA;0g<&PQJLgZU?Kfj)l;C<*v*_Y5dCAo7m7 zN6(K9U^udLUm%~?q0#wNNi^+jlo(oJ5>x_Kn*fnGBRj*q!b(urX^#6J_kiZl^A=Ed zXdU`W+(W-5+`LZ^Nq6XA%f2`L0HbQG( zb(h>YU|oCj9gOn%=A>DbN`T!7@Rye0g4KU$ZlzlHt(yngK&|^oF&G%3B(#)KGV1!q z!GE`oxE9#uxLGOzDXRgTgjkIB0cHoKMg$CcUB1O7oiY;)rp9rzR02|!fMoLXzTrxY zYJ${=i)nUVq!N(s1c;W~L8eP80skujYekMvfSLfNW2Gj5=~$@=U^-Nq_7@H0))p+$ Ri%S3i002ovPDHLkV1m2A8Up|T literal 0 HcmV?d00001 diff --git a/Transcendence/srcs/frontend/src/index.html b/Transcendence/srcs/frontend/src/index.html index 32f450c..a03a85d 100644 --- a/Transcendence/srcs/frontend/src/index.html +++ b/Transcendence/srcs/frontend/src/index.html @@ -1,32 +1,18 @@ - - - - - - Transcendence.io - - - - - - -

Transcendence.io

- - - - - - - - + + + + + + + + +
+ play +
title
+ login +
+ + +
+ + \ No newline at end of file diff --git a/Transcendence/srcs/frontend/src/index.js b/Transcendence/srcs/frontend/src/index.js new file mode 100644 index 0000000..1e75931 --- /dev/null +++ b/Transcendence/srcs/frontend/src/index.js @@ -0,0 +1,19 @@ + +let a = document.createElement('div'); +document.body.append(a); + +a.textContent = "abc"; +a.style.color = "red"; +a.style.border = "2px solid black"; +a.style.margin = "10px 20px 30px 40px"; +a.style.backgroundColor = "green"; + + +for (let i = 0; i <= 10; i++) { + + let b = document.createElement('span'); + a.append(b); + + b.style.color = "blue"; + b.textContent = "hallow-" + i; +} \ No newline at end of file diff --git a/Transcendence/srcs/frontend/src/index2.html b/Transcendence/srcs/frontend/src/index2.html new file mode 100644 index 0000000..32f450c --- /dev/null +++ b/Transcendence/srcs/frontend/src/index2.html @@ -0,0 +1,32 @@ + + + + + + Transcendence.io + + + + + + +

Transcendence.io

+ + + + + + + + diff --git a/Transcendence/srcs/frontend/src/notes.js b/Transcendence/srcs/frontend/src/notes.js new file mode 100644 index 0000000..8a9a6f8 --- /dev/null +++ b/Transcendence/srcs/frontend/src/notes.js @@ -0,0 +1,115 @@ +// SIZE +box.style.width = "200px"; +box.style.height = "100px"; +box.style.minWidth = "100px"; +box.style.maxWidth = "500px"; + +// POSITION +box.style.position = "absolute"; +box.style.top = "50px"; +box.style.left = "100px"; +box.style.right = "20px"; +box.style.bottom = "10px"; +box.style.zIndex = "10"; + +// SPACING +box.style.margin = "10px"; +box.style.padding = "20px"; +box.style.marginTop = "10px"; +box.style.paddingLeft = "5px"; + +// BACKGROUND & COLORS +box.style.background = "red"; +box.style.backgroundColor = "blue"; +box.style.color = "white"; + +// BORDER +box.style.border = "2px solid black"; +box.style.borderRadius = "10px"; + +// TEXT +box.style.fontSize = "20px"; +box.style.fontWeight = "bold"; +box.style.textAlign = "center"; + +// DISPLAY & VISIBILITY +box.style.display = "block"; +box.style.visibility = "visible"; +box.style.opacity = "0.5"; + +// TRANSFORM +box.style.transform = "translateX(100px)"; +box.style.transform = "translate(50px, 20px)"; +box.style.transform = "scale(1.5)"; +box.style.transform = "rotate(45deg)"; +box.style.transform = "translateX(100px) scale(2)"; + +// ANIMATION & TRANSITION +box.style.transition = "all 0.3s ease"; +box.style.animation = "move 2s linear"; + +// INTERACTION +box.style.cursor = "pointer"; +box.style.pointerEvents = "none"; +// /////////////////////////////////////////////////////> +// /////////////////////////////////////////////////////> +// CONTENT +el.textContent = "Hello"; // plain text +el.innerHTML = "Hello"; // HTML content +el.innerText = "Hello"; // like textContent but respects line breaks + +// ATTRIBUTES +el.id = "myDiv"; // element ID +el.className = "box highlight"; // full class string +el.classList.add("active"); // add a class +el.classList.remove("hidden"); // remove a class +el.classList.toggle("open"); // toggle a class +el.title = "Tooltip text"; // title attribute +el.value = "42"; // input value +el.src = "image.png"; // img, video, audio src +el.href = "https://example.com"; // anchor href +el.alt = "alternative text"; // img alt + +// DOM STRUCTURE +el.appendChild(child); // add child +el.append(child1, child2); // add multiple children +el.prepend(child); // add at start +el.remove(); // remove self +el.replaceWith(newEl); // replace element +el.cloneNode(true); // copy element (deep if true) + +// DATA & CUSTOM +el.dataset.id = "123"; // data-id attribute +el.dataset.name = "box1"; // data-name attribute + +// EVENTS +el.onclick = () => {}; // direct event assignment +el.onmouseover = () => {}; +el.addEventListener("click", () => {}); // preferred +el.removeEventListener("click", handler); + +// VISIBILITY & FOCUS +el.hidden = true; // hides element +el.focus(); // focus element +el.blur(); // remove focus +el.tabIndex = 0; // make element focusable + +// DIMENSIONS & POSITION (read-only or get) +el.clientWidth; +el.clientHeight; +el.offsetWidth; +el.offsetHeight; +el.offsetTop; +el.offsetLeft; +el.scrollWidth; +el.scrollHeight; +el.scrollTop; +el.scrollLeft; + +// OTHER +el.checked = true; // checkbox / radio +el.selected = true; // option element +el.disabled = true; // input/button +el.readOnly = true; // input/textarea +el.name = "username"; // input / form element +el.type = "text"; // input type \ No newline at end of file diff --git a/Transcendence/srcs/frontend/src/style.css b/Transcendence/srcs/frontend/src/style.css new file mode 100644 index 0000000..dd82617 --- /dev/null +++ b/Transcendence/srcs/frontend/src/style.css @@ -0,0 +1,5 @@ +.inherit { + border: 5px solid black; + + +} \ No newline at end of file