panel home ok
This commit is contained in:
@@ -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-zg8hgq.svelte-zg8hgq{display:flex;position:fixed;bottom:20px;right:20px;padding:5px;width:300px;height:400px;border:1px solid black}#chat_box.close.svelte-zg8hgq .grid_box.svelte-zg8hgq{gap:0px;grid:' chat ' auto
|
||||
/ auto }#chat_box.close.svelte-zg8hgq.svelte-zg8hgq{padding:0px;width:auto;height:auto}#chat_box.svelte-zg8hgq .grid_box{display:grid;margin:0px;gap:5px;width:100%;height:100%}#chat_box.svelte-zg8hgq .grid_box *{display:flex;flex-direction:column;position:relative;box-sizing:border-box}#chat_box.svelte-zg8hgq .chat_panel{overflow-y:scroll}#chat_box.svelte-zg8hgq .grid_box p{padding:10px;font-size:15px}.grid_box.svelte-x798v3 .chat_item#chat_settings {grid-area:settings}.grid_box.svelte-x798v3 .chat_item#chat_close {grid-area:close}.grid_box.svelte-x798v3 .chat_item#chat_new {grid-area:new}.grid_box.svelte-x798v3 .chat_item#chat_panel_home{grid-area:panel_home}.grid_box.svelte-x798v3{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-1aq8ao.svelte-1aq8ao{display:flex;position:fixed;bottom:20px;right:20px;padding:5px;width:300px;height:400px;border:1px solid black}#chat_box.close.svelte-1aq8ao .grid_box.svelte-1aq8ao{gap:0px;grid:' chat ' auto
|
||||
/ auto }#chat_box.close.svelte-1aq8ao.svelte-1aq8ao{padding:0px;width:auto;height:auto}#chat_box.svelte-1aq8ao .grid_box{display:grid;margin:0px;gap:5px;width:100%;height:100%}#chat_box.svelte-1aq8ao .grid_box *{display:flex;flex-direction:column;position:relative;box-sizing:border-box}#chat_box.svelte-1aq8ao .chat_panel{overflow-y:scroll}#chat_box.svelte-1aq8ao .grid_box p{padding:10px;font-size:15px}#chat_box.svelte-1aq8ao .__show_if_only_child{display:none}#chat_box.svelte-1aq8ao .__show_if_only_child:only-child{display:flex;color:rgb(100, 100, 100)}.grid_box.svelte-1vu2j1b #settings {grid-area:settings}.grid_box.svelte-1vu2j1b #close {grid-area:close}.grid_box.svelte-1vu2j1b #new {grid-area:new}.grid_box.svelte-1vu2j1b #panel_home{grid-area:panel_home}.grid_box.svelte-1vu2j1b.svelte-1vu2j1b{grid:' settings new close ' auto
|
||||
' panel_home panel_home panel_home ' 1fr
|
||||
/ auto 1fr auto }.grid_box.svelte-x798v3 button#chat_new:not(:hover){background-color:transparent}.grid_box.svelte-x798v3 button#chat_settings p{display:none}#chat_box .grid_box.svelte-x798v3 button#chat_settings{width:30px;height:100%}.grid_box.svelte-x798v3 button#chat_settings:not(:hover){background-color:transparent}.grid_box.svelte-x798v3 button#chat_settings::after{content:'\2807';font-size:20px;position:absolute;top:50%;left:0px;width:100%;height:auto;text-align:center;transform:translateY(-50%);cursor:pointer}button.svelte-1ucfb12.svelte-1ucfb12{display:flex;padding:0px;margin:auto;width:100%;cursor:pointer;outline:none;border:none;background-color:rgb(220, 220, 220)}button.svelte-1ucfb12 p.svelte-1ucfb12{width:100%;margin:auto;text-align:center}button.svelte-1ucfb12.svelte-1ucfb12:hover{background-color:rgb(200, 200, 200)}button.svelte-1ucfb12.svelte-1ucfb12:active{background-color:rgb(190, 190, 190)}button.list.svelte-1ucfb12.svelte-1ucfb12:not(:hover){background-color:rgb(240, 240, 240)}
|
||||
/ auto 1fr auto }.grid_box.svelte-1vu2j1b button#settings p{display:none}.grid_box.svelte-1vu2j1b button#settings{width:30px;height:100%}.grid_box.svelte-1vu2j1b button#settings:not(:hover){background-color:transparent}.grid_box.svelte-1vu2j1b button#settings::after{content:'\2807';font-size:20px;position:absolute;top:50%;left:0px;width:100%;height:auto;text-align:center;transform:translateY(-50%);cursor:pointer}.grid_box.svelte-1vu2j1b button#new:not(:hover){background-color:transparent}.grid_box.svelte-1vu2j1b button#close p{display:none}.grid_box.svelte-1vu2j1b button#close{width:30px;height:100%;padding:0px;background-color:transparent}.grid_box.svelte-1vu2j1b button#close::before{content:"";position:absolute;top:calc(50% - 1px);left:5px;width:20px;height:2px;background-color:black}#panel_home.svelte-1vu2j1b.svelte-1vu2j1b{border-top:1px solid black}#panel_home.svelte-1vu2j1b p.title.svelte-1vu2j1b{margin:10px auto 0px auto}#panel_home.svelte-1vu2j1b p.no_chat.svelte-1vu2j1b{margin:0px auto}button.svelte-ib15h9.svelte-ib15h9{display:flex;padding:0px;margin:auto;width:100%;cursor:pointer;outline:none;border:none;background-color:rgb(220, 220, 220)}button.svelte-ib15h9 p.svelte-ib15h9{width:100%;margin:auto;text-align:center}button.svelte-ib15h9.svelte-ib15h9:hover{background-color:rgb(200, 200, 200)}button.svelte-ib15h9.svelte-ib15h9:active{background-color:rgb(190, 190, 190)}button.list.svelte-ib15h9.svelte-ib15h9:not(:hover){background-color:rgb(240, 240, 240)}button.list.svelte-ib15h9 p.svelte-ib15h9{text-align:left}
|
||||
@@ -2786,9 +2786,9 @@ var app = (function () {
|
||||
button = element("button");
|
||||
p = element("p");
|
||||
if (default_slot) default_slot.c();
|
||||
attr_dev(p, "class", "svelte-1ucfb12");
|
||||
attr_dev(p, "class", "svelte-ib15h9");
|
||||
add_location(p, file$e, 18, 1, 367);
|
||||
attr_dev(button, "class", button_class_value = "" + (null_to_empty(/*my_class*/ ctx[1]) + " svelte-1ucfb12"));
|
||||
attr_dev(button, "class", button_class_value = "" + (null_to_empty(/*my_class*/ ctx[1]) + " svelte-ib15h9"));
|
||||
attr_dev(button, "id", /*my_id*/ ctx[0]);
|
||||
add_location(button, file$e, 17, 0, 304);
|
||||
},
|
||||
@@ -2826,7 +2826,7 @@ var app = (function () {
|
||||
}
|
||||
}
|
||||
|
||||
if (!current || dirty & /*my_class*/ 2 && button_class_value !== (button_class_value = "" + (null_to_empty(/*my_class*/ ctx[1]) + " svelte-1ucfb12"))) {
|
||||
if (!current || dirty & /*my_class*/ 2 && button_class_value !== (button_class_value = "" + (null_to_empty(/*my_class*/ ctx[1]) + " svelte-ib15h9"))) {
|
||||
attr_dev(button, "class", button_class_value);
|
||||
}
|
||||
|
||||
@@ -2966,8 +2966,8 @@ var app = (function () {
|
||||
/* src/pieces/chat/Layout_home.svelte generated by Svelte v3.53.1 */
|
||||
const file$d = "src/pieces/chat/Layout_home.svelte";
|
||||
|
||||
// (9:1) <Button bind:layout new_layout="settings" my_class="chat_item" my_id="chat_settings">
|
||||
function create_default_slot_5(ctx) {
|
||||
// (9:1) <Button bind:layout new_layout="settings" my_id="settings">
|
||||
function create_default_slot_2$1(ctx) {
|
||||
let t;
|
||||
|
||||
const block = {
|
||||
@@ -2984,17 +2984,17 @@ var app = (function () {
|
||||
|
||||
dispatch_dev("SvelteRegisterBlock", {
|
||||
block,
|
||||
id: create_default_slot_5.name,
|
||||
id: create_default_slot_2$1.name,
|
||||
type: "slot",
|
||||
source: "(9:1) <Button bind:layout new_layout=\\\"settings\\\" my_class=\\\"chat_item\\\" my_id=\\\"chat_settings\\\">",
|
||||
source: "(9:1) <Button bind:layout new_layout=\\\"settings\\\" my_id=\\\"settings\\\">",
|
||||
ctx
|
||||
});
|
||||
|
||||
return block;
|
||||
}
|
||||
|
||||
// (12:1) <Button bind:layout new_layout="new" my_class="chat_item" my_id="chat_new">
|
||||
function create_default_slot_4(ctx) {
|
||||
// (12:1) <Button bind:layout new_layout="new" my_id="new">
|
||||
function create_default_slot_1$1(ctx) {
|
||||
let t;
|
||||
|
||||
const block = {
|
||||
@@ -3011,17 +3011,17 @@ var app = (function () {
|
||||
|
||||
dispatch_dev("SvelteRegisterBlock", {
|
||||
block,
|
||||
id: create_default_slot_4.name,
|
||||
id: create_default_slot_1$1.name,
|
||||
type: "slot",
|
||||
source: "(12:1) <Button bind:layout new_layout=\\\"new\\\" my_class=\\\"chat_item\\\" my_id=\\\"chat_new\\\">",
|
||||
source: "(12:1) <Button bind:layout new_layout=\\\"new\\\" my_id=\\\"new\\\">",
|
||||
ctx
|
||||
});
|
||||
|
||||
return block;
|
||||
}
|
||||
|
||||
// (15:1) <Button bind:layout new_layout="close" my_class="chat_item" my_id="chat_close">
|
||||
function create_default_slot_3$1(ctx) {
|
||||
// (15:1) <Button bind:layout new_layout="close" my_id="close">
|
||||
function create_default_slot$3(ctx) {
|
||||
let t;
|
||||
|
||||
const block = {
|
||||
@@ -3036,92 +3036,11 @@ var app = (function () {
|
||||
}
|
||||
};
|
||||
|
||||
dispatch_dev("SvelteRegisterBlock", {
|
||||
block,
|
||||
id: create_default_slot_3$1.name,
|
||||
type: "slot",
|
||||
source: "(15:1) <Button bind:layout new_layout=\\\"close\\\" my_class=\\\"chat_item\\\" my_id=\\\"chat_close\\\">",
|
||||
ctx
|
||||
});
|
||||
|
||||
return block;
|
||||
}
|
||||
|
||||
// (27:3) <Button bind:layout new_layout="room" my_class="list">
|
||||
function create_default_slot_2$1(ctx) {
|
||||
let t;
|
||||
|
||||
const block = {
|
||||
c: function create() {
|
||||
t = text("a room");
|
||||
},
|
||||
m: function mount(target, anchor) {
|
||||
insert_dev(target, t, anchor);
|
||||
},
|
||||
d: function destroy(detaching) {
|
||||
if (detaching) detach_dev(t);
|
||||
}
|
||||
};
|
||||
|
||||
dispatch_dev("SvelteRegisterBlock", {
|
||||
block,
|
||||
id: create_default_slot_2$1.name,
|
||||
type: "slot",
|
||||
source: "(27:3) <Button bind:layout new_layout=\\\"room\\\" my_class=\\\"list\\\">",
|
||||
ctx
|
||||
});
|
||||
|
||||
return block;
|
||||
}
|
||||
|
||||
// (30:3) <Button bind:layout new_layout="room" my_class="list">
|
||||
function create_default_slot_1$1(ctx) {
|
||||
let t;
|
||||
|
||||
const block = {
|
||||
c: function create() {
|
||||
t = text("another room");
|
||||
},
|
||||
m: function mount(target, anchor) {
|
||||
insert_dev(target, t, anchor);
|
||||
},
|
||||
d: function destroy(detaching) {
|
||||
if (detaching) detach_dev(t);
|
||||
}
|
||||
};
|
||||
|
||||
dispatch_dev("SvelteRegisterBlock", {
|
||||
block,
|
||||
id: create_default_slot_1$1.name,
|
||||
type: "slot",
|
||||
source: "(30:3) <Button bind:layout new_layout=\\\"room\\\" my_class=\\\"list\\\">",
|
||||
ctx
|
||||
});
|
||||
|
||||
return block;
|
||||
}
|
||||
|
||||
// (33:3) <Button bind:layout new_layout="room" my_class="list">
|
||||
function create_default_slot$3(ctx) {
|
||||
let t;
|
||||
|
||||
const block = {
|
||||
c: function create() {
|
||||
t = text("placeholder");
|
||||
},
|
||||
m: function mount(target, anchor) {
|
||||
insert_dev(target, t, anchor);
|
||||
},
|
||||
d: function destroy(detaching) {
|
||||
if (detaching) detach_dev(t);
|
||||
}
|
||||
};
|
||||
|
||||
dispatch_dev("SvelteRegisterBlock", {
|
||||
block,
|
||||
id: create_default_slot$3.name,
|
||||
type: "slot",
|
||||
source: "(33:3) <Button bind:layout new_layout=\\\"room\\\" my_class=\\\"list\\\">",
|
||||
source: "(15:1) <Button bind:layout new_layout=\\\"close\\\" my_id=\\\"close\\\">",
|
||||
ctx
|
||||
});
|
||||
|
||||
@@ -3145,15 +3064,6 @@ var app = (function () {
|
||||
let div1;
|
||||
let div0;
|
||||
let p1;
|
||||
let t6;
|
||||
let button3;
|
||||
let updating_layout_3;
|
||||
let t7;
|
||||
let button4;
|
||||
let updating_layout_4;
|
||||
let t8;
|
||||
let button5;
|
||||
let updating_layout_5;
|
||||
let current;
|
||||
|
||||
function button0_layout_binding(value) {
|
||||
@@ -3162,9 +3072,8 @@ var app = (function () {
|
||||
|
||||
let button0_props = {
|
||||
new_layout: "settings",
|
||||
my_class: "chat_item",
|
||||
my_id: "chat_settings",
|
||||
$$slots: { default: [create_default_slot_5] },
|
||||
my_id: "settings",
|
||||
$$slots: { default: [create_default_slot_2$1] },
|
||||
$$scope: { ctx }
|
||||
};
|
||||
|
||||
@@ -3181,9 +3090,8 @@ var app = (function () {
|
||||
|
||||
let button1_props = {
|
||||
new_layout: "new",
|
||||
my_class: "chat_item",
|
||||
my_id: "chat_new",
|
||||
$$slots: { default: [create_default_slot_4] },
|
||||
my_id: "new",
|
||||
$$slots: { default: [create_default_slot_1$1] },
|
||||
$$scope: { ctx }
|
||||
};
|
||||
|
||||
@@ -3200,9 +3108,8 @@ var app = (function () {
|
||||
|
||||
let button2_props = {
|
||||
new_layout: "close",
|
||||
my_class: "chat_item",
|
||||
my_id: "chat_close",
|
||||
$$slots: { default: [create_default_slot_3$1] },
|
||||
my_id: "close",
|
||||
$$slots: { default: [create_default_slot$3] },
|
||||
$$scope: { ctx }
|
||||
};
|
||||
|
||||
@@ -3213,60 +3120,6 @@ var app = (function () {
|
||||
button2 = new Buttons({ props: button2_props, $$inline: true });
|
||||
binding_callbacks.push(() => bind(button2, 'layout', button2_layout_binding));
|
||||
|
||||
function button3_layout_binding(value) {
|
||||
/*button3_layout_binding*/ ctx[4](value);
|
||||
}
|
||||
|
||||
let button3_props = {
|
||||
new_layout: "room",
|
||||
my_class: "list",
|
||||
$$slots: { default: [create_default_slot_2$1] },
|
||||
$$scope: { ctx }
|
||||
};
|
||||
|
||||
if (/*layout*/ ctx[0] !== void 0) {
|
||||
button3_props.layout = /*layout*/ ctx[0];
|
||||
}
|
||||
|
||||
button3 = new Buttons({ props: button3_props, $$inline: true });
|
||||
binding_callbacks.push(() => bind(button3, 'layout', button3_layout_binding));
|
||||
|
||||
function button4_layout_binding(value) {
|
||||
/*button4_layout_binding*/ ctx[5](value);
|
||||
}
|
||||
|
||||
let button4_props = {
|
||||
new_layout: "room",
|
||||
my_class: "list",
|
||||
$$slots: { default: [create_default_slot_1$1] },
|
||||
$$scope: { ctx }
|
||||
};
|
||||
|
||||
if (/*layout*/ ctx[0] !== void 0) {
|
||||
button4_props.layout = /*layout*/ ctx[0];
|
||||
}
|
||||
|
||||
button4 = new Buttons({ props: button4_props, $$inline: true });
|
||||
binding_callbacks.push(() => bind(button4, 'layout', button4_layout_binding));
|
||||
|
||||
function button5_layout_binding(value) {
|
||||
/*button5_layout_binding*/ ctx[6](value);
|
||||
}
|
||||
|
||||
let button5_props = {
|
||||
new_layout: "room",
|
||||
my_class: "list",
|
||||
$$slots: { default: [create_default_slot$3] },
|
||||
$$scope: { ctx }
|
||||
};
|
||||
|
||||
if (/*layout*/ ctx[0] !== void 0) {
|
||||
button5_props.layout = /*layout*/ ctx[0];
|
||||
}
|
||||
|
||||
button5 = new Buttons({ props: button5_props, $$inline: true });
|
||||
binding_callbacks.push(() => bind(button5, 'layout', button5_layout_binding));
|
||||
|
||||
const block = {
|
||||
c: function create() {
|
||||
div3 = element("div");
|
||||
@@ -3284,25 +3137,19 @@ var app = (function () {
|
||||
div0 = element("div");
|
||||
p1 = element("p");
|
||||
p1.textContent = "/ you have no chat room yet /";
|
||||
t6 = space();
|
||||
create_component(button3.$$.fragment);
|
||||
t7 = space();
|
||||
create_component(button4.$$.fragment);
|
||||
t8 = space();
|
||||
create_component(button5.$$.fragment);
|
||||
attr_dev(p0, "class", "__center");
|
||||
add_location(p0, file$d, 19, 2, 468);
|
||||
attr_dev(p1, "class", "__center");
|
||||
add_location(p1, file$d, 22, 4, 628);
|
||||
attr_dev(div0, "class", "chat_room_name __show_if_only_child");
|
||||
add_location(div0, file$d, 21, 3, 574);
|
||||
attr_dev(p0, "class", "title svelte-1vu2j1b");
|
||||
add_location(p0, file$d, 19, 2, 375);
|
||||
attr_dev(p1, "class", "no_chat svelte-1vu2j1b");
|
||||
add_location(p1, file$d, 22, 4, 509);
|
||||
attr_dev(div0, "class", "__show_if_only_child");
|
||||
add_location(div0, file$d, 21, 3, 470);
|
||||
attr_dev(div1, "class", "room_list");
|
||||
attr_dev(div1, "id", "chat_api_room_list");
|
||||
attr_dev(div1, "class", "chat_api list_btn");
|
||||
add_location(div1, file$d, 20, 2, 515);
|
||||
attr_dev(div2, "class", "chat_item chat_panel");
|
||||
attr_dev(div2, "id", "chat_panel_home");
|
||||
add_location(div2, file$d, 18, 1, 410);
|
||||
attr_dev(div3, "class", "grid_box svelte-x798v3");
|
||||
add_location(div1, file$d, 20, 2, 419);
|
||||
attr_dev(div2, "class", "chat_panel svelte-1vu2j1b");
|
||||
attr_dev(div2, "id", "panel_home");
|
||||
add_location(div2, file$d, 18, 1, 332);
|
||||
attr_dev(div3, "class", "grid_box svelte-1vu2j1b");
|
||||
add_location(div3, file$d, 6, 0, 81);
|
||||
},
|
||||
l: function claim(nodes) {
|
||||
@@ -3322,18 +3169,12 @@ var app = (function () {
|
||||
append_dev(div2, div1);
|
||||
append_dev(div1, div0);
|
||||
append_dev(div0, p1);
|
||||
append_dev(div1, t6);
|
||||
mount_component(button3, div1, null);
|
||||
append_dev(div1, t7);
|
||||
mount_component(button4, div1, null);
|
||||
append_dev(div1, t8);
|
||||
mount_component(button5, div1, null);
|
||||
current = true;
|
||||
},
|
||||
p: function update(ctx, [dirty]) {
|
||||
const button0_changes = {};
|
||||
|
||||
if (dirty & /*$$scope*/ 128) {
|
||||
if (dirty & /*$$scope*/ 16) {
|
||||
button0_changes.$$scope = { dirty, ctx };
|
||||
}
|
||||
|
||||
@@ -3346,7 +3187,7 @@ var app = (function () {
|
||||
button0.$set(button0_changes);
|
||||
const button1_changes = {};
|
||||
|
||||
if (dirty & /*$$scope*/ 128) {
|
||||
if (dirty & /*$$scope*/ 16) {
|
||||
button1_changes.$$scope = { dirty, ctx };
|
||||
}
|
||||
|
||||
@@ -3359,7 +3200,7 @@ var app = (function () {
|
||||
button1.$set(button1_changes);
|
||||
const button2_changes = {};
|
||||
|
||||
if (dirty & /*$$scope*/ 128) {
|
||||
if (dirty & /*$$scope*/ 16) {
|
||||
button2_changes.$$scope = { dirty, ctx };
|
||||
}
|
||||
|
||||
@@ -3370,63 +3211,18 @@ var app = (function () {
|
||||
}
|
||||
|
||||
button2.$set(button2_changes);
|
||||
const button3_changes = {};
|
||||
|
||||
if (dirty & /*$$scope*/ 128) {
|
||||
button3_changes.$$scope = { dirty, ctx };
|
||||
}
|
||||
|
||||
if (!updating_layout_3 && dirty & /*layout*/ 1) {
|
||||
updating_layout_3 = true;
|
||||
button3_changes.layout = /*layout*/ ctx[0];
|
||||
add_flush_callback(() => updating_layout_3 = false);
|
||||
}
|
||||
|
||||
button3.$set(button3_changes);
|
||||
const button4_changes = {};
|
||||
|
||||
if (dirty & /*$$scope*/ 128) {
|
||||
button4_changes.$$scope = { dirty, ctx };
|
||||
}
|
||||
|
||||
if (!updating_layout_4 && dirty & /*layout*/ 1) {
|
||||
updating_layout_4 = true;
|
||||
button4_changes.layout = /*layout*/ ctx[0];
|
||||
add_flush_callback(() => updating_layout_4 = false);
|
||||
}
|
||||
|
||||
button4.$set(button4_changes);
|
||||
const button5_changes = {};
|
||||
|
||||
if (dirty & /*$$scope*/ 128) {
|
||||
button5_changes.$$scope = { dirty, ctx };
|
||||
}
|
||||
|
||||
if (!updating_layout_5 && dirty & /*layout*/ 1) {
|
||||
updating_layout_5 = true;
|
||||
button5_changes.layout = /*layout*/ ctx[0];
|
||||
add_flush_callback(() => updating_layout_5 = false);
|
||||
}
|
||||
|
||||
button5.$set(button5_changes);
|
||||
},
|
||||
i: function intro(local) {
|
||||
if (current) return;
|
||||
transition_in(button0.$$.fragment, local);
|
||||
transition_in(button1.$$.fragment, local);
|
||||
transition_in(button2.$$.fragment, local);
|
||||
transition_in(button3.$$.fragment, local);
|
||||
transition_in(button4.$$.fragment, local);
|
||||
transition_in(button5.$$.fragment, local);
|
||||
current = true;
|
||||
},
|
||||
o: function outro(local) {
|
||||
transition_out(button0.$$.fragment, local);
|
||||
transition_out(button1.$$.fragment, local);
|
||||
transition_out(button2.$$.fragment, local);
|
||||
transition_out(button3.$$.fragment, local);
|
||||
transition_out(button4.$$.fragment, local);
|
||||
transition_out(button5.$$.fragment, local);
|
||||
current = false;
|
||||
},
|
||||
d: function destroy(detaching) {
|
||||
@@ -3434,9 +3230,6 @@ var app = (function () {
|
||||
destroy_component(button0);
|
||||
destroy_component(button1);
|
||||
destroy_component(button2);
|
||||
destroy_component(button3);
|
||||
destroy_component(button4);
|
||||
destroy_component(button5);
|
||||
}
|
||||
};
|
||||
|
||||
@@ -3483,21 +3276,6 @@ var app = (function () {
|
||||
$$invalidate(0, layout);
|
||||
}
|
||||
|
||||
function button3_layout_binding(value) {
|
||||
layout = value;
|
||||
$$invalidate(0, layout);
|
||||
}
|
||||
|
||||
function button4_layout_binding(value) {
|
||||
layout = value;
|
||||
$$invalidate(0, layout);
|
||||
}
|
||||
|
||||
function button5_layout_binding(value) {
|
||||
layout = value;
|
||||
$$invalidate(0, layout);
|
||||
}
|
||||
|
||||
$$self.$$set = $$props => {
|
||||
if ('layout' in $$props) $$invalidate(0, layout = $$props.layout);
|
||||
};
|
||||
@@ -3512,15 +3290,7 @@ var app = (function () {
|
||||
$$self.$inject_state($$props.$$inject);
|
||||
}
|
||||
|
||||
return [
|
||||
layout,
|
||||
button0_layout_binding,
|
||||
button1_layout_binding,
|
||||
button2_layout_binding,
|
||||
button3_layout_binding,
|
||||
button4_layout_binding,
|
||||
button5_layout_binding
|
||||
];
|
||||
return [layout, button0_layout_binding, button1_layout_binding, button2_layout_binding];
|
||||
}
|
||||
|
||||
class Layout_home extends SvelteComponentDev {
|
||||
@@ -3561,8 +3331,7 @@ var app = (function () {
|
||||
|
||||
let button_props = {
|
||||
new_layout: "home",
|
||||
my_class: "chat_item",
|
||||
my_id: "chat_chat",
|
||||
my_id: "chat",
|
||||
$$slots: { default: [create_default_slot$2] },
|
||||
$$scope: { ctx }
|
||||
};
|
||||
@@ -3578,7 +3347,7 @@ var app = (function () {
|
||||
c: function create() {
|
||||
div = element("div");
|
||||
create_component(button.$$.fragment);
|
||||
attr_dev(div, "class", "grid_box svelte-zg8hgq");
|
||||
attr_dev(div, "class", "grid_box svelte-1aq8ao");
|
||||
add_location(div, file$c, 33, 2, 676);
|
||||
},
|
||||
m: function mount(target, anchor) {
|
||||
@@ -3690,7 +3459,7 @@ var app = (function () {
|
||||
return block;
|
||||
}
|
||||
|
||||
// (35:3) <Button bind:layout new_layout="home" my_class="chat_item" my_id="chat_chat">
|
||||
// (35:3) <Button bind:layout new_layout="home" my_id="chat">
|
||||
function create_default_slot$2(ctx) {
|
||||
let t;
|
||||
|
||||
@@ -3710,7 +3479,7 @@ var app = (function () {
|
||||
block,
|
||||
id: create_default_slot$2.name,
|
||||
type: "slot",
|
||||
source: "(35:3) <Button bind:layout new_layout=\\\"home\\\" my_class=\\\"chat_item\\\" my_id=\\\"chat_chat\\\">",
|
||||
source: "(35:3) <Button bind:layout new_layout=\\\"home\\\" my_id=\\\"chat\\\">",
|
||||
ctx
|
||||
});
|
||||
|
||||
@@ -3738,7 +3507,7 @@ var app = (function () {
|
||||
c: function create() {
|
||||
div = element("div");
|
||||
if_block.c();
|
||||
attr_dev(div, "class", div_class_value = "" + (null_to_empty(/*layout*/ ctx[1]) + " svelte-zg8hgq"));
|
||||
attr_dev(div, "class", div_class_value = "" + (null_to_empty(/*layout*/ ctx[1]) + " svelte-1aq8ao"));
|
||||
attr_dev(div, "id", "chat_box");
|
||||
set_style(div, "background-color", /*color*/ ctx[0]);
|
||||
add_location(div, file$c, 27, 0, 530);
|
||||
@@ -3778,7 +3547,7 @@ var app = (function () {
|
||||
if_block.m(div, null);
|
||||
}
|
||||
|
||||
if (!current || dirty & /*layout*/ 2 && div_class_value !== (div_class_value = "" + (null_to_empty(/*layout*/ ctx[1]) + " svelte-zg8hgq"))) {
|
||||
if (!current || dirty & /*layout*/ 2 && div_class_value !== (div_class_value = "" + (null_to_empty(/*layout*/ ctx[1]) + " svelte-1aq8ao"))) {
|
||||
attr_dev(div, "class", div_class_value);
|
||||
}
|
||||
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -53,6 +53,9 @@
|
||||
button.list:not(:hover) {
|
||||
background-color: rgb(240, 240, 240);
|
||||
}
|
||||
button.list p {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
@@ -37,7 +37,7 @@
|
||||
|
||||
{:else}
|
||||
<div class="grid_box">
|
||||
<Button bind:layout new_layout="home" my_class="chat_item" my_id="chat_chat">
|
||||
<Button bind:layout new_layout="home" my_id="chat">
|
||||
chat
|
||||
</Button>
|
||||
</div>
|
||||
@@ -67,7 +67,7 @@
|
||||
|
||||
/* style if chat_box is closed
|
||||
*/
|
||||
#chat_box .chat_item#chat_chat {grid-area: chat;}
|
||||
#chat_box #chat {grid-area: chat;}
|
||||
#chat_box.close .grid_box {
|
||||
gap: 0px;
|
||||
grid:
|
||||
@@ -103,25 +103,25 @@
|
||||
}
|
||||
|
||||
/* all grid elements names
|
||||
:global(#chat_box .chat_item#chat_chat ){grid-area: chat;}
|
||||
:global(#chat_box .chat_item#chat_close ){grid-area: close;}
|
||||
:global(#chat_box .chat_item#chat_new ){grid-area: new;}
|
||||
:global(#chat_box .chat_item#chat_settings ){grid-area: settings;}
|
||||
:global(#chat_box .chat_item#chat_room_name ){grid-area: room_name;}
|
||||
:global(#chat_box .chat_item#chat_send ){grid-area: send;}
|
||||
:global(#chat_box .chat_item#chat_create ){grid-area: create;}
|
||||
:global(#chat_box .chat_item#chat_user ){grid-area: user;}
|
||||
:global(#chat_box .chat_item#chat_back ){grid-area: back;}
|
||||
:global(#chat_box .chat_item#chat_panel_home ){grid-area: panel_home;}
|
||||
:global(#chat_box .chat_item#chat_panel_new ){grid-area: panel_new;}
|
||||
:global(#chat_box .chat_item#chat_panel_msg ){grid-area: panel_msg;}
|
||||
:global(#chat_box .chat_item#chat_panel_write ){grid-area: panel_write;}
|
||||
:global(#chat_box .chat_item#chat_panel_settings ){grid-area: panel_settings;}
|
||||
:global(#chat_box .chat_item#chat_panel_room_set ){grid-area: panel_room_set;}
|
||||
:global(#chat_box .chat_item#chat_panel_protected ){grid-area: panel_protected;}
|
||||
:global(#chat_box .chat_item#chat_panel_create ){grid-area: panel_create;}
|
||||
:global(#chat_box .chat_item#chat_panel_user ){grid-area: panel_user;}
|
||||
:global(#chat_box .chat_item#chat_panel_mute ){grid-area: panel_mute;}
|
||||
:global(#chat_box #chat ){grid-area: chat;}
|
||||
:global(#chat_box #close ){grid-area: close;}
|
||||
:global(#chat_box #new ){grid-area: new;}
|
||||
:global(#chat_box #settings ){grid-area: settings;}
|
||||
:global(#chat_box #room_name ){grid-area: room_name;}
|
||||
:global(#chat_box #send ){grid-area: send;}
|
||||
:global(#chat_box #create ){grid-area: create;}
|
||||
:global(#chat_box #user ){grid-area: user;}
|
||||
:global(#chat_box #back ){grid-area: back;}
|
||||
:global(#chat_box #panel_home ){grid-area: panel_home;}
|
||||
:global(#chat_box #panel_new ){grid-area: panel_new;}
|
||||
:global(#chat_box #panel_msg ){grid-area: panel_msg;}
|
||||
:global(#chat_box #panel_write ){grid-area: panel_write;}
|
||||
:global(#chat_box #panel_settings ){grid-area: panel_settings;}
|
||||
:global(#chat_box #panel_room_set ){grid-area: panel_room_set;}
|
||||
:global(#chat_box #panel_protected ){grid-area: panel_protected;}
|
||||
:global(#chat_box #panel_create ){grid-area: panel_create;}
|
||||
:global(#chat_box #panel_user ){grid-area: panel_user;}
|
||||
:global(#chat_box #panel_mute ){grid-area: panel_mute;}
|
||||
*/
|
||||
|
||||
/* all panels
|
||||
@@ -137,5 +137,16 @@
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
|
||||
/* show child only if it's alone
|
||||
*/
|
||||
#chat_box :global(.__show_if_only_child) {
|
||||
display: none;
|
||||
}
|
||||
#chat_box :global(.__show_if_only_child:only-child) {
|
||||
display: flex;
|
||||
color: rgb(100, 100, 100);
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
@@ -6,24 +6,23 @@
|
||||
|
||||
<div class="grid_box">
|
||||
|
||||
<Button bind:layout new_layout="settings" my_class="chat_item" my_id="chat_settings">
|
||||
<Button bind:layout new_layout="settings" my_id="settings">
|
||||
settings
|
||||
</Button>
|
||||
<Button bind:layout new_layout="new" my_class="chat_item" my_id="chat_new">
|
||||
<Button bind:layout new_layout="new" my_id="new">
|
||||
new
|
||||
</Button>
|
||||
<Button bind:layout new_layout="close" my_class="chat_item" my_id="chat_close">
|
||||
<Button bind:layout new_layout="close" my_id="close">
|
||||
close
|
||||
</Button>
|
||||
|
||||
<div class="chat_item chat_panel" id="chat_panel_home">
|
||||
<p class="__center">list of your rooms :</p>
|
||||
<div id="chat_api_room_list" class="chat_api list_btn">
|
||||
<div class="chat_room_name __show_if_only_child">
|
||||
<p class="__center">/ you have no chat room yet /</p>
|
||||
<div class="chat_panel" id="panel_home">
|
||||
<p class="title">list of your rooms :</p>
|
||||
<div class="room_list" id="chat_api_room_list">
|
||||
<div class="__show_if_only_child">
|
||||
<p class="no_chat">/ you have no chat room yet /</p>
|
||||
</div>
|
||||
<!-- placeholders
|
||||
------------- -->
|
||||
<Button bind:layout new_layout="room" my_class="list">
|
||||
a room
|
||||
</Button>
|
||||
@@ -33,6 +32,7 @@
|
||||
<Button bind:layout new_layout="room" my_class="list">
|
||||
placeholder
|
||||
</Button>
|
||||
------------- -->
|
||||
<!-- END placeholders -->
|
||||
</div>
|
||||
</div>
|
||||
@@ -43,10 +43,10 @@
|
||||
|
||||
/* grid layout "home"
|
||||
*/
|
||||
.grid_box :global(.chat_item#chat_settings ) {grid-area: settings;}
|
||||
.grid_box :global(.chat_item#chat_close ) {grid-area: close;}
|
||||
.grid_box :global(.chat_item#chat_new ) {grid-area: new;}
|
||||
.grid_box :global(.chat_item#chat_panel_home) {grid-area: panel_home;}
|
||||
.grid_box :global(#settings ) {grid-area: settings;}
|
||||
.grid_box :global(#close ) {grid-area: close;}
|
||||
.grid_box :global(#new ) {grid-area: new;}
|
||||
.grid_box :global(#panel_home) {grid-area: panel_home;}
|
||||
.grid_box {
|
||||
grid:
|
||||
' settings new close ' auto
|
||||
@@ -54,26 +54,20 @@
|
||||
/ auto 1fr auto ;
|
||||
}
|
||||
|
||||
/* button "new"
|
||||
*/
|
||||
.grid_box :global(button#chat_new:not(:hover)) {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
|
||||
/* button "settings" as 3 dots
|
||||
*/
|
||||
.grid_box :global(button#chat_settings p) {
|
||||
.grid_box :global(button#settings p) {
|
||||
display: none;
|
||||
}
|
||||
:global(#chat_box) .grid_box :global(button#chat_settings) {
|
||||
.grid_box :global(button#settings) {
|
||||
width: 30px;
|
||||
height: 100%;
|
||||
}
|
||||
.grid_box :global(button#chat_settings:not(:hover)) {
|
||||
.grid_box :global(button#settings:not(:hover)) {
|
||||
background-color: transparent;
|
||||
}
|
||||
.grid_box :global(button#chat_settings::after) {
|
||||
.grid_box :global(button#settings::after) {
|
||||
content: '\2807';
|
||||
font-size: 20px;
|
||||
position: absolute;
|
||||
@@ -87,11 +81,46 @@
|
||||
}
|
||||
|
||||
|
||||
/* panel home
|
||||
#panel_home > * {
|
||||
margin: 0px;
|
||||
}
|
||||
/* button "new"
|
||||
*/
|
||||
.grid_box :global(button#new:not(:hover)) {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
|
||||
/* button "close"
|
||||
*/
|
||||
.grid_box :global(button#close p) {
|
||||
display: none;
|
||||
}
|
||||
.grid_box :global(button#close) {
|
||||
width: 30px;
|
||||
height: 100%;
|
||||
padding: 0px;
|
||||
background-color: transparent;
|
||||
}
|
||||
.grid_box :global(button#close::before) {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: calc(50% - 1px);
|
||||
left: 5px;
|
||||
width: 20px;
|
||||
height: 2px;
|
||||
background-color: black;
|
||||
}
|
||||
|
||||
|
||||
/* panel home
|
||||
*/
|
||||
#panel_home {
|
||||
border-top: 1px solid black;
|
||||
}
|
||||
#panel_home p.title {
|
||||
margin: 10px auto 0px auto;
|
||||
}
|
||||
#panel_home p.no_chat {
|
||||
margin: 0px auto;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
@@ -11,17 +11,6 @@
|
||||
}
|
||||
|
||||
|
||||
/* show child only if it's alone
|
||||
*/
|
||||
#chat_box .__show_if_only_child {
|
||||
display: none;
|
||||
}
|
||||
#chat_box .__show_if_only_child:only-child {
|
||||
display: flex;
|
||||
color: rgb(100, 100, 100);
|
||||
}
|
||||
|
||||
|
||||
/* separation line under controls
|
||||
*/
|
||||
#chat_box .chat_item.chat_panel {
|
||||
|
||||
@@ -1,20 +0,0 @@
|
||||
#chat_box .chat_item#chat_close {
|
||||
width: 30px;
|
||||
}
|
||||
/* add or remove '.chat_item' to toggle the hover effect */
|
||||
#chat_box button.chat_item.chat_close {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 0px;
|
||||
background-color: transparent;
|
||||
}
|
||||
#chat_close::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: calc(50% - 1px);
|
||||
left: 5px;
|
||||
width: 20px;
|
||||
height: 2px;
|
||||
background-color: black;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user