42/42_INT_14_transcendence
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fixed back layout when succeded multiple back

Browse Source
This commit is contained in:
simplonco
2022-12-26 10:48:21 +01:00
parent cdf3d9207a
commit 010ecfe8c5
13 changed files with 958 additions and 396 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
srcs/requirements/svelte/api_front/public/build/bundle.css
View File

@@ -1,22 +1,26 @@
header.svelte-7t4byu.svelte-7t4byu{overflow-y:hidden}.grid-container.svelte-7t4byu.svelte-7t4byu{position:absolute;left:0;top:0;box-sizing:border-box;width:100%;height:100%;white-space:nowrap;margin-bottom:0px;overflow:hidden;padding:20px 40px;margin:0px;display:grid;grid-template-columns:repeat(12, 1fr);grid-template-rows:1fr 1fr 1fr 1fr 1fr;align-items:center}header.svelte-7t4byu h1.svelte-7t4byu{grid-column:1 / 7;grid-row:1;padding:20px;border:1px solid bisque}header.svelte-7t4byu nav.svelte-7t4byu{grid-column:7 / 13;grid-row:1;justify-self:end;padding:20px;border:1px solid bisque}header.svelte-7t4byu h2.svelte-7t4byu{grid-row:3;grid-column:5 / span 4;justify-self:center;border:1px solid black;z-index:3}header.svelte-7t4byu h2 div.svelte-7t4byu{font-size:2em}nav.svelte-7t4byu div.svelte-7t4byu{display:inline;color:bisque;font-weight:bold}nav.svelte-7t4byu>div.svelte-7t4byu{padding-left:1em}nav.svelte-7t4byu div.svelte-7t4byu:hover{text-decoration:underline;cursor:pointer}main.svelte-1cznfcz.svelte-1cznfcz{text-align:center;padding-top:40px;padding-bottom:40px}form.svelte-1cznfcz.svelte-1cznfcz{padding-top:15px}form.svelte-1cznfcz input.svelte-1cznfcz{max-width:330px}.error.svelte-1cznfcz.svelte-1cznfcz{font-weight:bold;font-size:0.8em;color:red}div.wrapper.svelte-1q8uute{display:flexbox;align-items:center}div.wrapper.svelte-1q8uute{display:flexbox;align-items:center}canvas.svelte-1bstsd0{width:100%;height:100%;background-color:#666}@font-face{font-family:'Bondi';src:url('/fonts/Bondi.ttf.woff') format('woff'),
main.svelte-1cznfcz.svelte-1cznfcz{text-align:center;padding-top:40px;padding-bottom:40px}form.svelte-1cznfcz.svelte-1cznfcz{padding-top:15px}form.svelte-1cznfcz input.svelte-1cznfcz{max-width:330px}.error.svelte-1cznfcz.svelte-1cznfcz{font-weight:bold;font-size:0.8em;color:red}div.wrapper.svelte-1q8uute{display:flexbox;align-items:center}div.wrapper.svelte-1q8uute{display:flexbox;align-items:center}header.svelte-7t4byu.svelte-7t4byu{overflow-y:hidden}.grid-container.svelte-7t4byu.svelte-7t4byu{position:absolute;left:0;top:0;box-sizing:border-box;width:100%;height:100%;white-space:nowrap;margin-bottom:0px;overflow:hidden;padding:20px 40px;margin:0px;display:grid;grid-template-columns:repeat(12, 1fr);grid-template-rows:1fr 1fr 1fr 1fr 1fr;align-items:center}header.svelte-7t4byu h1.svelte-7t4byu{grid-column:1 / 7;grid-row:1;padding:20px;border:1px solid bisque}header.svelte-7t4byu nav.svelte-7t4byu{grid-column:7 / 13;grid-row:1;justify-self:end;padding:20px;border:1px solid bisque}header.svelte-7t4byu h2.svelte-7t4byu{grid-row:3;grid-column:5 / span 4;justify-self:center;border:1px solid black;z-index:3}header.svelte-7t4byu h2 div.svelte-7t4byu{font-size:2em}nav.svelte-7t4byu div.svelte-7t4byu{display:inline;color:bisque;font-weight:bold}nav.svelte-7t4byu>div.svelte-7t4byu{padding-left:1em}nav.svelte-7t4byu div.svelte-7t4byu:hover{text-decoration:underline;cursor:pointer}@font-face{font-family:'Bondi';src:url('/fonts/Bondi.ttf.woff') format('woff'),
url('/fonts/Bondi.ttf.svg#Bondi') format('svg'),
url('/fonts/Bondi.ttf.eot'),
url('/fonts/Bondi.ttf.eot?#iefix') format('embedded-opentype');font-weight:normal;font-style:normal}header.svelte-1gjmpio.svelte-1gjmpio{background:#618174;margin:0}header.svelte-1gjmpio.svelte-1gjmpio{position:sticky;display:grid;grid-template-columns:1fr 1fr 1fr}h1.svelte-1gjmpio.svelte-1gjmpio{font-family:'Bondi'}h1.svelte-1gjmpio.svelte-1gjmpio{margin:0;text-align:left;display:flex;justify-self:center;align-self:center}img.svelte-1gjmpio.svelte-1gjmpio{cursor:pointer;max-width:40px;padding:7px 20px;justify-self:left}nav.svelte-1gjmpio.svelte-1gjmpio{display:flex;justify-content:right}nav.svelte-1gjmpio button.svelte-1gjmpio{margin:7px 20px;border-radius:4px}div.outer.svelte-16aefqu{max-width:960px;margin:40px auto}:root{--purple:rgb(123, 31, 162);--violet:rgb(103, 58, 183);--pink:rgb(244, 143, 177)}@keyframes svelte-16aefqu-background-pan{from{background-position:0% center}to{background-position:-200% center}}@keyframes svelte-16aefqu-scale{from,to{transform:scale(0)}50%{transform:scale(1)}}@keyframes svelte-16aefqu-rotate{from{transform:rotate(0deg)}to{transform:rotate(180deg)}}main.svelte-qtbld7{text-align:center}div.cards.svelte-qtbld7{display:grid;grid-template-columns:1fr 1fr;grid-gap:20px}img.svelte-qtbld7{width:60px}form.svelte-qtbld7{text-align:center}.form-field.svelte-qtbld7{padding:10px}.label.svelte-qtbld7{font-weight:bold}.inline-check.svelte-qtbld7{display:inline}.error.svelte-qtbld7{font-size:0.8em;font-weight:bold;color:red}.success.svelte-qtbld7{font-size:0.8em;font-weight:bold;color:green}div.top-grid.svelte-55f7si{display:grid;grid-template-columns:repeat(12, 1fr);height:85vh}div.all-users-sidebar.svelte-55f7si{grid-column:1 / span 2;background:white}div.a-user.svelte-55f7si{display:inline-block}div.status.svelte-55f7si{font-size:0.6em;font-weight:bold}div[class^="a-user"].svelte-55f7si:hover{text-decoration:underline;font-weight:bold;cursor:pointer}div.main-display.svelte-55f7si{grid-column:3 / span 10}.error.svelte-55f7si{font-size:0.8em;font-weight:bold;color:red}div.outer.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu{max-width:960px;margin:40px auto}main.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu{max-width:960px;margin:40px auto;text-align:center}.avatar.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu{max-width:150px}section.main-stats.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu{max-width:600px;margin:40px auto;text-align:center;display:grid;grid-template-columns:repeat(3, 1fr);grid-template-rows:repeat(3, 1fr)}section.main-stats.svelte-16aefqu h4.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu{grid-column:1 / span 3}div.username.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu{font-size:1.5em;font-weight:bold;padding-bottom:5px}div.rank.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu{font-size:1.2em;font-weight:bold}:root{--purple:rgb(123, 31, 162);--violet:rgb(103, 58, 183);--pink:rgb(244, 143, 177)}@keyframes svelte-16aefqu-background-pan{from{background-position:0% center}to{background-position:-200% center}}@keyframes svelte-16aefqu-scale{from,to{transform:scale(0)}50%{transform:scale(1)}}@keyframes svelte-16aefqu-rotate{from{transform:rotate(0deg)}to{transform:rotate(180deg)}}div.svelte-16aefqu>.glitter.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu{display:inline-block;position:relative}div.svelte-16aefqu>.glitter.svelte-16aefqu>.glitter-star.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu{--size:clamp(20px, 1.5vw, 30px);animation:svelte-16aefqu-scale 700ms ease forwards;display:block;height:var(--size);left:var(--star-left);position:absolute;top:var(--star-top);width:var(--size)}div.svelte-16aefqu>.glitter.svelte-16aefqu>.glitter-star.svelte-16aefqu>svg.svelte-16aefqu.svelte-16aefqu{animation:svelte-16aefqu-rotate 1000ms linear infinite;display:block;opacity:0.7}div.svelte-16aefqu>.glitter.svelte-16aefqu>.glitter-star.svelte-16aefqu>svg.svelte-16aefqu>path.svelte-16aefqu{fill:var(--violet)}div.svelte-16aefqu>.glitter.svelte-16aefqu>.glitter-text.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu{animation:svelte-16aefqu-background-pan 3s linear infinite;background:linear-gradient(
url('/fonts/Bondi.ttf.eot?#iefix') format('embedded-opentype');font-weight:normal;font-style:normal}header.svelte-1gjmpio.svelte-1gjmpio{background:#618174;margin:0}header.svelte-1gjmpio.svelte-1gjmpio{position:sticky;display:grid;grid-template-columns:1fr 1fr 1fr}h1.svelte-1gjmpio.svelte-1gjmpio{font-family:'Bondi'}h1.svelte-1gjmpio.svelte-1gjmpio{margin:0;text-align:left;display:flex;justify-self:center;align-self:center}img.svelte-1gjmpio.svelte-1gjmpio{cursor:pointer;max-width:40px;padding:7px 20px;justify-self:left}nav.svelte-1gjmpio.svelte-1gjmpio{display:flex;justify-content:right}nav.svelte-1gjmpio button.svelte-1gjmpio{margin:7px 20px;border-radius:4px}canvas.svelte-1bstsd0{width:100%;height:100%;background-color:#666}div.outer.svelte-16aefqu{max-width:960px;margin:40px auto}:root{--purple:rgb(123, 31, 162);--violet:rgb(103, 58, 183);--pink:rgb(244, 143, 177)}@keyframes svelte-16aefqu-background-pan{from{background-position:0% center}to{background-position:-200% center}}@keyframes svelte-16aefqu-scale{from,to{transform:scale(0)}50%{transform:scale(1)}}@keyframes svelte-16aefqu-rotate{from{transform:rotate(0deg)}to{transform:rotate(180deg)}}main.svelte-qtbld7{text-align:center}div.cards.svelte-qtbld7{display:grid;grid-template-columns:1fr 1fr;grid-gap:20px}img.svelte-qtbld7{width:60px}form.svelte-qtbld7{text-align:center}.form-field.svelte-qtbld7{padding:10px}.label.svelte-qtbld7{font-weight:bold}.inline-check.svelte-qtbld7{display:inline}.error.svelte-qtbld7{font-size:0.8em;font-weight:bold;color:red}.success.svelte-qtbld7{font-size:0.8em;font-weight:bold;color:green}div.top-grid.svelte-55f7si{display:grid;grid-template-columns:repeat(12, 1fr);height:85vh}div.all-users-sidebar.svelte-55f7si{grid-column:1 / span 2;background:white}div.a-user.svelte-55f7si{display:inline-block}div.status.svelte-55f7si{font-size:0.6em;font-weight:bold}div[class^="a-user"].svelte-55f7si:hover{text-decoration:underline;font-weight:bold;cursor:pointer}div.main-display.svelte-55f7si{grid-column:3 / span 10}.error.svelte-55f7si{font-size:0.8em;font-weight:bold;color:red}div.outer.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu{max-width:960px;margin:40px auto}main.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu{max-width:960px;margin:40px auto;text-align:center}.avatar.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu{max-width:150px}section.main-stats.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu{max-width:600px;margin:40px auto;text-align:center;display:grid;grid-template-columns:repeat(3, 1fr);grid-template-rows:repeat(3, 1fr)}section.main-stats.svelte-16aefqu h4.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu{grid-column:1 / span 3}div.username.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu{font-size:1.5em;font-weight:bold;padding-bottom:5px}div.rank.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu{font-size:1.2em;font-weight:bold}:root{--purple:rgb(123, 31, 162);--violet:rgb(103, 58, 183);--pink:rgb(244, 143, 177)}@keyframes svelte-16aefqu-background-pan{from{background-position:0% center}to{background-position:-200% center}}@keyframes svelte-16aefqu-scale{from,to{transform:scale(0)}50%{transform:scale(1)}}@keyframes svelte-16aefqu-rotate{from{transform:rotate(0deg)}to{transform:rotate(180deg)}}div.svelte-16aefqu>.glitter.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu{display:inline-block;position:relative}div.svelte-16aefqu>.glitter.svelte-16aefqu>.glitter-star.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu{--size:clamp(20px, 1.5vw, 30px);animation:svelte-16aefqu-scale 700ms ease forwards;display:block;height:var(--size);left:var(--star-left);position:absolute;top:var(--star-top);width:var(--size)}div.svelte-16aefqu>.glitter.svelte-16aefqu>.glitter-star.svelte-16aefqu>svg.svelte-16aefqu.svelte-16aefqu{animation:svelte-16aefqu-rotate 1000ms linear infinite;display:block;opacity:0.7}div.svelte-16aefqu>.glitter.svelte-16aefqu>.glitter-star.svelte-16aefqu>svg.svelte-16aefqu>path.svelte-16aefqu{fill:var(--violet)}div.svelte-16aefqu>.glitter.svelte-16aefqu>.glitter-text.svelte-16aefqu.svelte-16aefqu.svelte-16aefqu{animation:svelte-16aefqu-background-pan 3s linear infinite;background:linear-gradient(
to right,
var(--purple),
var(--violet),
var(--pink),
var(--purple)
);background-size:200%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;color:transparent;white-space:nowrap}.card.svelte-8smyff{background:white;padding:20px;border-radius:6px;box-shadow:0px 2px 4px rgba(0,0,0,0.1)}button.svelte-1u0z9cq{border:0;cursor:pointer;border-radius:6px;padding:8px 12px;font-weight:bold;box-shadow:1px 2px 3px rgba(0,0,0,0.2)}.primary.svelte-1u0z9cq{background:#d91b42;color:white}.secondary.svelte-1u0z9cq{background:#45c496;color:white}.flat.svelte-1u0z9cq{box-shadow:none}.primary.inverse.svelte-1u0z9cq{color:#d91b42;background:white;border:2px solid #d91b42}.secondary.inverse.svelte-1u0z9cq{color:#45c496;background:white;border:2px solid #45c496}#chat_box.svelte-1oi61jk.svelte-1oi61jk{display:flex;position:fixed;bottom:20px;right:20px;padding:5px;width:300px;height:400px;border:1px solid black}#chat_box.close.svelte-1oi61jk .grid_box.svelte-1oi61jk{gap:0px;grid:' chat ' auto
/ auto }#chat_box.close.svelte-1oi61jk.svelte-1oi61jk{padding:0px;width:auto;height:auto}#chat_box.svelte-1oi61jk *{-ms-overflow-style:none;scrollbar-width:none}#chat_box.svelte-1oi61jk *::-webkit-scrollbar{display:none}#chat_box.svelte-1oi61jk .grid_box{display:grid;margin:0px;gap:5px;width:100%;height:100%}#chat_box.svelte-1oi61jk .grid_box *{display:flex;flex-direction:column;position:relative;box-sizing:border-box}#chat_box.svelte-1oi61jk .grid_box p{padding:10px;font-size:15px}#chat_box.svelte-1oi61jk .__show_if_only_child{display:none}#chat_box.svelte-1oi61jk .__show_if_only_child:only-child{display:flex;color:rgb(100, 100, 100)}#chat_box.svelte-1oi61jk .__center{margin:auto}#chat_box.svelte-1oi61jk .__border_top{border-top:1px solid black}#chat_box.svelte-1oi61jk .__top > *{margin-top:10px;margin-bottom:10px}#chat_box.svelte-1oi61jk .__overflow_y_scroll{overflow-y:scroll}button.svelte-otw4o4.svelte-otw4o4{display:flex;padding:0px;margin:auto;width:100%;cursor:pointer;outline:none;border:none;background-color:rgb(220, 220, 220)}button.svelte-otw4o4 p.svelte-otw4o4{width:100%;margin:auto;text-align:center}button.svelte-otw4o4.svelte-otw4o4:hover{background-color:rgb(200, 200, 200)}button.svelte-otw4o4.svelte-otw4o4:active{background-color:rgb(190, 190, 190)}.list.svelte-otw4o4.svelte-otw4o4:not(:hover){background-color:rgb(240, 240, 240)}.list.svelte-otw4o4 p.svelte-otw4o4{text-align:left}.transparent.svelte-otw4o4.svelte-otw4o4:not(:hover){background-color:transparent}.deactivate.svelte-otw4o4.svelte-otw4o4{background-color:transparent;pointer-events:none}#chat_box .icon.svelte-otw4o4 p.svelte-otw4o4{display:none}.icon.svelte-otw4o4.svelte-otw4o4:not(:hover){background-color:transparent}.icon.svelte-otw4o4.svelte-otw4o4{width:30px;height:100%;padding:0px}.dots.svelte-otw4o4.svelte-otw4o4::after{content:'\2807';font-size:20px;position:absolute;top:50%;left:0px;width:100%;height:auto;text-align:center;transform:translateY(-50%);cursor:pointer}.close.svelte-otw4o4.svelte-otw4o4::before{content:"";position:absolute;top:calc(50% - 1px);left:5px;width:20px;height:2px;background-color:black}.back.svelte-otw4o4.svelte-otw4o4::before{content:"";position:absolute;top:calc(50% - 6px - 1px);left:6px;width:14px;height:14px;border-left:1px solid black;border-bottom:1px solid black;transform:rotate(45deg)}.blocked.svelte-otw4o4.svelte-otw4o4{padding-left:30px}.blocked.svelte-otw4o4.svelte-otw4o4::before{content:"";position:absolute;top:calc(50% - 2px);left:10px;cursor:pointer;width:13px;height:10px;border-radius:2px;background-color:rgb(110, 110, 110)}.blocked.svelte-otw4o4.svelte-otw4o4::after{content:"";position:absolute;top:calc(50% - 9px);left:12px;cursor:pointer;width:9px;height:13px;border-radius:5px;box-sizing:border-box;border:3px solid rgb(110, 110, 110)}.grid_box.svelte-1jygwt2 .settings {grid-area:settings}.grid_box.svelte-1jygwt2 .close {grid-area:close}.grid_box.svelte-1jygwt2 .new {grid-area:new}.grid_box.svelte-1jygwt2 .panel_home{grid-area:panel_home}.grid_box.svelte-1jygwt2.svelte-1jygwt2{grid:' settings new close ' auto
' panel_home panel_home panel_home ' 1fr
/ auto 1fr auto }.panel_home.svelte-1jygwt2 p.title.svelte-1jygwt2{margin:10px auto 0px auto}.grid_box.svelte-wnqq67 .back {grid-area:back}.grid_box.svelte-wnqq67 .room_name {grid-area:room_name}.grid_box.svelte-wnqq67 .close {grid-area:close}.grid_box.svelte-wnqq67 .panel_msg {grid-area:panel_msg}.grid_box.svelte-wnqq67 .send {grid-area:send}.grid_box.svelte-wnqq67 .panel_write{grid-area:panel_write}.grid_box.svelte-wnqq67.svelte-wnqq67{grid:' back room_name room_name close ' auto
);background-size:200%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;color:transparent;white-space:nowrap}button.svelte-1u0z9cq{border:0;cursor:pointer;border-radius:6px;padding:8px 12px;font-weight:bold;box-shadow:1px 2px 3px rgba(0,0,0,0.2)}.primary.svelte-1u0z9cq{background:#d91b42;color:white}.secondary.svelte-1u0z9cq{background:#45c496;color:white}.flat.svelte-1u0z9cq{box-shadow:none}.primary.inverse.svelte-1u0z9cq{color:#d91b42;background:white;border:2px solid #d91b42}.secondary.inverse.svelte-1u0z9cq{color:#45c496;background:white;border:2px solid #45c496}.card.svelte-8smyff{background:white;padding:20px;border-radius:6px;box-shadow:0px 2px 4px rgba(0,0,0,0.1)}#chat_box.svelte-rebvyq.svelte-rebvyq{display:flex;position:fixed;bottom:20px;right:20px;padding:5px;width:300px;height:400px;border:1px solid black}#chat_box.close.svelte-rebvyq .grid_box.svelte-rebvyq{gap:0px;grid:' chat ' auto
/ auto }#chat_box.close.svelte-rebvyq.svelte-rebvyq{padding:0px;width:auto;height:auto}#chat_box.svelte-rebvyq *{-ms-overflow-style:none;scrollbar-width:none}#chat_box.svelte-rebvyq *::-webkit-scrollbar{display:none}#chat_box.svelte-rebvyq .grid_box{display:grid;margin:0px;gap:5px;width:100%;height:100%}#chat_box.svelte-rebvyq .grid_box *{display:flex;flex-direction:column;position:relative;box-sizing:border-box}#chat_box.svelte-rebvyq .grid_box p{padding:10px;font-size:15px}#chat_box.svelte-rebvyq .panel{overflow-y:scroll}#chat_box.svelte-rebvyq .panel > *{margin-top:10px;margin-bottom:10px}#chat_box.svelte-rebvyq .__show_if_only_child{display:none}#chat_box.svelte-rebvyq .__show_if_only_child:only-child{display:flex;color:rgb(100, 100, 100)}#chat_box.svelte-rebvyq .__center{margin-left:auto;margin-right:auto}#chat_box.svelte-rebvyq .__border_top{border-top:1px solid black}.grid_box.svelte-i0rl3 .back {grid-area:back}.grid_box.svelte-i0rl3 .room_name {grid-area:room_name}.grid_box.svelte-i0rl3 .close {grid-area:close}.grid_box.svelte-i0rl3 .panel_msg {grid-area:panel_msg}.grid_box.svelte-i0rl3 .send {grid-area:send}.grid_box.svelte-i0rl3 .panel_write{grid-area:panel_write}.grid_box.svelte-i0rl3.svelte-i0rl3{grid:' back room_name room_name close ' auto
' panel_msg panel_msg panel_msg panel_msg ' 1fr
' panel_write panel_write send send ' auto
/ auto 1fr auto auto }#chat_box .panel_write.svelte-wnqq67.svelte-wnqq67{border:none;overflow:visible}#chat_box .text_area.svelte-wnqq67.svelte-wnqq67{display:block;position:absolute;bottom:0px;left:0px;width:100%;height:auto;min-height:100%;max-height:300px;overflow-x:hidden;overflow-y:scroll;background-color:white;border:1px solid black}#chat_box .text_area.svelte-wnqq67 *{display:block ruby}.panel_msg.svelte-wnqq67.svelte-wnqq67{flex-direction:column-reverse;overflow:scroll;border:1px solid black}.msg_thread.svelte-wnqq67.svelte-wnqq67{flex-direction:column;width:100%;padding:0px 5px;margin-bottom:0px}.chat_msg.svelte-wnqq67.svelte-wnqq67{white-space:pre-wrap;margin:5px auto;padding:5px;border-radius:5px}.msg_thread.svelte-wnqq67 .chat_msg.svelte-wnqq67{margin-left:0px;background-color:rgb(210, 210, 210);max-width:80%}#chat_box .chat_msg.svelte-wnqq67 p.svelte-wnqq67{padding:0px}#chat_box .chat_msg.svelte-wnqq67 p.name.svelte-wnqq67{margin:0px;font-size:12px;color:rgb(100, 100, 100)}.chat_msg.svelte-wnqq67 p.msg.svelte-wnqq67{margin:5px 0px}.chat_msg.me.svelte-wnqq67.svelte-wnqq67{margin-right:0px;margin-left:auto;background-color:rgb(210, 110, 10)}.chat_msg.me.svelte-wnqq67 p.name.svelte-wnqq67{display:none}.chat_msg.SERVER.svelte-wnqq67.svelte-wnqq67{margin-left:auto;background-color:transparent}#chat_box .chat_msg.SERVER.svelte-wnqq67 p.name.svelte-wnqq67{display:none}.chat_msg.SERVER.svelte-wnqq67 p.msg.svelte-wnqq67{margin:0px auto;font-size:12px;color:rgb(100, 100, 100)}.grid_box.svelte-4f5gf1 .back {grid-area:back}.grid_box.svelte-4f5gf1 .new {grid-area:new}.grid_box.svelte-4f5gf1 .close {grid-area:close}.grid_box.svelte-4f5gf1 .panel_new{grid-area:panel_new}.grid_box.svelte-4f5gf1{grid:' back new close ' auto
' panel_new panel_new panel_new ' 1fr
/ auto 1fr auto }.grid_box.svelte-1lfmc2m .back {grid-area:back}.grid_box.svelte-1lfmc2m .settings {grid-area:settings}.grid_box.svelte-1lfmc2m .close {grid-area:close}.grid_box.svelte-1lfmc2m .panel_settings{grid-area:panel_settings}.grid_box.svelte-1lfmc2m{grid:' back settings close ' auto
' panel_settings panel_settings panel_settings ' 1fr
/ auto 1fr auto }.grid_box.svelte-1sv7l8q .back {grid-area:back}.grid_box.svelte-1sv7l8q .room_name {grid-area:room_name}.grid_box.svelte-1sv7l8q .close {grid-area:close}.grid_box.svelte-1sv7l8q .panel_room_set{grid-area:panel_room_set}.grid_box.svelte-1sv7l8q{grid:' back room_name close ' auto
/ auto 1fr auto auto }#chat_box .panel_write.svelte-i0rl3.svelte-i0rl3{border:none;overflow:visible}#chat_box .text_area.svelte-i0rl3.svelte-i0rl3{display:block;position:absolute;bottom:0px;left:0px;width:100%;height:100%;overflow-x:hidden;overflow-y:scroll;background-color:white;border:1px solid black}#chat_box .text_area.svelte-i0rl3.svelte-i0rl3:focus{height:auto;min-height:100%;max-height:300px}#chat_box .text_area.svelte-i0rl3 *{display:block ruby}#chat_box .panel_msg.svelte-i0rl3.svelte-i0rl3{flex-direction:column-reverse;border:1px solid black}.msg_thread.svelte-i0rl3.svelte-i0rl3{width:100%;padding:0px 5px}.chat_msg.svelte-i0rl3.svelte-i0rl3{white-space:pre-wrap;margin:5px auto;padding:5px;border-radius:5px}.msg_thread.svelte-i0rl3 .chat_msg.svelte-i0rl3{margin-left:0px;background-color:rgb(210, 210, 210);max-width:80%}#chat_box .chat_msg.svelte-i0rl3 p.svelte-i0rl3{padding:0px}#chat_box .chat_msg.svelte-i0rl3 p.name.svelte-i0rl3{margin:0px;font-size:12px;color:rgb(100, 100, 100)}.chat_msg.svelte-i0rl3 p.msg.svelte-i0rl3{margin:5px 0px}.chat_msg.me.svelte-i0rl3.svelte-i0rl3{margin-right:0px;margin-left:auto;background-color:rgb(210, 110, 10)}.chat_msg.me.svelte-i0rl3 p.name.svelte-i0rl3{display:none}.chat_msg.SERVER.svelte-i0rl3.svelte-i0rl3{margin-left:auto;background-color:transparent}#chat_box .chat_msg.SERVER.svelte-i0rl3 p.name.svelte-i0rl3{display:none}.chat_msg.SERVER.svelte-i0rl3 p.msg.svelte-i0rl3{margin:0px auto;font-size:12px;color:rgb(100, 100, 100)}button.svelte-otw4o4.svelte-otw4o4{display:flex;padding:0px;margin:auto;width:100%;cursor:pointer;outline:none;border:none;background-color:rgb(220, 220, 220)}button.svelte-otw4o4 p.svelte-otw4o4{width:100%;margin:auto;text-align:center}button.svelte-otw4o4.svelte-otw4o4:hover{background-color:rgb(200, 200, 200)}button.svelte-otw4o4.svelte-otw4o4:active{background-color:rgb(190, 190, 190)}.list.svelte-otw4o4.svelte-otw4o4:not(:hover){background-color:rgb(240, 240, 240)}.list.svelte-otw4o4 p.svelte-otw4o4{text-align:left}.transparent.svelte-otw4o4.svelte-otw4o4:not(:hover){background-color:transparent}.deactivate.svelte-otw4o4.svelte-otw4o4{background-color:transparent;pointer-events:none}#chat_box .icon.svelte-otw4o4 p.svelte-otw4o4{display:none}.icon.svelte-otw4o4.svelte-otw4o4:not(:hover){background-color:transparent}.icon.svelte-otw4o4.svelte-otw4o4{width:30px;height:100%;padding:0px}.dots.svelte-otw4o4.svelte-otw4o4::after{content:'\2807';font-size:20px;position:absolute;top:50%;left:0px;width:100%;height:auto;text-align:center;transform:translateY(-50%);cursor:pointer}.close.svelte-otw4o4.svelte-otw4o4::before{content:"";position:absolute;top:calc(50% - 1px);left:5px;width:20px;height:2px;background-color:black}.back.svelte-otw4o4.svelte-otw4o4::before{content:"";position:absolute;top:calc(50% - 6px - 1px);left:6px;width:14px;height:14px;border-left:1px solid black;border-bottom:1px solid black;transform:rotate(45deg)}.blocked.svelte-otw4o4.svelte-otw4o4{padding-left:30px}.blocked.svelte-otw4o4.svelte-otw4o4::before{content:"";position:absolute;top:calc(50% - 2px);left:10px;cursor:pointer;width:13px;height:10px;border-radius:2px;background-color:rgb(110, 110, 110)}.blocked.svelte-otw4o4.svelte-otw4o4::after{content:"";position:absolute;top:calc(50% - 9px);left:12px;cursor:pointer;width:9px;height:13px;border-radius:5px;box-sizing:border-box;border:3px solid rgb(110, 110, 110)}.grid_box.svelte-1sv7l8q .back {grid-area:back}.grid_box.svelte-1sv7l8q .room_name {grid-area:room_name}.grid_box.svelte-1sv7l8q .close {grid-area:close}.grid_box.svelte-1sv7l8q .panel_room_set{grid-area:panel_room_set}.grid_box.svelte-1sv7l8q{grid:' back room_name close ' auto
' panel_room_set panel_room_set panel_room_set ' 1fr
/ auto 1fr auto }.grid_box.svelte-s19rid .back {grid-area:back}.grid_box.svelte-s19rid .room_name {grid-area:room_name}.grid_box.svelte-s19rid .close {grid-area:close}.grid_box.svelte-s19rid .panel_protected{grid-area:panel_protected}.title.svelte-s19rid{margin-top:30px}
/ auto 1fr auto }.grid_box.svelte-4f5gf1 .back {grid-area:back}.grid_box.svelte-4f5gf1 .new {grid-area:new}.grid_box.svelte-4f5gf1 .close {grid-area:close}.grid_box.svelte-4f5gf1 .panel_new{grid-area:panel_new}.grid_box.svelte-4f5gf1{grid:' back new close ' auto
' panel_new panel_new panel_new ' 1fr
/ auto 1fr auto }.grid_box.svelte-1jygwt2 .settings {grid-area:settings}.grid_box.svelte-1jygwt2 .close {grid-area:close}.grid_box.svelte-1jygwt2 .new {grid-area:new}.grid_box.svelte-1jygwt2 .panel_home{grid-area:panel_home}.grid_box.svelte-1jygwt2.svelte-1jygwt2{grid:' settings new close ' auto
' panel_home panel_home panel_home ' 1fr
/ auto 1fr auto }.panel_home.svelte-1jygwt2 p.title.svelte-1jygwt2{margin:10px auto 0px auto}.grid_box.svelte-1lfmc2m .back {grid-area:back}.grid_box.svelte-1lfmc2m .settings {grid-area:settings}.grid_box.svelte-1lfmc2m .close {grid-area:close}.grid_box.svelte-1lfmc2m .panel_settings{grid-area:panel_settings}.grid_box.svelte-1lfmc2m{grid:' back settings close ' auto
' panel_settings panel_settings panel_settings ' 1fr
/ auto 1fr auto }.grid_box.svelte-1ajbzu .back {grid-area:back}.grid_box.svelte-1ajbzu .room_name {grid-area:room_name}.grid_box.svelte-1ajbzu .close {grid-area:close}.grid_box.svelte-1ajbzu .panel_protected{grid-area:panel_protected}.grid_box.svelte-1ajbzu{grid:' back room_name close ' auto
' panel_protected panel_protected panel_protected ' 1fr
/ auto 1fr auto }.grid_box.svelte-1n3bch5 back {grid-area:back}.grid_box.svelte-1n3bch5 create {grid-area:create}.grid_box.svelte-1n3bch5 close {grid-area:close}.grid_box.svelte-1n3bch5 panel_create{grid-area:panel_create}.grid_box.svelte-1n3bch5{grid:' back create close ' auto
' panel_create panel_create panel_create ' 1fr
/ auto 1fr auto }

1103
srcs/requirements/svelte/api_front/public/build/bundle.js
View File

File diff suppressed because it is too large Load Diff

2
srcs/requirements/svelte/api_front/public/build/bundle.js.map
View File

File diff suppressed because one or more lines are too long

26
srcs/requirements/svelte/api_front/src/pieces/chat/Chat.html
View File

@@ -41,32 +41,6 @@
- WRITE
--------------------------------- -->
<!-- CREATE -->
<div class="chat_item chat_panel chat_panel_create" id="chat_panel_create">
<form>
<!-- name: -->
<label for="chat_name"><p>name :</p></label>
<input id="chat_name" required>
<!-- [ ] pubic -->
<input id="chat_public" type="radio" name="chat_create_type" checked>
<label for="chat_public" class="_radio"><p>public</p></label>
<!-- [ ] private -->
<input id="chat_private" type="radio" name="chat_create_type">
<label for="chat_private" class="_radio"><p>private</p></label>
<!-- [ ] protected -->
<input id="chat_protected" class="_check_change_next" type="radio" name="chat_create_type">
<label for="chat_protected" class="_radio"><p>protected</p></label>
<!-- [x] protected -->
<div class="__content _is_hidden">
<label for="chat_pswd"><p>choose a password :</p></label>
<input id="chat_pswd" type="password" placeholder="minimum 8 characters" minlength="8">
<p>confirm password :</p>
<input type="password">
</div>
<input type="submit" value="&#x2BA1">
</form>
</div>
<!-- USER -->
<div class="chat_item chat_panel chat_panel_user" id="chat_panel_user">
<p class="__center">user options :</p>

45
srcs/requirements/svelte/api_front/src/pieces/chat/Chat.svelte
View File

@@ -2,28 +2,33 @@
<script lang="ts">
import Button from './Chat_button.svelte';
import HomeLayout from './Layout_home.svelte';
import RoomLayout from './Layout_room.svelte';
import NewLayout from './Layout_new.svelte';
import SettingsLayout from './Layout_settings.svelte';
import RoomsetLayout from './Layout_room_set.svelte';
import ProtectedLayout from './Layout_protected.svelte';
import CreateLayout from './Layout_create.svelte';
export let color = "transparent";
let room = "";
let admin = false;
let layout = "close";
let layouts = ["home"];
let layouts = ["home", "home"];
// hold previous versions of layout, to go back
// hold previous version of layout, to go back
function set_layouts(layout)
{
if (layout === "close")
return;
if (layout === layouts[0])
return;
layouts = [layout, ...layouts];
if (layout === layouts[1])
layouts = [layout, "home"];
else
layouts = [layout, layouts[0]];
console.log(layouts);
}
$: set_layouts(layout);
@@ -35,7 +40,7 @@
layout new
layout settings
layout room_set
layout protected
layout protected
layout create
layout mute
layout user
@@ -63,6 +68,9 @@
{:else if layout === "protected"}
<ProtectedLayout bind:layout back={layouts[1]} />
{:else if layout === "create"}
<CreateLayout bind:layout back={layouts[1]} />
{:else}
<div class="grid_box">
<Button bind:layout new_layout={layouts[0]} my_class="chat">
@@ -173,6 +181,17 @@
}
/* all panel
*/
#chat_box :global(.panel) {
overflow-y: scroll;
}
#chat_box :global(.panel > *) {
margin-top: 10px;
margin-bottom: 10px;
}
/* * * * * * * * * * * * * * * * * * * * *
@@ -194,7 +213,8 @@
/* __center
*/
#chat_box :global(.__center) {
margin: auto;
margin-left: auto;
margin-right: auto;
}
@@ -205,20 +225,5 @@
}
/* __top
*/
#chat_box :global(.__top > *) {
margin-top: 10px;
margin-bottom: 10px;
}
/* __overflow_y_scroll
*/
#chat_box :global(.__overflow_y_scroll) {
overflow-y: scroll;
}
</style>

74
srcs/requirements/svelte/api_front/src/pieces/chat/Layout_create.svelte Normal file
View File

@@ -0,0 +1,74 @@
<script>
import Button from './Chat_button.svelte';
export let layout = "";
export let back = "";
</script>
<div class="grid_box">
<!-- back -->
<Button bind:layout new_layout={back} my_class="back icon" my_title="go back {back}">
back
</Button>
<!-- create -->
<Button my_class="create deactivate">
create
</Button>
<!-- close -->
<Button bind:layout new_layout="close" my_class="close icon">
close
</Button>
<!-- panel_create -->
<div class="panel panel_create">
<form>
<!-- name: -->
<label for="chat_name"><p>name :</p></label>
<input id="chat_name" required>
<!-- [ ] pubic -->
<input id="chat_public" type="radio" name="chat_create_type" checked>
<label for="chat_public" class="_radio"><p>public</p></label>
<!-- [ ] private -->
<input id="chat_private" type="radio" name="chat_create_type">
<label for="chat_private" class="_radio"><p>private</p></label>
<!-- [ ] protected -->
<input id="chat_protected" class="_check_change_next" type="radio" name="chat_create_type">
<label for="chat_protected" class="_radio"><p>protected</p></label>
<!-- [x] protected -->
<div class="__content _is_hidden">
<label for="chat_pswd"><p>choose a password :</p></label>
<input id="chat_pswd" type="password" placeholder="minimum 8 characters" minlength="8">
<p>confirm password :</p>
<input type="password">
</div>
<input type="submit" value="&#x2BA1">
</form>
</div>
</div>
<style>
/* grid layout "create"
*/
.grid_box :global(back ) {grid-area: back;}
.grid_box :global(create ) {grid-area: create;}
.grid_box :global(close ) {grid-area: close;}
.grid_box :global(panel_create) {grid-area: panel_create;}
.grid_box {
grid:
' back create close ' auto
' panel_create panel_create panel_create ' 1fr
/ auto 1fr auto ;
}
</style>

2
srcs/requirements/svelte/api_front/src/pieces/chat/Layout_home.svelte
View File

@@ -24,7 +24,7 @@
</Button>
<!-- panel home -->
<div class="panel_home __overflow_y_scroll __border_top __top">
<div class="panel panel_home __border_top">
<p class="title">list of your rooms :</p>
<div class="room_list">
<div class="__show_if_only_child">

2
srcs/requirements/svelte/api_front/src/pieces/chat/Layout_new.svelte
View File

@@ -25,7 +25,7 @@
</Button>
<!-- panel_new -->
<div class="panel_new __overflow_y_scroll __border_top __top">
<div class="panel panel_new __border_top">
<Button bind:layout new_layout="create" my_class="create">
create
</Button>

14
srcs/requirements/svelte/api_front/src/pieces/chat/Layout_protected.svelte
View File

@@ -15,7 +15,7 @@
</Button>
<!-- room_name -->
<Button my_class="deactivate">
<Button my_class="room_name deactivate">
&lt;room_name&gt;
</Button>
@@ -25,7 +25,7 @@
</Button>
<!-- panel_protected -->
<div class="panel_protected __overflow_y_scroll __border_top __top">
<div class="panel panel_protected __border_top">
<p class="title __center">this room is protected</p>
<form>
<label for="chat_pswd"><p>password :</p></label>
@@ -39,13 +39,13 @@
<style>
/* grid layout "room_set"
/* grid layout "protected"
*/
.grid_box :global(.back ) {grid-area: back;}
.grid_box :global(.room_name ) {grid-area: room_name;}
.grid_box :global(.close ) {grid-area: close;}
.grid_box :global(.panel_protected) {grid-area: panel_protected;}
#chat_box.protected {
.grid_box {
grid:
' back room_name close ' auto
' panel_protected panel_protected panel_protected ' 1fr
@@ -53,12 +53,6 @@
}
.title {
margin-top: 30px;
}
</style>

22
srcs/requirements/svelte/api_front/src/pieces/chat/Layout_room.svelte
View File

@@ -15,7 +15,7 @@
</Button>
<!-- room_name -->
<Button bind:layout new_layout="room_set" my_class="transparent">
<Button bind:layout new_layout="room_set" my_class="room_name transparent">
&lt;room_name&gt;
</Button>
@@ -25,7 +25,7 @@
</Button>
<!-- msg -->
<div class="chat_panel panel_msg">
<div class="panel panel_msg">
<div class="msg_thread">
<!-- placeholders
------------- -->
@@ -58,7 +58,7 @@
</div>
<!-- write -->
<div class="chat_panel panel_write">
<div class="panel_write">
<div class="text_area" id="chat_msg_write" contenteditable="true">
</div>
</div>
@@ -72,7 +72,7 @@
<style>
/* grid layout "home"
/* grid layout "room"
*/
.grid_box :global(.back ) {grid-area: back;}
.grid_box :global(.room_name ) {grid-area: room_name;}
@@ -101,15 +101,18 @@
bottom: 0px;
left: 0px;
width: 100%;
height: auto;
min-height: 100%;
max-height: 300px;
height: 100%;
overflow-x: hidden;
overflow-y: scroll;
background-color: white;
border: 1px solid black;
}
:global(#chat_box) .text_area:focus {
height: auto;
min-height: 100%;
max-height: 300px;
}
:global(#chat_box) .text_area :global(*) {
display: block ruby;
}
@@ -117,16 +120,13 @@
/* msg area
*/
.panel_msg {
:global(#chat_box) .panel_msg {
flex-direction: column-reverse;
overflow: scroll;
border: 1px solid black;
}
.msg_thread {
flex-direction: column;
width: 100%;
padding: 0px 5px;
margin-bottom: 0px;
}
.chat_msg {
white-space: pre-wrap;

4
srcs/requirements/svelte/api_front/src/pieces/chat/Layout_room_set.svelte
View File

@@ -15,7 +15,7 @@
</Button>
<!-- room_name -->
<Button my_class="deactivate">
<Button my_class="room_name deactivate">
&lt;room_name&gt;
</Button>
@@ -25,7 +25,7 @@
</Button>
<!-- panel_room_set -->
<div class="panel_room_set __overflow_y_scroll __border_top __top">
<div class="panel panel_room_set __border_top">
<Button bind:layout new_layout="create" my_class="create">
leave
</Button>

4
srcs/requirements/svelte/api_front/src/pieces/chat/Layout_settings.svelte
View File

@@ -15,7 +15,7 @@
</Button>
<!-- settings -->
<Button my_class="deactivate">
<Button my_class="room_name deactivate">
settings
</Button>
@@ -25,7 +25,7 @@
</Button>
<!-- panel_settings -->
<div class="panel_settings __overflow_y_scroll __border_top __top">
<div class="panel panel_settings __border_top">
<p>blocked users :</p>
<div class="blocked_users">
<div class="__show_if_only_child">

28
srcs/requirements/svelte/api_front/src/styles/chat/layout_create.css
View File

@@ -1,28 +0,0 @@
#chat_box.create {
grid:
' back create close ' auto
' panel_create panel_create panel_create ' 1fr
/ auto 1fr auto ;
}
#chat_box.create .chat_item#chat_back,
#chat_box.create .chat_item#chat_create,
#chat_box.create .chat_item#chat_close,
#chat_box.create .chat_item#chat_panel_create {
display: flex;
}
/* back btn
*/
#chat_box.create .chat_item.chat_back button.back_new {
display: flex;
}
/* title "create" appearance
*/
#chat_box.create .chat_item.chat_create {
text-align: center;
}