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

chat background color is declared with component

Browse Source
This commit is contained in:
simplonco
2022-12-24 20:55:20 +01:00
parent 2b0939ec05
commit 05d5f2a3ec
5 changed files with 97 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -7,7 +7,7 @@ header.svelte-7t4byu.svelte-7t4byu{overflow-y:hidden}.grid-container.svelte-7t4b
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-z8twj9.svelte-z8twj9{display:flex;position:fixed;bottom:20px;right:20px;padding:5px;width:300px;height:400px;border:1px solid black;background-color:bisque}#chat_box.close.svelte-z8twj9 .grid_box.svelte-z8twj9{gap:0px;grid:' chat ' auto
/ auto }#chat_box.close.svelte-z8twj9.svelte-z8twj9{padding:0px;width:auto;height:auto}#chat_box .grid_box{display:grid;margin:0px;gap:5px;width:100%;height:100%}#chat_box .grid_box *{display:flex;flex-direction:column;position:relative;box-sizing:border-box;padding:0px;margin:auto}#chat_box .grid_box .chat_item{width:100%;height:100%}#chat_box .chat_item#chat_chat {grid-area:chat}#chat_box .chat_item#chat_close {grid-area:close}#chat_box .chat_item#chat_new {grid-area:new}#chat_box .chat_item#chat_settings {grid-area:settings}#chat_box .chat_item#chat_room_name {grid-area:room_name}#chat_box .chat_item#chat_send {grid-area:send}#chat_box .chat_item#chat_create {grid-area:create}#chat_box .chat_item#chat_user {grid-area:user}#chat_box .chat_item#chat_back {grid-area:back}#chat_box .chat_item#chat_panel_home {grid-area:panel_home}#chat_box .chat_item#chat_panel_new {grid-area:panel_new}#chat_box .chat_item#chat_panel_msg {grid-area:panel_msg}#chat_box .chat_item#chat_panel_write {grid-area:panel_write}#chat_box .chat_item#chat_panel_settings {grid-area:panel_settings}#chat_box .chat_item#chat_panel_room_set {grid-area:panel_room_set}#chat_box .chat_item#chat_panel_protected {grid-area:panel_protected}#chat_box .chat_item#chat_panel_create {grid-area:panel_create}#chat_box .chat_item#chat_panel_user {grid-area:panel_user}#chat_box .chat_item#chat_panel_mute {grid-area:panel_mute}#chat_box .grid_box p{padding:10px;font-size:15px}.grid_box.svelte-1tjf2m9{grid:' settings new close ' auto
);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-u17qy1.svelte-u17qy1{display:flex;position:fixed;bottom:20px;right:20px;padding:5px;width:300px;height:400px;border:1px solid black}#chat_box.close.svelte-u17qy1 .grid_box.svelte-u17qy1{gap:0px;grid:' chat ' auto
/ auto }#chat_box.close.svelte-u17qy1.svelte-u17qy1{padding:0px;width:auto;height:auto}#chat_box .grid_box{display:grid;margin:0px;gap:5px;width:100%;height:100%}#chat_box .grid_box *{display:flex;flex-direction:column;position:relative;box-sizing:border-box;padding:0px;margin:auto}#chat_box .grid_box .chat_item{width:100%;height:100%}#chat_box .chat_item#chat_chat {grid-area:chat}#chat_box .chat_item#chat_close {grid-area:close}#chat_box .chat_item#chat_new {grid-area:new}#chat_box .chat_item#chat_settings {grid-area:settings}#chat_box .chat_item#chat_room_name {grid-area:room_name}#chat_box .chat_item#chat_send {grid-area:send}#chat_box .chat_item#chat_create {grid-area:create}#chat_box .chat_item#chat_user {grid-area:user}#chat_box .chat_item#chat_back {grid-area:back}#chat_box .chat_item#chat_panel_home {grid-area:panel_home}#chat_box .chat_item#chat_panel_new {grid-area:panel_new}#chat_box .chat_item#chat_panel_msg {grid-area:panel_msg}#chat_box .chat_item#chat_panel_write {grid-area:panel_write}#chat_box .chat_item#chat_panel_settings {grid-area:panel_settings}#chat_box .chat_item#chat_panel_room_set {grid-area:panel_room_set}#chat_box .chat_item#chat_panel_protected {grid-area:panel_protected}#chat_box .chat_item#chat_panel_create {grid-area:panel_create}#chat_box .chat_item#chat_panel_user {grid-area:panel_user}#chat_box .chat_item#chat_panel_mute {grid-area:panel_mute}#chat_box .grid_box p{padding:10px;font-size:15px}.grid_box.svelte-1tjf2m9{grid:' settings new close ' auto
' panel_home panel_home panel_home ' 1fr
/ auto 1fr auto }button.svelte-nupzli.svelte-nupzli{display:flex;width:auto;cursor:pointer;outline:none;border:none;background-color:rgb(220, 220, 220)}button.svelte-nupzli p.svelte-nupzli{width:100%;text-align:center}button.svelte-nupzli.svelte-nupzli:hover{background-color:rgb(200, 200, 200)}button.svelte-nupzli.svelte-nupzli:active{background-color:rgb(190, 190, 190)}

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

@@ -166,6 +166,14 @@ var app = (function () {
function set_input_value(input, value) {
input.value = value == null ? '' : value;
}
function set_style(node, key, value, important) {
if (value === null) {
node.style.removeProperty(key);
}
else {
node.style.setProperty(key, value, important ? 'important' : '');
}
}
function toggle_class(element, name, toggle) {
element.classList[toggle ? 'add' : 'remove'](name);
}
@@ -3366,7 +3374,7 @@ var app = (function () {
let current;
function button_layout_binding(value) {
/*button_layout_binding*/ ctx[2](value);
/*button_layout_binding*/ ctx[3](value);
}
let button_props = {
@@ -3377,8 +3385,8 @@ var app = (function () {
$$scope: { ctx }
};
if (/*layout*/ ctx[0] !== void 0) {
button_props.layout = /*layout*/ ctx[0];
if (/*layout*/ ctx[1] !== void 0) {
button_props.layout = /*layout*/ ctx[1];
}
button = new Buttons({ props: button_props, $$inline: true });
@@ -3388,8 +3396,8 @@ var app = (function () {
c: function create() {
div = element("div");
create_component(button.$$.fragment);
attr_dev(div, "class", "grid_box svelte-z8twj9");
add_location(div, file$c, 33, 2, 646);
attr_dev(div, "class", "grid_box svelte-u17qy1");
add_location(div, file$c, 33, 2, 676);
},
m: function mount(target, anchor) {
insert_dev(target, div, anchor);
@@ -3399,13 +3407,13 @@ var app = (function () {
p: function update(ctx, dirty) {
const button_changes = {};
if (dirty & /*$$scope*/ 64) {
if (dirty & /*$$scope*/ 128) {
button_changes.$$scope = { dirty, ctx };
}
if (!updating_layout && dirty & /*layout*/ 1) {
if (!updating_layout && dirty & /*layout*/ 2) {
updating_layout = true;
button_changes.layout = /*layout*/ ctx[0];
button_changes.layout = /*layout*/ ctx[1];
add_flush_callback(() => updating_layout = false);
}
@@ -3444,13 +3452,13 @@ var app = (function () {
let current;
function homelayout_layout_binding(value) {
/*homelayout_layout_binding*/ ctx[1](value);
/*homelayout_layout_binding*/ ctx[2](value);
}
let homelayout_props = {};
if (/*layout*/ ctx[0] !== void 0) {
homelayout_props.layout = /*layout*/ ctx[0];
if (/*layout*/ ctx[1] !== void 0) {
homelayout_props.layout = /*layout*/ ctx[1];
}
homelayout = new Layout_home({ props: homelayout_props, $$inline: true });
@@ -3467,9 +3475,9 @@ var app = (function () {
p: function update(ctx, dirty) {
const homelayout_changes = {};
if (!updating_layout && dirty & /*layout*/ 1) {
if (!updating_layout && dirty & /*layout*/ 2) {
updating_layout = true;
homelayout_changes.layout = /*layout*/ ctx[0];
homelayout_changes.layout = /*layout*/ ctx[1];
add_flush_callback(() => updating_layout = false);
}
@@ -3537,7 +3545,7 @@ var app = (function () {
const if_blocks = [];
function select_block_type(ctx, dirty) {
if (/*layout*/ ctx[0] === "home") return 0;
if (/*layout*/ ctx[1] === "home") return 0;
return 1;
}
@@ -3548,9 +3556,10 @@ var app = (function () {
c: function create() {
div = element("div");
if_block.c();
attr_dev(div, "class", div_class_value = "" + (null_to_empty(/*layout*/ ctx[0]) + " svelte-z8twj9"));
attr_dev(div, "class", div_class_value = "" + (null_to_empty(/*layout*/ ctx[1]) + " svelte-u17qy1"));
attr_dev(div, "id", "chat_box");
add_location(div, file$c, 27, 0, 535);
set_style(div, "background-color", /*color*/ ctx[0]);
add_location(div, file$c, 27, 0, 530);
},
l: function claim(nodes) {
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
@@ -3587,9 +3596,13 @@ var app = (function () {
if_block.m(div, null);
}
if (!current || dirty & /*layout*/ 1 && div_class_value !== (div_class_value = "" + (null_to_empty(/*layout*/ ctx[0]) + " svelte-z8twj9"))) {
if (!current || dirty & /*layout*/ 2 && div_class_value !== (div_class_value = "" + (null_to_empty(/*layout*/ ctx[1]) + " svelte-u17qy1"))) {
attr_dev(div, "class", div_class_value);
}
if (!current || dirty & /*color*/ 1) {
set_style(div, "background-color", /*color*/ ctx[0]);
}
},
i: function intro(local) {
if (current) return;
@@ -3620,11 +3633,12 @@ var app = (function () {
function instance$d($$self, $$props, $$invalidate) {
let { $$slots: slots = {}, $$scope } = $$props;
validate_slots('Chat', slots, []);
let { color = "transparent" } = $$props;
let room = "";
let admin = false;
let last_layout = "";
let layout = "close";
const writable_props = [];
const writable_props = ['color'];
Object.keys($$props).forEach(key => {
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console.warn(`<Chat> was created with unknown prop '${key}'`);
@@ -3632,17 +3646,22 @@ var app = (function () {
function homelayout_layout_binding(value) {
layout = value;
$$invalidate(0, layout);
$$invalidate(1, layout);
}
function button_layout_binding(value) {
layout = value;
$$invalidate(0, layout);
$$invalidate(1, layout);
}
$$self.$$set = $$props => {
if ('color' in $$props) $$invalidate(0, color = $$props.color);
};
$$self.$capture_state = () => ({
HomeLayout: Layout_home,
Button: Buttons,
color,
room,
admin,
last_layout,
@@ -3650,23 +3669,24 @@ var app = (function () {
});
$$self.$inject_state = $$props => {
if ('color' in $$props) $$invalidate(0, color = $$props.color);
if ('room' in $$props) room = $$props.room;
if ('admin' in $$props) admin = $$props.admin;
if ('last_layout' in $$props) last_layout = $$props.last_layout;
if ('layout' in $$props) $$invalidate(0, layout = $$props.layout);
if ('layout' in $$props) $$invalidate(1, layout = $$props.layout);
};
if ($$props && "$$inject" in $$props) {
$$self.$inject_state($$props.$$inject);
}
return [layout, homelayout_layout_binding, button_layout_binding];
return [color, layout, homelayout_layout_binding, button_layout_binding];
}
class Chat extends SvelteComponentDev {
constructor(options) {
super(options);
init(this, options, instance$d, create_fragment$d, safe_not_equal, {});
init(this, options, instance$d, create_fragment$d, safe_not_equal, { color: 0 });
dispatch_dev("SvelteRegisterComponent", {
component: this,
@@ -3675,6 +3695,14 @@ var app = (function () {
id: create_fragment$d.name
});
}
get color() {
throw new Error("<Chat>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
}
set color(value) {
throw new Error("<Chat>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
}
}
/* src/pages/profile/ProfileDisplay.svelte generated by Svelte v3.53.1 */
@@ -3693,8 +3721,8 @@ var app = (function () {
t1 = space();
div = element("div");
div.textContent = "Failed to load current";
add_location(h2, file$b, 20, 4, 691);
add_location(div, file$b, 21, 4, 710);
add_location(h2, file$b, 20, 4, 705);
add_location(div, file$b, 21, 4, 724);
},
m: function mount(target, anchor) {
insert_dev(target, h2, anchor);
@@ -3837,7 +3865,12 @@ var app = (function () {
let t59;
let div30;
let current;
chat = new Chat({ $$inline: true });
chat = new Chat({
props: { color: "bisque" },
$$inline: true
});
const if_block_creators = [create_if_block$5, create_else_block$3];
const if_blocks = [];
@@ -3946,37 +3979,37 @@ var app = (function () {
div30 = element("div");
div30.textContent = "testing when there's tons of stuff";
attr_dev(div0, "class", "outer svelte-16aefqu");
add_location(div0, file$b, 14, 0, 408);
add_location(div1, file$b, 25, 0, 760);
add_location(div2, file$b, 26, 0, 806);
add_location(div3, file$b, 27, 0, 852);
add_location(div4, file$b, 28, 0, 898);
add_location(div5, file$b, 29, 0, 944);
add_location(div6, file$b, 30, 0, 990);
add_location(div7, file$b, 31, 0, 1036);
add_location(div8, file$b, 32, 0, 1082);
add_location(div9, file$b, 33, 0, 1128);
add_location(div10, file$b, 34, 0, 1174);
add_location(div11, file$b, 35, 0, 1220);
add_location(div12, file$b, 36, 0, 1266);
add_location(div13, file$b, 37, 0, 1312);
add_location(div14, file$b, 38, 0, 1358);
add_location(div15, file$b, 39, 0, 1404);
add_location(div16, file$b, 40, 0, 1450);
add_location(div17, file$b, 41, 0, 1496);
add_location(div18, file$b, 42, 0, 1542);
add_location(div19, file$b, 43, 0, 1588);
add_location(div20, file$b, 44, 0, 1634);
add_location(div21, file$b, 45, 0, 1680);
add_location(div22, file$b, 46, 0, 1726);
add_location(div23, file$b, 47, 0, 1772);
add_location(div24, file$b, 48, 0, 1818);
add_location(div25, file$b, 49, 0, 1864);
add_location(div26, file$b, 50, 0, 1910);
add_location(div27, file$b, 51, 0, 1956);
add_location(div28, file$b, 52, 0, 2002);
add_location(div29, file$b, 53, 0, 2048);
add_location(div30, file$b, 54, 0, 2094);
add_location(div0, file$b, 14, 0, 422);
add_location(div1, file$b, 25, 0, 774);
add_location(div2, file$b, 26, 0, 820);
add_location(div3, file$b, 27, 0, 866);
add_location(div4, file$b, 28, 0, 912);
add_location(div5, file$b, 29, 0, 958);
add_location(div6, file$b, 30, 0, 1004);
add_location(div7, file$b, 31, 0, 1050);
add_location(div8, file$b, 32, 0, 1096);
add_location(div9, file$b, 33, 0, 1142);
add_location(div10, file$b, 34, 0, 1188);
add_location(div11, file$b, 35, 0, 1234);
add_location(div12, file$b, 36, 0, 1280);
add_location(div13, file$b, 37, 0, 1326);
add_location(div14, file$b, 38, 0, 1372);
add_location(div15, file$b, 39, 0, 1418);
add_location(div16, file$b, 40, 0, 1464);
add_location(div17, file$b, 41, 0, 1510);
add_location(div18, file$b, 42, 0, 1556);
add_location(div19, file$b, 43, 0, 1602);
add_location(div20, file$b, 44, 0, 1648);
add_location(div21, file$b, 45, 0, 1694);
add_location(div22, file$b, 46, 0, 1740);
add_location(div23, file$b, 47, 0, 1786);
add_location(div24, file$b, 48, 0, 1832);
add_location(div25, file$b, 49, 0, 1878);
add_location(div26, file$b, 50, 0, 1924);
add_location(div27, file$b, 51, 0, 1970);
add_location(div28, file$b, 52, 0, 2016);
add_location(div29, file$b, 53, 0, 2062);
add_location(div30, file$b, 54, 0, 2108);
},
l: function claim(nodes) {
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");

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

File diff suppressed because one or more lines are too long