You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
10107 lines
312 KiB
10107 lines
312 KiB
|
|
(function(l, r) { if (l.getElementById('livereloadscript')) return; r = l.createElement('script'); r.async = 1; r.src = '//' + (window.location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1'; r.id = 'livereloadscript'; l.getElementsByTagName('head')[0].appendChild(r) })(window.document);
|
|
var app = (function () {
|
|
'use strict';
|
|
|
|
function noop() { }
|
|
const identity = x => x;
|
|
function assign(tar, src) {
|
|
// @ts-ignore
|
|
for (const k in src)
|
|
tar[k] = src[k];
|
|
return tar;
|
|
}
|
|
function add_location(element, file, line, column, char) {
|
|
element.__svelte_meta = {
|
|
loc: { file, line, column, char }
|
|
};
|
|
}
|
|
function run(fn) {
|
|
return fn();
|
|
}
|
|
function blank_object() {
|
|
return Object.create(null);
|
|
}
|
|
function run_all(fns) {
|
|
fns.forEach(run);
|
|
}
|
|
function is_function(thing) {
|
|
return typeof thing === 'function';
|
|
}
|
|
function safe_not_equal(a, b) {
|
|
return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function');
|
|
}
|
|
function is_empty(obj) {
|
|
return Object.keys(obj).length === 0;
|
|
}
|
|
function subscribe(store, ...callbacks) {
|
|
if (store == null) {
|
|
return noop;
|
|
}
|
|
const unsub = store.subscribe(...callbacks);
|
|
return unsub.unsubscribe ? () => unsub.unsubscribe() : unsub;
|
|
}
|
|
function create_slot(definition, ctx, $$scope, fn) {
|
|
if (definition) {
|
|
const slot_ctx = get_slot_context(definition, ctx, $$scope, fn);
|
|
return definition[0](slot_ctx);
|
|
}
|
|
}
|
|
function get_slot_context(definition, ctx, $$scope, fn) {
|
|
return definition[1] && fn
|
|
? assign($$scope.ctx.slice(), definition[1](fn(ctx)))
|
|
: $$scope.ctx;
|
|
}
|
|
function get_slot_changes(definition, $$scope, dirty, fn) {
|
|
if (definition[2] && fn) {
|
|
const lets = definition[2](fn(dirty));
|
|
if ($$scope.dirty === undefined) {
|
|
return lets;
|
|
}
|
|
if (typeof lets === 'object') {
|
|
const merged = [];
|
|
const len = Math.max($$scope.dirty.length, lets.length);
|
|
for (let i = 0; i < len; i += 1) {
|
|
merged[i] = $$scope.dirty[i] | lets[i];
|
|
}
|
|
return merged;
|
|
}
|
|
return $$scope.dirty | lets;
|
|
}
|
|
return $$scope.dirty;
|
|
}
|
|
function update_slot(slot, slot_definition, ctx, $$scope, dirty, get_slot_changes_fn, get_slot_context_fn) {
|
|
const slot_changes = get_slot_changes(slot_definition, $$scope, dirty, get_slot_changes_fn);
|
|
if (slot_changes) {
|
|
const slot_context = get_slot_context(slot_definition, ctx, $$scope, get_slot_context_fn);
|
|
slot.p(slot_context, slot_changes);
|
|
}
|
|
}
|
|
function action_destroyer(action_result) {
|
|
return action_result && is_function(action_result.destroy) ? action_result.destroy : noop;
|
|
}
|
|
|
|
const is_client = typeof window !== 'undefined';
|
|
let now = is_client
|
|
? () => window.performance.now()
|
|
: () => Date.now();
|
|
let raf = is_client ? cb => requestAnimationFrame(cb) : noop;
|
|
|
|
const tasks = new Set();
|
|
function run_tasks(now) {
|
|
tasks.forEach(task => {
|
|
if (!task.c(now)) {
|
|
tasks.delete(task);
|
|
task.f();
|
|
}
|
|
});
|
|
if (tasks.size !== 0)
|
|
raf(run_tasks);
|
|
}
|
|
/**
|
|
* Creates a new task that runs on each raf frame
|
|
* until it returns a falsy value or is aborted
|
|
*/
|
|
function loop(callback) {
|
|
let task;
|
|
if (tasks.size === 0)
|
|
raf(run_tasks);
|
|
return {
|
|
promise: new Promise(fulfill => {
|
|
tasks.add(task = { c: callback, f: fulfill });
|
|
}),
|
|
abort() {
|
|
tasks.delete(task);
|
|
}
|
|
};
|
|
}
|
|
|
|
function append(target, node) {
|
|
target.appendChild(node);
|
|
}
|
|
function insert(target, node, anchor) {
|
|
target.insertBefore(node, anchor || null);
|
|
}
|
|
function detach(node) {
|
|
node.parentNode.removeChild(node);
|
|
}
|
|
function destroy_each(iterations, detaching) {
|
|
for (let i = 0; i < iterations.length; i += 1) {
|
|
if (iterations[i])
|
|
iterations[i].d(detaching);
|
|
}
|
|
}
|
|
function element(name) {
|
|
return document.createElement(name);
|
|
}
|
|
function svg_element(name) {
|
|
return document.createElementNS('http://www.w3.org/2000/svg', name);
|
|
}
|
|
function text(data) {
|
|
return document.createTextNode(data);
|
|
}
|
|
function space() {
|
|
return text(' ');
|
|
}
|
|
function empty() {
|
|
return text('');
|
|
}
|
|
function listen(node, event, handler, options) {
|
|
node.addEventListener(event, handler, options);
|
|
return () => node.removeEventListener(event, handler, options);
|
|
}
|
|
function attr(node, attribute, value) {
|
|
if (value == null)
|
|
node.removeAttribute(attribute);
|
|
else if (node.getAttribute(attribute) !== value)
|
|
node.setAttribute(attribute, value);
|
|
}
|
|
function set_custom_element_data(node, prop, value) {
|
|
if (prop in node) {
|
|
node[prop] = value;
|
|
}
|
|
else {
|
|
attr(node, prop, value);
|
|
}
|
|
}
|
|
function xlink_attr(node, attribute, value) {
|
|
node.setAttributeNS('http://www.w3.org/1999/xlink', attribute, value);
|
|
}
|
|
function children(element) {
|
|
return Array.from(element.childNodes);
|
|
}
|
|
function toggle_class(element, name, toggle) {
|
|
element.classList[toggle ? 'add' : 'remove'](name);
|
|
}
|
|
function custom_event(type, detail) {
|
|
const e = document.createEvent('CustomEvent');
|
|
e.initCustomEvent(type, false, false, detail);
|
|
return e;
|
|
}
|
|
|
|
const active_docs = new Set();
|
|
let active = 0;
|
|
// https://github.com/darkskyapp/string-hash/blob/master/index.js
|
|
function hash(str) {
|
|
let hash = 5381;
|
|
let i = str.length;
|
|
while (i--)
|
|
hash = ((hash << 5) - hash) ^ str.charCodeAt(i);
|
|
return hash >>> 0;
|
|
}
|
|
function create_rule(node, a, b, duration, delay, ease, fn, uid = 0) {
|
|
const step = 16.666 / duration;
|
|
let keyframes = '{\n';
|
|
for (let p = 0; p <= 1; p += step) {
|
|
const t = a + (b - a) * ease(p);
|
|
keyframes += p * 100 + `%{${fn(t, 1 - t)}}\n`;
|
|
}
|
|
const rule = keyframes + `100% {${fn(b, 1 - b)}}\n}`;
|
|
const name = `__svelte_${hash(rule)}_${uid}`;
|
|
const doc = node.ownerDocument;
|
|
active_docs.add(doc);
|
|
const stylesheet = doc.__svelte_stylesheet || (doc.__svelte_stylesheet = doc.head.appendChild(element('style')).sheet);
|
|
const current_rules = doc.__svelte_rules || (doc.__svelte_rules = {});
|
|
if (!current_rules[name]) {
|
|
current_rules[name] = true;
|
|
stylesheet.insertRule(`@keyframes ${name} ${rule}`, stylesheet.cssRules.length);
|
|
}
|
|
const animation = node.style.animation || '';
|
|
node.style.animation = `${animation ? `${animation}, ` : ''}${name} ${duration}ms linear ${delay}ms 1 both`;
|
|
active += 1;
|
|
return name;
|
|
}
|
|
function delete_rule(node, name) {
|
|
const previous = (node.style.animation || '').split(', ');
|
|
const next = previous.filter(name
|
|
? anim => anim.indexOf(name) < 0 // remove specific animation
|
|
: anim => anim.indexOf('__svelte') === -1 // remove all Svelte animations
|
|
);
|
|
const deleted = previous.length - next.length;
|
|
if (deleted) {
|
|
node.style.animation = next.join(', ');
|
|
active -= deleted;
|
|
if (!active)
|
|
clear_rules();
|
|
}
|
|
}
|
|
function clear_rules() {
|
|
raf(() => {
|
|
if (active)
|
|
return;
|
|
active_docs.forEach(doc => {
|
|
const stylesheet = doc.__svelte_stylesheet;
|
|
let i = stylesheet.cssRules.length;
|
|
while (i--)
|
|
stylesheet.deleteRule(i);
|
|
doc.__svelte_rules = {};
|
|
});
|
|
active_docs.clear();
|
|
});
|
|
}
|
|
|
|
let current_component;
|
|
function set_current_component(component) {
|
|
current_component = component;
|
|
}
|
|
function get_current_component() {
|
|
if (!current_component)
|
|
throw new Error('Function called outside component initialization');
|
|
return current_component;
|
|
}
|
|
function onMount(fn) {
|
|
get_current_component().$$.on_mount.push(fn);
|
|
}
|
|
function afterUpdate(fn) {
|
|
get_current_component().$$.after_update.push(fn);
|
|
}
|
|
function createEventDispatcher() {
|
|
const component = get_current_component();
|
|
return (type, detail) => {
|
|
const callbacks = component.$$.callbacks[type];
|
|
if (callbacks) {
|
|
// TODO are there situations where events could be dispatched
|
|
// in a server (non-DOM) environment?
|
|
const event = custom_event(type, detail);
|
|
callbacks.slice().forEach(fn => {
|
|
fn.call(component, event);
|
|
});
|
|
}
|
|
};
|
|
}
|
|
// TODO figure out if we still want to support
|
|
// shorthand events, or if we want to implement
|
|
// a real bubbling mechanism
|
|
function bubble(component, event) {
|
|
const callbacks = component.$$.callbacks[event.type];
|
|
if (callbacks) {
|
|
callbacks.slice().forEach(fn => fn(event));
|
|
}
|
|
}
|
|
|
|
const dirty_components = [];
|
|
const binding_callbacks = [];
|
|
const render_callbacks = [];
|
|
const flush_callbacks = [];
|
|
const resolved_promise = Promise.resolve();
|
|
let update_scheduled = false;
|
|
function schedule_update() {
|
|
if (!update_scheduled) {
|
|
update_scheduled = true;
|
|
resolved_promise.then(flush);
|
|
}
|
|
}
|
|
function tick() {
|
|
schedule_update();
|
|
return resolved_promise;
|
|
}
|
|
function add_render_callback(fn) {
|
|
render_callbacks.push(fn);
|
|
}
|
|
let flushing = false;
|
|
const seen_callbacks = new Set();
|
|
function flush() {
|
|
if (flushing)
|
|
return;
|
|
flushing = true;
|
|
do {
|
|
// first, call beforeUpdate functions
|
|
// and update components
|
|
for (let i = 0; i < dirty_components.length; i += 1) {
|
|
const component = dirty_components[i];
|
|
set_current_component(component);
|
|
update(component.$$);
|
|
}
|
|
set_current_component(null);
|
|
dirty_components.length = 0;
|
|
while (binding_callbacks.length)
|
|
binding_callbacks.pop()();
|
|
// then, once components are updated, call
|
|
// afterUpdate functions. This may cause
|
|
// subsequent updates...
|
|
for (let i = 0; i < render_callbacks.length; i += 1) {
|
|
const callback = render_callbacks[i];
|
|
if (!seen_callbacks.has(callback)) {
|
|
// ...so guard against infinite loops
|
|
seen_callbacks.add(callback);
|
|
callback();
|
|
}
|
|
}
|
|
render_callbacks.length = 0;
|
|
} while (dirty_components.length);
|
|
while (flush_callbacks.length) {
|
|
flush_callbacks.pop()();
|
|
}
|
|
update_scheduled = false;
|
|
flushing = false;
|
|
seen_callbacks.clear();
|
|
}
|
|
function update($$) {
|
|
if ($$.fragment !== null) {
|
|
$$.update();
|
|
run_all($$.before_update);
|
|
const dirty = $$.dirty;
|
|
$$.dirty = [-1];
|
|
$$.fragment && $$.fragment.p($$.ctx, dirty);
|
|
$$.after_update.forEach(add_render_callback);
|
|
}
|
|
}
|
|
|
|
let promise;
|
|
function wait() {
|
|
if (!promise) {
|
|
promise = Promise.resolve();
|
|
promise.then(() => {
|
|
promise = null;
|
|
});
|
|
}
|
|
return promise;
|
|
}
|
|
function dispatch(node, direction, kind) {
|
|
node.dispatchEvent(custom_event(`${direction ? 'intro' : 'outro'}${kind}`));
|
|
}
|
|
const outroing = new Set();
|
|
let outros;
|
|
function group_outros() {
|
|
outros = {
|
|
r: 0,
|
|
c: [],
|
|
p: outros // parent group
|
|
};
|
|
}
|
|
function check_outros() {
|
|
if (!outros.r) {
|
|
run_all(outros.c);
|
|
}
|
|
outros = outros.p;
|
|
}
|
|
function transition_in(block, local) {
|
|
if (block && block.i) {
|
|
outroing.delete(block);
|
|
block.i(local);
|
|
}
|
|
}
|
|
function transition_out(block, local, detach, callback) {
|
|
if (block && block.o) {
|
|
if (outroing.has(block))
|
|
return;
|
|
outroing.add(block);
|
|
outros.c.push(() => {
|
|
outroing.delete(block);
|
|
if (callback) {
|
|
if (detach)
|
|
block.d(1);
|
|
callback();
|
|
}
|
|
});
|
|
block.o(local);
|
|
}
|
|
}
|
|
const null_transition = { duration: 0 };
|
|
function create_bidirectional_transition(node, fn, params, intro) {
|
|
let config = fn(node, params);
|
|
let t = intro ? 0 : 1;
|
|
let running_program = null;
|
|
let pending_program = null;
|
|
let animation_name = null;
|
|
function clear_animation() {
|
|
if (animation_name)
|
|
delete_rule(node, animation_name);
|
|
}
|
|
function init(program, duration) {
|
|
const d = program.b - t;
|
|
duration *= Math.abs(d);
|
|
return {
|
|
a: t,
|
|
b: program.b,
|
|
d,
|
|
duration,
|
|
start: program.start,
|
|
end: program.start + duration,
|
|
group: program.group
|
|
};
|
|
}
|
|
function go(b) {
|
|
const { delay = 0, duration = 300, easing = identity, tick = noop, css } = config || null_transition;
|
|
const program = {
|
|
start: now() + delay,
|
|
b
|
|
};
|
|
if (!b) {
|
|
// @ts-ignore todo: improve typings
|
|
program.group = outros;
|
|
outros.r += 1;
|
|
}
|
|
if (running_program || pending_program) {
|
|
pending_program = program;
|
|
}
|
|
else {
|
|
// if this is an intro, and there's a delay, we need to do
|
|
// an initial tick and/or apply CSS animation immediately
|
|
if (css) {
|
|
clear_animation();
|
|
animation_name = create_rule(node, t, b, duration, delay, easing, css);
|
|
}
|
|
if (b)
|
|
tick(0, 1);
|
|
running_program = init(program, duration);
|
|
add_render_callback(() => dispatch(node, b, 'start'));
|
|
loop(now => {
|
|
if (pending_program && now > pending_program.start) {
|
|
running_program = init(pending_program, duration);
|
|
pending_program = null;
|
|
dispatch(node, running_program.b, 'start');
|
|
if (css) {
|
|
clear_animation();
|
|
animation_name = create_rule(node, t, running_program.b, running_program.duration, 0, easing, config.css);
|
|
}
|
|
}
|
|
if (running_program) {
|
|
if (now >= running_program.end) {
|
|
tick(t = running_program.b, 1 - t);
|
|
dispatch(node, running_program.b, 'end');
|
|
if (!pending_program) {
|
|
// we're done
|
|
if (running_program.b) {
|
|
// intro — we can tidy up immediately
|
|
clear_animation();
|
|
}
|
|
else {
|
|
// outro — needs to be coordinated
|
|
if (!--running_program.group.r)
|
|
run_all(running_program.group.c);
|
|
}
|
|
}
|
|
running_program = null;
|
|
}
|
|
else if (now >= running_program.start) {
|
|
const p = now - running_program.start;
|
|
t = running_program.a + running_program.d * easing(p / running_program.duration);
|
|
tick(t, 1 - t);
|
|
}
|
|
}
|
|
return !!(running_program || pending_program);
|
|
});
|
|
}
|
|
}
|
|
return {
|
|
run(b) {
|
|
if (is_function(config)) {
|
|
wait().then(() => {
|
|
// @ts-ignore
|
|
config = config();
|
|
go(b);
|
|
});
|
|
}
|
|
else {
|
|
go(b);
|
|
}
|
|
},
|
|
end() {
|
|
clear_animation();
|
|
running_program = pending_program = null;
|
|
}
|
|
};
|
|
}
|
|
|
|
const globals = (typeof window !== 'undefined'
|
|
? window
|
|
: typeof globalThis !== 'undefined'
|
|
? globalThis
|
|
: global);
|
|
|
|
function get_spread_update(levels, updates) {
|
|
const update = {};
|
|
const to_null_out = {};
|
|
const accounted_for = { $$scope: 1 };
|
|
let i = levels.length;
|
|
while (i--) {
|
|
const o = levels[i];
|
|
const n = updates[i];
|
|
if (n) {
|
|
for (const key in o) {
|
|
if (!(key in n))
|
|
to_null_out[key] = 1;
|
|
}
|
|
for (const key in n) {
|
|
if (!accounted_for[key]) {
|
|
update[key] = n[key];
|
|
accounted_for[key] = 1;
|
|
}
|
|
}
|
|
levels[i] = n;
|
|
}
|
|
else {
|
|
for (const key in o) {
|
|
accounted_for[key] = 1;
|
|
}
|
|
}
|
|
}
|
|
for (const key in to_null_out) {
|
|
if (!(key in update))
|
|
update[key] = undefined;
|
|
}
|
|
return update;
|
|
}
|
|
function get_spread_object(spread_props) {
|
|
return typeof spread_props === 'object' && spread_props !== null ? spread_props : {};
|
|
}
|
|
function create_component(block) {
|
|
block && block.c();
|
|
}
|
|
function mount_component(component, target, anchor) {
|
|
const { fragment, on_mount, on_destroy, after_update } = component.$$;
|
|
fragment && fragment.m(target, anchor);
|
|
// onMount happens before the initial afterUpdate
|
|
add_render_callback(() => {
|
|
const new_on_destroy = on_mount.map(run).filter(is_function);
|
|
if (on_destroy) {
|
|
on_destroy.push(...new_on_destroy);
|
|
}
|
|
else {
|
|
// Edge case - component was destroyed immediately,
|
|
// most likely as a result of a binding initialising
|
|
run_all(new_on_destroy);
|
|
}
|
|
component.$$.on_mount = [];
|
|
});
|
|
after_update.forEach(add_render_callback);
|
|
}
|
|
function destroy_component(component, detaching) {
|
|
const $$ = component.$$;
|
|
if ($$.fragment !== null) {
|
|
run_all($$.on_destroy);
|
|
$$.fragment && $$.fragment.d(detaching);
|
|
// TODO null out other refs, including component.$$ (but need to
|
|
// preserve final state?)
|
|
$$.on_destroy = $$.fragment = null;
|
|
$$.ctx = [];
|
|
}
|
|
}
|
|
function make_dirty(component, i) {
|
|
if (component.$$.dirty[0] === -1) {
|
|
dirty_components.push(component);
|
|
schedule_update();
|
|
component.$$.dirty.fill(0);
|
|
}
|
|
component.$$.dirty[(i / 31) | 0] |= (1 << (i % 31));
|
|
}
|
|
function init(component, options, instance, create_fragment, not_equal, props, dirty = [-1]) {
|
|
const parent_component = current_component;
|
|
set_current_component(component);
|
|
const prop_values = options.props || {};
|
|
const $$ = component.$$ = {
|
|
fragment: null,
|
|
ctx: null,
|
|
// state
|
|
props,
|
|
update: noop,
|
|
not_equal,
|
|
bound: blank_object(),
|
|
// lifecycle
|
|
on_mount: [],
|
|
on_destroy: [],
|
|
before_update: [],
|
|
after_update: [],
|
|
context: new Map(parent_component ? parent_component.$$.context : []),
|
|
// everything else
|
|
callbacks: blank_object(),
|
|
dirty,
|
|
skip_bound: false
|
|
};
|
|
let ready = false;
|
|
$$.ctx = instance
|
|
? instance(component, prop_values, (i, ret, ...rest) => {
|
|
const value = rest.length ? rest[0] : ret;
|
|
if ($$.ctx && not_equal($$.ctx[i], $$.ctx[i] = value)) {
|
|
if (!$$.skip_bound && $$.bound[i])
|
|
$$.bound[i](value);
|
|
if (ready)
|
|
make_dirty(component, i);
|
|
}
|
|
return ret;
|
|
})
|
|
: [];
|
|
$$.update();
|
|
ready = true;
|
|
run_all($$.before_update);
|
|
// `false` as a special case of no DOM component
|
|
$$.fragment = create_fragment ? create_fragment($$.ctx) : false;
|
|
if (options.target) {
|
|
if (options.hydrate) {
|
|
const nodes = children(options.target);
|
|
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
$$.fragment && $$.fragment.l(nodes);
|
|
nodes.forEach(detach);
|
|
}
|
|
else {
|
|
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
$$.fragment && $$.fragment.c();
|
|
}
|
|
if (options.intro)
|
|
transition_in(component.$$.fragment);
|
|
mount_component(component, options.target, options.anchor);
|
|
flush();
|
|
}
|
|
set_current_component(parent_component);
|
|
}
|
|
class SvelteComponent {
|
|
$destroy() {
|
|
destroy_component(this, 1);
|
|
this.$destroy = noop;
|
|
}
|
|
$on(type, callback) {
|
|
const callbacks = (this.$$.callbacks[type] || (this.$$.callbacks[type] = []));
|
|
callbacks.push(callback);
|
|
return () => {
|
|
const index = callbacks.indexOf(callback);
|
|
if (index !== -1)
|
|
callbacks.splice(index, 1);
|
|
};
|
|
}
|
|
$set($$props) {
|
|
if (this.$$set && !is_empty($$props)) {
|
|
this.$$.skip_bound = true;
|
|
this.$$set($$props);
|
|
this.$$.skip_bound = false;
|
|
}
|
|
}
|
|
}
|
|
|
|
function dispatch_dev(type, detail) {
|
|
document.dispatchEvent(custom_event(type, Object.assign({ version: '3.30.0' }, detail)));
|
|
}
|
|
function append_dev(target, node) {
|
|
dispatch_dev('SvelteDOMInsert', { target, node });
|
|
append(target, node);
|
|
}
|
|
function insert_dev(target, node, anchor) {
|
|
dispatch_dev('SvelteDOMInsert', { target, node, anchor });
|
|
insert(target, node, anchor);
|
|
}
|
|
function detach_dev(node) {
|
|
dispatch_dev('SvelteDOMRemove', { node });
|
|
detach(node);
|
|
}
|
|
function listen_dev(node, event, handler, options, has_prevent_default, has_stop_propagation) {
|
|
const modifiers = options === true ? ['capture'] : options ? Array.from(Object.keys(options)) : [];
|
|
if (has_prevent_default)
|
|
modifiers.push('preventDefault');
|
|
if (has_stop_propagation)
|
|
modifiers.push('stopPropagation');
|
|
dispatch_dev('SvelteDOMAddEventListener', { node, event, handler, modifiers });
|
|
const dispose = listen(node, event, handler, options);
|
|
return () => {
|
|
dispatch_dev('SvelteDOMRemoveEventListener', { node, event, handler, modifiers });
|
|
dispose();
|
|
};
|
|
}
|
|
function attr_dev(node, attribute, value) {
|
|
attr(node, attribute, value);
|
|
if (value == null)
|
|
dispatch_dev('SvelteDOMRemoveAttribute', { node, attribute });
|
|
else
|
|
dispatch_dev('SvelteDOMSetAttribute', { node, attribute, value });
|
|
}
|
|
function validate_each_argument(arg) {
|
|
if (typeof arg !== 'string' && !(arg && typeof arg === 'object' && 'length' in arg)) {
|
|
let msg = '{#each} only iterates over array-like objects.';
|
|
if (typeof Symbol === 'function' && arg && Symbol.iterator in arg) {
|
|
msg += ' You can use a spread to convert this iterable into an array.';
|
|
}
|
|
throw new Error(msg);
|
|
}
|
|
}
|
|
function validate_slots(name, slot, keys) {
|
|
for (const slot_key of Object.keys(slot)) {
|
|
if (!~keys.indexOf(slot_key)) {
|
|
console.warn(`<${name}> received an unexpected slot "${slot_key}".`);
|
|
}
|
|
}
|
|
}
|
|
class SvelteComponentDev extends SvelteComponent {
|
|
constructor(options) {
|
|
if (!options || (!options.target && !options.$$inline)) {
|
|
throw new Error("'target' is a required option");
|
|
}
|
|
super();
|
|
}
|
|
$destroy() {
|
|
super.$destroy();
|
|
this.$destroy = () => {
|
|
console.warn('Component was already destroyed'); // eslint-disable-line no-console
|
|
};
|
|
}
|
|
$capture_state() { }
|
|
$inject_state() { }
|
|
}
|
|
|
|
/**
|
|
* @typedef {Object} WrappedComponent Object returned by the `wrap` method
|
|
* @property {SvelteComponent} component - Component to load (this is always asynchronous)
|
|
* @property {RoutePrecondition[]} [conditions] - Route pre-conditions to validate
|
|
* @property {Object} [props] - Optional dictionary of static props
|
|
* @property {Object} [userData] - Optional user data dictionary
|
|
* @property {bool} _sveltesparouter - Internal flag; always set to true
|
|
*/
|
|
|
|
/**
|
|
* @callback AsyncSvelteComponent
|
|
* @returns {Promise<SvelteComponent>} Returns a Promise that resolves with a Svelte component
|
|
*/
|
|
|
|
/**
|
|
* @callback RoutePrecondition
|
|
* @param {RouteDetail} detail - Route detail object
|
|
* @returns {boolean|Promise<boolean>} If the callback returns a false-y value, it's interpreted as the precondition failed, so it aborts loading the component (and won't process other pre-condition callbacks)
|
|
*/
|
|
|
|
/**
|
|
* @typedef {Object} WrapOptions Options object for the call to `wrap`
|
|
* @property {SvelteComponent} [component] - Svelte component to load (this is incompatible with `asyncComponent`)
|
|
* @property {AsyncSvelteComponent} [asyncComponent] - Function that returns a Promise that fulfills with a Svelte component (e.g. `{asyncComponent: () => import('Foo.svelte')}`)
|
|
* @property {SvelteComponent} [loadingComponent] - Svelte component to be displayed while the async route is loading (as a placeholder); when unset or false-y, no component is shown while component
|
|
* @property {object} [loadingParams] - Optional dictionary passed to the `loadingComponent` component as params (for an exported prop called `params`)
|
|
* @property {object} [userData] - Optional object that will be passed to events such as `routeLoading`, `routeLoaded`, `conditionsFailed`
|
|
* @property {object} [props] - Optional key-value dictionary of static props that will be passed to the component. The props are expanded with {...props}, so the key in the dictionary becomes the name of the prop.
|
|
* @property {RoutePrecondition[]|RoutePrecondition} [conditions] - Route pre-conditions to add, which will be executed in order
|
|
*/
|
|
|
|
/**
|
|
* Wraps a component to enable multiple capabilities:
|
|
* 1. Using dynamically-imported component, with (e.g. `{asyncComponent: () => import('Foo.svelte')}`), which also allows bundlers to do code-splitting.
|
|
* 2. Adding route pre-conditions (e.g. `{conditions: [...]}`)
|
|
* 3. Adding static props that are passed to the component
|
|
* 4. Adding custom userData, which is passed to route events (e.g. route loaded events) or to route pre-conditions (e.g. `{userData: {foo: 'bar}}`)
|
|
*
|
|
* @param {WrapOptions} args - Arguments object
|
|
* @returns {WrappedComponent} Wrapped component
|
|
*/
|
|
function wrap(args) {
|
|
if (!args) {
|
|
throw Error('Parameter args is required')
|
|
}
|
|
|
|
// We need to have one and only one of component and asyncComponent
|
|
// This does a "XNOR"
|
|
if (!args.component == !args.asyncComponent) {
|
|
throw Error('One and only one of component and asyncComponent is required')
|
|
}
|
|
|
|
// If the component is not async, wrap it into a function returning a Promise
|
|
if (args.component) {
|
|
args.asyncComponent = () => Promise.resolve(args.component);
|
|
}
|
|
|
|
// Parameter asyncComponent and each item of conditions must be functions
|
|
if (typeof args.asyncComponent != 'function') {
|
|
throw Error('Parameter asyncComponent must be a function')
|
|
}
|
|
if (args.conditions) {
|
|
// Ensure it's an array
|
|
if (!Array.isArray(args.conditions)) {
|
|
args.conditions = [args.conditions];
|
|
}
|
|
for (let i = 0; i < args.conditions.length; i++) {
|
|
if (!args.conditions[i] || typeof args.conditions[i] != 'function') {
|
|
throw Error('Invalid parameter conditions[' + i + ']')
|
|
}
|
|
}
|
|
}
|
|
|
|
// Check if we have a placeholder component
|
|
if (args.loadingComponent) {
|
|
args.asyncComponent.loading = args.loadingComponent;
|
|
args.asyncComponent.loadingParams = args.loadingParams || undefined;
|
|
}
|
|
|
|
// Returns an object that contains all the functions to execute too
|
|
// The _sveltesparouter flag is to confirm the object was created by this router
|
|
const obj = {
|
|
component: args.asyncComponent,
|
|
userData: args.userData,
|
|
conditions: (args.conditions && args.conditions.length) ? args.conditions : undefined,
|
|
props: (args.props && Object.keys(args.props).length) ? args.props : {},
|
|
_sveltesparouter: true
|
|
};
|
|
|
|
return obj
|
|
}
|
|
|
|
const subscriber_queue = [];
|
|
/**
|
|
* Creates a `Readable` store that allows reading by subscription.
|
|
* @param value initial value
|
|
* @param {StartStopNotifier}start start and stop notifications for subscriptions
|
|
*/
|
|
function readable(value, start) {
|
|
return {
|
|
subscribe: writable(value, start).subscribe
|
|
};
|
|
}
|
|
/**
|
|
* Create a `Writable` store that allows both updating and reading by subscription.
|
|
* @param {*=}value initial value
|
|
* @param {StartStopNotifier=}start start and stop notifications for subscriptions
|
|
*/
|
|
function writable(value, start = noop) {
|
|
let stop;
|
|
const subscribers = [];
|
|
function set(new_value) {
|
|
if (safe_not_equal(value, new_value)) {
|
|
value = new_value;
|
|
if (stop) { // store is ready
|
|
const run_queue = !subscriber_queue.length;
|
|
for (let i = 0; i < subscribers.length; i += 1) {
|
|
const s = subscribers[i];
|
|
s[1]();
|
|
subscriber_queue.push(s, value);
|
|
}
|
|
if (run_queue) {
|
|
for (let i = 0; i < subscriber_queue.length; i += 2) {
|
|
subscriber_queue[i][0](subscriber_queue[i + 1]);
|
|
}
|
|
subscriber_queue.length = 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
function update(fn) {
|
|
set(fn(value));
|
|
}
|
|
function subscribe(run, invalidate = noop) {
|
|
const subscriber = [run, invalidate];
|
|
subscribers.push(subscriber);
|
|
if (subscribers.length === 1) {
|
|
stop = start(set) || noop;
|
|
}
|
|
run(value);
|
|
return () => {
|
|
const index = subscribers.indexOf(subscriber);
|
|
if (index !== -1) {
|
|
subscribers.splice(index, 1);
|
|
}
|
|
if (subscribers.length === 0) {
|
|
stop();
|
|
stop = null;
|
|
}
|
|
};
|
|
}
|
|
return { set, update, subscribe };
|
|
}
|
|
function derived(stores, fn, initial_value) {
|
|
const single = !Array.isArray(stores);
|
|
const stores_array = single
|
|
? [stores]
|
|
: stores;
|
|
const auto = fn.length < 2;
|
|
return readable(initial_value, (set) => {
|
|
let inited = false;
|
|
const values = [];
|
|
let pending = 0;
|
|
let cleanup = noop;
|
|
const sync = () => {
|
|
if (pending) {
|
|
return;
|
|
}
|
|
cleanup();
|
|
const result = fn(single ? values[0] : values, set);
|
|
if (auto) {
|
|
set(result);
|
|
}
|
|
else {
|
|
cleanup = is_function(result) ? result : noop;
|
|
}
|
|
};
|
|
const unsubscribers = stores_array.map((store, i) => subscribe(store, (value) => {
|
|
values[i] = value;
|
|
pending &= ~(1 << i);
|
|
if (inited) {
|
|
sync();
|
|
}
|
|
}, () => {
|
|
pending |= (1 << i);
|
|
}));
|
|
inited = true;
|
|
sync();
|
|
return function stop() {
|
|
run_all(unsubscribers);
|
|
cleanup();
|
|
};
|
|
});
|
|
}
|
|
|
|
function regexparam (str, loose) {
|
|
if (str instanceof RegExp) return { keys:false, pattern:str };
|
|
var c, o, tmp, ext, keys=[], pattern='', arr = str.split('/');
|
|
arr[0] || arr.shift();
|
|
|
|
while (tmp = arr.shift()) {
|
|
c = tmp[0];
|
|
if (c === '*') {
|
|
keys.push('wild');
|
|
pattern += '/(.*)';
|
|
} else if (c === ':') {
|
|
o = tmp.indexOf('?', 1);
|
|
ext = tmp.indexOf('.', 1);
|
|
keys.push( tmp.substring(1, !!~o ? o : !!~ext ? ext : tmp.length) );
|
|
pattern += !!~o && !~ext ? '(?:/([^/]+?))?' : '/([^/]+?)';
|
|
if (!!~ext) pattern += (!!~o ? '?' : '') + '\\' + tmp.substring(ext);
|
|
} else {
|
|
pattern += '/' + tmp;
|
|
}
|
|
}
|
|
|
|
return {
|
|
keys: keys,
|
|
pattern: new RegExp('^' + pattern + (loose ? '(?=$|\/)' : '\/?$'), 'i')
|
|
};
|
|
}
|
|
|
|
/* node_modules/svelte-spa-router/Router.svelte generated by Svelte v3.30.0 */
|
|
|
|
const { Error: Error_1, Object: Object_1, console: console_1 } = globals;
|
|
|
|
// (209:0) {:else}
|
|
function create_else_block(ctx) {
|
|
let switch_instance;
|
|
let switch_instance_anchor;
|
|
let current;
|
|
const switch_instance_spread_levels = [/*props*/ ctx[2]];
|
|
var switch_value = /*component*/ ctx[0];
|
|
|
|
function switch_props(ctx) {
|
|
let switch_instance_props = {};
|
|
|
|
for (let i = 0; i < switch_instance_spread_levels.length; i += 1) {
|
|
switch_instance_props = assign(switch_instance_props, switch_instance_spread_levels[i]);
|
|
}
|
|
|
|
return {
|
|
props: switch_instance_props,
|
|
$$inline: true
|
|
};
|
|
}
|
|
|
|
if (switch_value) {
|
|
switch_instance = new switch_value(switch_props());
|
|
switch_instance.$on("routeEvent", /*routeEvent_handler_1*/ ctx[7]);
|
|
}
|
|
|
|
const block = {
|
|
c: function create() {
|
|
if (switch_instance) create_component(switch_instance.$$.fragment);
|
|
switch_instance_anchor = empty();
|
|
},
|
|
m: function mount(target, anchor) {
|
|
if (switch_instance) {
|
|
mount_component(switch_instance, target, anchor);
|
|
}
|
|
|
|
insert_dev(target, switch_instance_anchor, anchor);
|
|
current = true;
|
|
},
|
|
p: function update(ctx, dirty) {
|
|
const switch_instance_changes = (dirty & /*props*/ 4)
|
|
? get_spread_update(switch_instance_spread_levels, [get_spread_object(/*props*/ ctx[2])])
|
|
: {};
|
|
|
|
if (switch_value !== (switch_value = /*component*/ ctx[0])) {
|
|
if (switch_instance) {
|
|
group_outros();
|
|
const old_component = switch_instance;
|
|
|
|
transition_out(old_component.$$.fragment, 1, 0, () => {
|
|
destroy_component(old_component, 1);
|
|
});
|
|
|
|
check_outros();
|
|
}
|
|
|
|
if (switch_value) {
|
|
switch_instance = new switch_value(switch_props());
|
|
switch_instance.$on("routeEvent", /*routeEvent_handler_1*/ ctx[7]);
|
|
create_component(switch_instance.$$.fragment);
|
|
transition_in(switch_instance.$$.fragment, 1);
|
|
mount_component(switch_instance, switch_instance_anchor.parentNode, switch_instance_anchor);
|
|
} else {
|
|
switch_instance = null;
|
|
}
|
|
} else if (switch_value) {
|
|
switch_instance.$set(switch_instance_changes);
|
|
}
|
|
},
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
if (switch_instance) transition_in(switch_instance.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
if (switch_instance) transition_out(switch_instance.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(switch_instance_anchor);
|
|
if (switch_instance) destroy_component(switch_instance, detaching);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_else_block.name,
|
|
type: "else",
|
|
source: "(209:0) {:else}",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
// (202:0) {#if componentParams}
|
|
function create_if_block(ctx) {
|
|
let switch_instance;
|
|
let switch_instance_anchor;
|
|
let current;
|
|
const switch_instance_spread_levels = [{ params: /*componentParams*/ ctx[1] }, /*props*/ ctx[2]];
|
|
var switch_value = /*component*/ ctx[0];
|
|
|
|
function switch_props(ctx) {
|
|
let switch_instance_props = {};
|
|
|
|
for (let i = 0; i < switch_instance_spread_levels.length; i += 1) {
|
|
switch_instance_props = assign(switch_instance_props, switch_instance_spread_levels[i]);
|
|
}
|
|
|
|
return {
|
|
props: switch_instance_props,
|
|
$$inline: true
|
|
};
|
|
}
|
|
|
|
if (switch_value) {
|
|
switch_instance = new switch_value(switch_props());
|
|
switch_instance.$on("routeEvent", /*routeEvent_handler*/ ctx[6]);
|
|
}
|
|
|
|
const block = {
|
|
c: function create() {
|
|
if (switch_instance) create_component(switch_instance.$$.fragment);
|
|
switch_instance_anchor = empty();
|
|
},
|
|
m: function mount(target, anchor) {
|
|
if (switch_instance) {
|
|
mount_component(switch_instance, target, anchor);
|
|
}
|
|
|
|
insert_dev(target, switch_instance_anchor, anchor);
|
|
current = true;
|
|
},
|
|
p: function update(ctx, dirty) {
|
|
const switch_instance_changes = (dirty & /*componentParams, props*/ 6)
|
|
? get_spread_update(switch_instance_spread_levels, [
|
|
dirty & /*componentParams*/ 2 && { params: /*componentParams*/ ctx[1] },
|
|
dirty & /*props*/ 4 && get_spread_object(/*props*/ ctx[2])
|
|
])
|
|
: {};
|
|
|
|
if (switch_value !== (switch_value = /*component*/ ctx[0])) {
|
|
if (switch_instance) {
|
|
group_outros();
|
|
const old_component = switch_instance;
|
|
|
|
transition_out(old_component.$$.fragment, 1, 0, () => {
|
|
destroy_component(old_component, 1);
|
|
});
|
|
|
|
check_outros();
|
|
}
|
|
|
|
if (switch_value) {
|
|
switch_instance = new switch_value(switch_props());
|
|
switch_instance.$on("routeEvent", /*routeEvent_handler*/ ctx[6]);
|
|
create_component(switch_instance.$$.fragment);
|
|
transition_in(switch_instance.$$.fragment, 1);
|
|
mount_component(switch_instance, switch_instance_anchor.parentNode, switch_instance_anchor);
|
|
} else {
|
|
switch_instance = null;
|
|
}
|
|
} else if (switch_value) {
|
|
switch_instance.$set(switch_instance_changes);
|
|
}
|
|
},
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
if (switch_instance) transition_in(switch_instance.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
if (switch_instance) transition_out(switch_instance.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(switch_instance_anchor);
|
|
if (switch_instance) destroy_component(switch_instance, detaching);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_if_block.name,
|
|
type: "if",
|
|
source: "(202:0) {#if componentParams}",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function create_fragment(ctx) {
|
|
let current_block_type_index;
|
|
let if_block;
|
|
let if_block_anchor;
|
|
let current;
|
|
const if_block_creators = [create_if_block, create_else_block];
|
|
const if_blocks = [];
|
|
|
|
function select_block_type(ctx, dirty) {
|
|
if (/*componentParams*/ ctx[1]) return 0;
|
|
return 1;
|
|
}
|
|
|
|
current_block_type_index = select_block_type(ctx);
|
|
if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx);
|
|
|
|
const block = {
|
|
c: function create() {
|
|
if_block.c();
|
|
if_block_anchor = empty();
|
|
},
|
|
l: function claim(nodes) {
|
|
throw new Error_1("options.hydrate only works if the component was compiled with the `hydratable: true` option");
|
|
},
|
|
m: function mount(target, anchor) {
|
|
if_blocks[current_block_type_index].m(target, anchor);
|
|
insert_dev(target, if_block_anchor, anchor);
|
|
current = true;
|
|
},
|
|
p: function update(ctx, [dirty]) {
|
|
let previous_block_index = current_block_type_index;
|
|
current_block_type_index = select_block_type(ctx);
|
|
|
|
if (current_block_type_index === previous_block_index) {
|
|
if_blocks[current_block_type_index].p(ctx, dirty);
|
|
} else {
|
|
group_outros();
|
|
|
|
transition_out(if_blocks[previous_block_index], 1, 1, () => {
|
|
if_blocks[previous_block_index] = null;
|
|
});
|
|
|
|
check_outros();
|
|
if_block = if_blocks[current_block_type_index];
|
|
|
|
if (!if_block) {
|
|
if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx);
|
|
if_block.c();
|
|
} else {
|
|
if_block.p(ctx, dirty);
|
|
}
|
|
|
|
transition_in(if_block, 1);
|
|
if_block.m(if_block_anchor.parentNode, if_block_anchor);
|
|
}
|
|
},
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(if_block);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(if_block);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if_blocks[current_block_type_index].d(detaching);
|
|
if (detaching) detach_dev(if_block_anchor);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function wrap$1(component, userData, ...conditions) {
|
|
// Use the new wrap method and show a deprecation warning
|
|
// eslint-disable-next-line no-console
|
|
console.warn("Method `wrap` from `svelte-spa-router` is deprecated and will be removed in a future version. Please use `svelte-spa-router/wrap` instead. See http://bit.ly/svelte-spa-router-upgrading");
|
|
|
|
return wrap({ component, userData, conditions });
|
|
}
|
|
|
|
/**
|
|
* @typedef {Object} Location
|
|
* @property {string} location - Location (page/view), for example `/book`
|
|
* @property {string} [querystring] - Querystring from the hash, as a string not parsed
|
|
*/
|
|
/**
|
|
* Returns the current location from the hash.
|
|
*
|
|
* @returns {Location} Location object
|
|
* @private
|
|
*/
|
|
function getLocation() {
|
|
const hashPosition = window.location.href.indexOf("#/");
|
|
|
|
let location = hashPosition > -1
|
|
? window.location.href.substr(hashPosition + 1)
|
|
: "/";
|
|
|
|
// Check if there's a querystring
|
|
const qsPosition = location.indexOf("?");
|
|
|
|
let querystring = "";
|
|
|
|
if (qsPosition > -1) {
|
|
querystring = location.substr(qsPosition + 1);
|
|
location = location.substr(0, qsPosition);
|
|
}
|
|
|
|
return { location, querystring };
|
|
}
|
|
|
|
const loc = readable(null, // eslint-disable-next-line prefer-arrow-callback
|
|
function start(set) {
|
|
set(getLocation());
|
|
|
|
const update = () => {
|
|
set(getLocation());
|
|
};
|
|
|
|
window.addEventListener("hashchange", update, false);
|
|
|
|
return function stop() {
|
|
window.removeEventListener("hashchange", update, false);
|
|
};
|
|
});
|
|
|
|
const location = derived(loc, $loc => $loc.location);
|
|
const querystring = derived(loc, $loc => $loc.querystring);
|
|
|
|
async function push(location) {
|
|
if (!location || location.length < 1 || location.charAt(0) != "/" && location.indexOf("#/") !== 0) {
|
|
throw Error("Invalid parameter location");
|
|
}
|
|
|
|
// Execute this code when the current call stack is complete
|
|
await tick();
|
|
|
|
// Note: this will include scroll state in history even when restoreScrollState is false
|
|
history.replaceState(
|
|
{
|
|
scrollX: window.scrollX,
|
|
scrollY: window.scrollY
|
|
},
|
|
undefined,
|
|
undefined
|
|
);
|
|
|
|
window.location.hash = (location.charAt(0) == "#" ? "" : "#") + location;
|
|
}
|
|
|
|
async function pop() {
|
|
// Execute this code when the current call stack is complete
|
|
await tick();
|
|
|
|
window.history.back();
|
|
}
|
|
|
|
async function replace(location) {
|
|
if (!location || location.length < 1 || location.charAt(0) != "/" && location.indexOf("#/") !== 0) {
|
|
throw Error("Invalid parameter location");
|
|
}
|
|
|
|
// Execute this code when the current call stack is complete
|
|
await tick();
|
|
|
|
const dest = (location.charAt(0) == "#" ? "" : "#") + location;
|
|
|
|
try {
|
|
window.history.replaceState(undefined, undefined, dest);
|
|
} catch(e) {
|
|
// eslint-disable-next-line no-console
|
|
console.warn("Caught exception while replacing the current page. If you're running this in the Svelte REPL, please note that the `replace` method might not work in this environment.");
|
|
}
|
|
|
|
// The method above doesn't trigger the hashchange event, so let's do that manually
|
|
window.dispatchEvent(new Event("hashchange"));
|
|
}
|
|
|
|
function link(node, hrefVar) {
|
|
// Only apply to <a> tags
|
|
if (!node || !node.tagName || node.tagName.toLowerCase() != "a") {
|
|
throw Error("Action \"link\" can only be used with <a> tags");
|
|
}
|
|
|
|
updateLink(node, hrefVar || node.getAttribute("href"));
|
|
|
|
return {
|
|
update(updated) {
|
|
updateLink(node, updated);
|
|
}
|
|
};
|
|
}
|
|
|
|
// Internal function used by the link function
|
|
function updateLink(node, href) {
|
|
// Destination must start with '/'
|
|
if (!href || href.length < 1 || href.charAt(0) != "/") {
|
|
throw Error("Invalid value for \"href\" attribute: " + href);
|
|
}
|
|
|
|
// Add # to the href attribute
|
|
node.setAttribute("href", "#" + href);
|
|
|
|
node.addEventListener("click", scrollstateHistoryHandler);
|
|
}
|
|
|
|
/**
|
|
* The handler attached to an anchor tag responsible for updating the
|
|
* current history state with the current scroll state
|
|
*
|
|
* @param {HTMLElementEventMap} event - an onclick event attached to an anchor tag
|
|
*/
|
|
function scrollstateHistoryHandler(event) {
|
|
// Prevent default anchor onclick behaviour
|
|
event.preventDefault();
|
|
|
|
const href = event.currentTarget.getAttribute("href");
|
|
|
|
// Setting the url (3rd arg) to href will break clicking for reasons, so don't try to do that
|
|
history.replaceState(
|
|
{
|
|
scrollX: window.scrollX,
|
|
scrollY: window.scrollY
|
|
},
|
|
undefined,
|
|
undefined
|
|
);
|
|
|
|
// This will force an update as desired, but this time our scroll state will be attached
|
|
window.location.hash = href;
|
|
}
|
|
|
|
function instance($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Router", slots, []);
|
|
let { routes = {} } = $$props;
|
|
let { prefix = "" } = $$props;
|
|
let { restoreScrollState = false } = $$props;
|
|
|
|
/**
|
|
* Container for a route: path, component
|
|
*/
|
|
class RouteItem {
|
|
/**
|
|
* Initializes the object and creates a regular expression from the path, using regexparam.
|
|
*
|
|
* @param {string} path - Path to the route (must start with '/' or '*')
|
|
* @param {SvelteComponent|WrappedComponent} component - Svelte component for the route, optionally wrapped
|
|
*/
|
|
constructor(path, component) {
|
|
if (!component || typeof component != "function" && (typeof component != "object" || component._sveltesparouter !== true)) {
|
|
throw Error("Invalid component object");
|
|
}
|
|
|
|
// Path must be a regular or expression, or a string starting with '/' or '*'
|
|
if (!path || typeof path == "string" && (path.length < 1 || path.charAt(0) != "/" && path.charAt(0) != "*") || typeof path == "object" && !(path instanceof RegExp)) {
|
|
throw Error("Invalid value for \"path\" argument");
|
|
}
|
|
|
|
const { pattern, keys } = regexparam(path);
|
|
this.path = path;
|
|
|
|
// Check if the component is wrapped and we have conditions
|
|
if (typeof component == "object" && component._sveltesparouter === true) {
|
|
this.component = component.component;
|
|
this.conditions = component.conditions || [];
|
|
this.userData = component.userData;
|
|
this.props = component.props || {};
|
|
} else {
|
|
// Convert the component to a function that returns a Promise, to normalize it
|
|
this.component = () => Promise.resolve(component);
|
|
|
|
this.conditions = [];
|
|
this.props = {};
|
|
}
|
|
|
|
this._pattern = pattern;
|
|
this._keys = keys;
|
|
}
|
|
|
|
/**
|
|
* Checks if `path` matches the current route.
|
|
* If there's a match, will return the list of parameters from the URL (if any).
|
|
* In case of no match, the method will return `null`.
|
|
*
|
|
* @param {string} path - Path to test
|
|
* @returns {null|Object.<string, string>} List of paramters from the URL if there's a match, or `null` otherwise.
|
|
*/
|
|
match(path) {
|
|
// If there's a prefix, remove it before we run the matching
|
|
if (prefix) {
|
|
if (typeof prefix == "string" && path.startsWith(prefix)) {
|
|
path = path.substr(prefix.length) || "/";
|
|
} else if (prefix instanceof RegExp) {
|
|
const match = path.match(prefix);
|
|
|
|
if (match && match[0]) {
|
|
path = path.substr(match[0].length) || "/";
|
|
}
|
|
}
|
|
}
|
|
|
|
// Check if the pattern matches
|
|
const matches = this._pattern.exec(path);
|
|
|
|
if (matches === null) {
|
|
return null;
|
|
}
|
|
|
|
// If the input was a regular expression, this._keys would be false, so return matches as is
|
|
if (this._keys === false) {
|
|
return matches;
|
|
}
|
|
|
|
const out = {};
|
|
let i = 0;
|
|
|
|
while (i < this._keys.length) {
|
|
// In the match parameters, URL-decode all values
|
|
try {
|
|
out[this._keys[i]] = decodeURIComponent(matches[i + 1] || "") || null;
|
|
} catch(e) {
|
|
out[this._keys[i]] = null;
|
|
}
|
|
|
|
i++;
|
|
}
|
|
|
|
return out;
|
|
}
|
|
|
|
/**
|
|
* Dictionary with route details passed to the pre-conditions functions, as well as the `routeLoading`, `routeLoaded` and `conditionsFailed` events
|
|
* @typedef {Object} RouteDetail
|
|
* @property {string|RegExp} route - Route matched as defined in the route definition (could be a string or a reguar expression object)
|
|
* @property {string} location - Location path
|
|
* @property {string} querystring - Querystring from the hash
|
|
* @property {object} [userData] - Custom data passed by the user
|
|
* @property {SvelteComponent} [component] - Svelte component (only in `routeLoaded` events)
|
|
* @property {string} [name] - Name of the Svelte component (only in `routeLoaded` events)
|
|
*/
|
|
/**
|
|
* Executes all conditions (if any) to control whether the route can be shown. Conditions are executed in the order they are defined, and if a condition fails, the following ones aren't executed.
|
|
*
|
|
* @param {RouteDetail} detail - Route detail
|
|
* @returns {bool} Returns true if all the conditions succeeded
|
|
*/
|
|
async checkConditions(detail) {
|
|
for (let i = 0; i < this.conditions.length; i++) {
|
|
if (!await this.conditions[i](detail)) {
|
|
return false;
|
|
}
|
|
}
|
|
|
|
return true;
|
|
}
|
|
}
|
|
|
|
// Set up all routes
|
|
const routesList = [];
|
|
|
|
if (routes instanceof Map) {
|
|
// If it's a map, iterate on it right away
|
|
routes.forEach((route, path) => {
|
|
routesList.push(new RouteItem(path, route));
|
|
});
|
|
} else {
|
|
// We have an object, so iterate on its own properties
|
|
Object.keys(routes).forEach(path => {
|
|
routesList.push(new RouteItem(path, routes[path]));
|
|
});
|
|
}
|
|
|
|
// Props for the component to render
|
|
let component = null;
|
|
|
|
let componentParams = null;
|
|
let props = {};
|
|
|
|
// Event dispatcher from Svelte
|
|
const dispatch = createEventDispatcher();
|
|
|
|
// Just like dispatch, but executes on the next iteration of the event loop
|
|
async function dispatchNextTick(name, detail) {
|
|
// Execute this code when the current call stack is complete
|
|
await tick();
|
|
|
|
dispatch(name, detail);
|
|
}
|
|
|
|
// If this is set, then that means we have popped into this var the state of our last scroll position
|
|
let previousScrollState = null;
|
|
|
|
if (restoreScrollState) {
|
|
window.addEventListener("popstate", event => {
|
|
// If this event was from our history.replaceState, event.state will contain
|
|
// our scroll history. Otherwise, event.state will be null (like on forward
|
|
// navigation)
|
|
if (event.state && event.state.scrollY) {
|
|
previousScrollState = event.state;
|
|
} else {
|
|
previousScrollState = null;
|
|
}
|
|
});
|
|
|
|
afterUpdate(() => {
|
|
// If this exists, then this is a back navigation: restore the scroll position
|
|
if (previousScrollState) {
|
|
window.scrollTo(previousScrollState.scrollX, previousScrollState.scrollY);
|
|
} else {
|
|
// Otherwise this is a forward navigation: scroll to top
|
|
window.scrollTo(0, 0);
|
|
}
|
|
});
|
|
}
|
|
|
|
// Always have the latest value of loc
|
|
let lastLoc = null;
|
|
|
|
// Current object of the component loaded
|
|
let componentObj = null;
|
|
|
|
// Handle hash change events
|
|
// Listen to changes in the $loc store and update the page
|
|
// Do not use the $: syntax because it gets triggered by too many things
|
|
loc.subscribe(async newLoc => {
|
|
lastLoc = newLoc;
|
|
|
|
// Find a route matching the location
|
|
let i = 0;
|
|
|
|
while (i < routesList.length) {
|
|
const match = routesList[i].match(newLoc.location);
|
|
|
|
if (!match) {
|
|
i++;
|
|
continue;
|
|
}
|
|
|
|
const detail = {
|
|
route: routesList[i].path,
|
|
location: newLoc.location,
|
|
querystring: newLoc.querystring,
|
|
userData: routesList[i].userData
|
|
};
|
|
|
|
// Check if the route can be loaded - if all conditions succeed
|
|
if (!await routesList[i].checkConditions(detail)) {
|
|
// Don't display anything
|
|
$$invalidate(0, component = null);
|
|
|
|
componentObj = null;
|
|
|
|
// Trigger an event to notify the user, then exit
|
|
dispatchNextTick("conditionsFailed", detail);
|
|
|
|
return;
|
|
}
|
|
|
|
// Trigger an event to alert that we're loading the route
|
|
// We need to clone the object on every event invocation so we don't risk the object to be modified in the next tick
|
|
dispatchNextTick("routeLoading", Object.assign({}, detail));
|
|
|
|
// If there's a component to show while we're loading the route, display it
|
|
const obj = routesList[i].component;
|
|
|
|
// Do not replace the component if we're loading the same one as before, to avoid the route being unmounted and re-mounted
|
|
if (componentObj != obj) {
|
|
if (obj.loading) {
|
|
$$invalidate(0, component = obj.loading);
|
|
componentObj = obj;
|
|
$$invalidate(1, componentParams = obj.loadingParams);
|
|
$$invalidate(2, props = {});
|
|
|
|
// Trigger the routeLoaded event for the loading component
|
|
// Create a copy of detail so we don't modify the object for the dynamic route (and the dynamic route doesn't modify our object too)
|
|
dispatchNextTick("routeLoaded", Object.assign({}, detail, { component, name: component.name }));
|
|
} else {
|
|
$$invalidate(0, component = null);
|
|
componentObj = null;
|
|
}
|
|
|
|
// Invoke the Promise
|
|
const loaded = await obj();
|
|
|
|
// Now that we're here, after the promise resolved, check if we still want this component, as the user might have navigated to another page in the meanwhile
|
|
if (newLoc != lastLoc) {
|
|
// Don't update the component, just exit
|
|
return;
|
|
}
|
|
|
|
// If there is a "default" property, which is used by async routes, then pick that
|
|
$$invalidate(0, component = loaded && loaded.default || loaded);
|
|
|
|
componentObj = obj;
|
|
}
|
|
|
|
// Set componentParams only if we have a match, to avoid a warning similar to `<Component> was created with unknown prop 'params'`
|
|
// Of course, this assumes that developers always add a "params" prop when they are expecting parameters
|
|
if (match && typeof match == "object" && Object.keys(match).length) {
|
|
$$invalidate(1, componentParams = match);
|
|
} else {
|
|
$$invalidate(1, componentParams = null);
|
|
}
|
|
|
|
// Set static props, if any
|
|
$$invalidate(2, props = routesList[i].props);
|
|
|
|
// Dispatch the routeLoaded event then exit
|
|
// We need to clone the object on every event invocation so we don't risk the object to be modified in the next tick
|
|
dispatchNextTick("routeLoaded", Object.assign({}, detail, { component, name: component.name }));
|
|
|
|
return;
|
|
}
|
|
|
|
// If we're still here, there was no match, so show the empty component
|
|
$$invalidate(0, component = null);
|
|
|
|
componentObj = null;
|
|
});
|
|
|
|
const writable_props = ["routes", "prefix", "restoreScrollState"];
|
|
|
|
Object_1.keys($$props).forEach(key => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console_1.warn(`<Router> was created with unknown prop '${key}'`);
|
|
});
|
|
|
|
function routeEvent_handler(event) {
|
|
bubble($$self, event);
|
|
}
|
|
|
|
function routeEvent_handler_1(event) {
|
|
bubble($$self, event);
|
|
}
|
|
|
|
$$self.$$set = $$props => {
|
|
if ("routes" in $$props) $$invalidate(3, routes = $$props.routes);
|
|
if ("prefix" in $$props) $$invalidate(4, prefix = $$props.prefix);
|
|
if ("restoreScrollState" in $$props) $$invalidate(5, restoreScrollState = $$props.restoreScrollState);
|
|
};
|
|
|
|
$$self.$capture_state = () => ({
|
|
readable,
|
|
derived,
|
|
tick,
|
|
_wrap: wrap,
|
|
wrap: wrap$1,
|
|
getLocation,
|
|
loc,
|
|
location,
|
|
querystring,
|
|
push,
|
|
pop,
|
|
replace,
|
|
link,
|
|
updateLink,
|
|
scrollstateHistoryHandler,
|
|
createEventDispatcher,
|
|
afterUpdate,
|
|
regexparam,
|
|
routes,
|
|
prefix,
|
|
restoreScrollState,
|
|
RouteItem,
|
|
routesList,
|
|
component,
|
|
componentParams,
|
|
props,
|
|
dispatch,
|
|
dispatchNextTick,
|
|
previousScrollState,
|
|
lastLoc,
|
|
componentObj
|
|
});
|
|
|
|
$$self.$inject_state = $$props => {
|
|
if ("routes" in $$props) $$invalidate(3, routes = $$props.routes);
|
|
if ("prefix" in $$props) $$invalidate(4, prefix = $$props.prefix);
|
|
if ("restoreScrollState" in $$props) $$invalidate(5, restoreScrollState = $$props.restoreScrollState);
|
|
if ("component" in $$props) $$invalidate(0, component = $$props.component);
|
|
if ("componentParams" in $$props) $$invalidate(1, componentParams = $$props.componentParams);
|
|
if ("props" in $$props) $$invalidate(2, props = $$props.props);
|
|
if ("previousScrollState" in $$props) previousScrollState = $$props.previousScrollState;
|
|
if ("lastLoc" in $$props) lastLoc = $$props.lastLoc;
|
|
if ("componentObj" in $$props) componentObj = $$props.componentObj;
|
|
};
|
|
|
|
if ($$props && "$$inject" in $$props) {
|
|
$$self.$inject_state($$props.$$inject);
|
|
}
|
|
|
|
$$self.$$.update = () => {
|
|
if ($$self.$$.dirty & /*restoreScrollState*/ 32) {
|
|
// Update history.scrollRestoration depending on restoreScrollState
|
|
history.scrollRestoration = restoreScrollState ? "manual" : "auto";
|
|
}
|
|
};
|
|
|
|
return [
|
|
component,
|
|
componentParams,
|
|
props,
|
|
routes,
|
|
prefix,
|
|
restoreScrollState,
|
|
routeEvent_handler,
|
|
routeEvent_handler_1
|
|
];
|
|
}
|
|
|
|
class Router extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
|
|
init(this, options, instance, create_fragment, safe_not_equal, {
|
|
routes: 3,
|
|
prefix: 4,
|
|
restoreScrollState: 5
|
|
});
|
|
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Router",
|
|
options,
|
|
id: create_fragment.name
|
|
});
|
|
}
|
|
|
|
get routes() {
|
|
throw new Error_1("<Router>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
set routes(value) {
|
|
throw new Error_1("<Router>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
get prefix() {
|
|
throw new Error_1("<Router>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
set prefix(value) {
|
|
throw new Error_1("<Router>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
get restoreScrollState() {
|
|
throw new Error_1("<Router>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
set restoreScrollState(value) {
|
|
throw new Error_1("<Router>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
}
|
|
|
|
/* src/components/Icon.svelte generated by Svelte v3.30.0 */
|
|
|
|
const file = "src/components/Icon.svelte";
|
|
|
|
function create_fragment$1(ctx) {
|
|
let span;
|
|
let svg;
|
|
let use;
|
|
let use_xlink_href_value;
|
|
let svg_class_value;
|
|
let svg_stroke_value;
|
|
|
|
const block = {
|
|
c: function create() {
|
|
span = element("span");
|
|
svg = svg_element("svg");
|
|
use = svg_element("use");
|
|
xlink_attr(use, "xlink:href", use_xlink_href_value = "/icons/feather-sprite.svg#" + /*name*/ ctx[7]);
|
|
add_location(use, file, 32, 2, 670);
|
|
attr_dev(svg, "class", svg_class_value = "icon-" + /*name*/ ctx[7] + " svelte-1iby9by");
|
|
attr_dev(svg, "width", /*size*/ ctx[0]);
|
|
attr_dev(svg, "height", /*size*/ ctx[0]);
|
|
attr_dev(svg, "fill", /*fill*/ ctx[1]);
|
|
|
|
attr_dev(svg, "stroke", svg_stroke_value = /*light*/ ctx[3]
|
|
? /*light_color*/ ctx[9]
|
|
: /*color*/ ctx[2]);
|
|
|
|
attr_dev(svg, "stroke-width", /*width*/ ctx[4]);
|
|
attr_dev(svg, "stroke-linecap", /*linecap*/ ctx[5]);
|
|
attr_dev(svg, "stroke-linejoin", /*linejoin*/ ctx[6]);
|
|
toggle_class(svg, "inactive", /*inactive*/ ctx[8]);
|
|
add_location(svg, file, 23, 2, 436);
|
|
add_location(span, file, 22, 0, 427);
|
|
},
|
|
l: function claim(nodes) {
|
|
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, span, anchor);
|
|
append_dev(span, svg);
|
|
append_dev(svg, use);
|
|
},
|
|
p: function update(ctx, [dirty]) {
|
|
if (dirty & /*name*/ 128 && use_xlink_href_value !== (use_xlink_href_value = "/icons/feather-sprite.svg#" + /*name*/ ctx[7])) {
|
|
xlink_attr(use, "xlink:href", use_xlink_href_value);
|
|
}
|
|
|
|
if (dirty & /*name*/ 128 && svg_class_value !== (svg_class_value = "icon-" + /*name*/ ctx[7] + " svelte-1iby9by")) {
|
|
attr_dev(svg, "class", svg_class_value);
|
|
}
|
|
|
|
if (dirty & /*size*/ 1) {
|
|
attr_dev(svg, "width", /*size*/ ctx[0]);
|
|
}
|
|
|
|
if (dirty & /*size*/ 1) {
|
|
attr_dev(svg, "height", /*size*/ ctx[0]);
|
|
}
|
|
|
|
if (dirty & /*fill*/ 2) {
|
|
attr_dev(svg, "fill", /*fill*/ ctx[1]);
|
|
}
|
|
|
|
if (dirty & /*light, light_color, color*/ 524 && svg_stroke_value !== (svg_stroke_value = /*light*/ ctx[3]
|
|
? /*light_color*/ ctx[9]
|
|
: /*color*/ ctx[2])) {
|
|
attr_dev(svg, "stroke", svg_stroke_value);
|
|
}
|
|
|
|
if (dirty & /*width*/ 16) {
|
|
attr_dev(svg, "stroke-width", /*width*/ ctx[4]);
|
|
}
|
|
|
|
if (dirty & /*linecap*/ 32) {
|
|
attr_dev(svg, "stroke-linecap", /*linecap*/ ctx[5]);
|
|
}
|
|
|
|
if (dirty & /*linejoin*/ 64) {
|
|
attr_dev(svg, "stroke-linejoin", /*linejoin*/ ctx[6]);
|
|
}
|
|
|
|
if (dirty & /*name, inactive*/ 384) {
|
|
toggle_class(svg, "inactive", /*inactive*/ ctx[8]);
|
|
}
|
|
},
|
|
i: noop,
|
|
o: noop,
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(span);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$1.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function instance$1($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Icon", slots, []);
|
|
let { size = "24" } = $$props;
|
|
let { fill = "none" } = $$props;
|
|
let { color = "var(--color)" } = $$props;
|
|
let { light = false } = $$props;
|
|
let { width = "2" } = $$props;
|
|
let { linecap = "round" } = $$props;
|
|
let { linejoin = "round" } = $$props;
|
|
let { name } = $$props;
|
|
let { inactive = false } = $$props;
|
|
let { light_color = "var(--color)" } = $$props;
|
|
|
|
const writable_props = [
|
|
"size",
|
|
"fill",
|
|
"color",
|
|
"light",
|
|
"width",
|
|
"linecap",
|
|
"linejoin",
|
|
"name",
|
|
"inactive",
|
|
"light_color"
|
|
];
|
|
|
|
Object.keys($$props).forEach(key => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(`<Icon> was created with unknown prop '${key}'`);
|
|
});
|
|
|
|
$$self.$$set = $$props => {
|
|
if ("size" in $$props) $$invalidate(0, size = $$props.size);
|
|
if ("fill" in $$props) $$invalidate(1, fill = $$props.fill);
|
|
if ("color" in $$props) $$invalidate(2, color = $$props.color);
|
|
if ("light" in $$props) $$invalidate(3, light = $$props.light);
|
|
if ("width" in $$props) $$invalidate(4, width = $$props.width);
|
|
if ("linecap" in $$props) $$invalidate(5, linecap = $$props.linecap);
|
|
if ("linejoin" in $$props) $$invalidate(6, linejoin = $$props.linejoin);
|
|
if ("name" in $$props) $$invalidate(7, name = $$props.name);
|
|
if ("inactive" in $$props) $$invalidate(8, inactive = $$props.inactive);
|
|
if ("light_color" in $$props) $$invalidate(9, light_color = $$props.light_color);
|
|
};
|
|
|
|
$$self.$capture_state = () => ({
|
|
size,
|
|
fill,
|
|
color,
|
|
light,
|
|
width,
|
|
linecap,
|
|
linejoin,
|
|
name,
|
|
inactive,
|
|
light_color
|
|
});
|
|
|
|
$$self.$inject_state = $$props => {
|
|
if ("size" in $$props) $$invalidate(0, size = $$props.size);
|
|
if ("fill" in $$props) $$invalidate(1, fill = $$props.fill);
|
|
if ("color" in $$props) $$invalidate(2, color = $$props.color);
|
|
if ("light" in $$props) $$invalidate(3, light = $$props.light);
|
|
if ("width" in $$props) $$invalidate(4, width = $$props.width);
|
|
if ("linecap" in $$props) $$invalidate(5, linecap = $$props.linecap);
|
|
if ("linejoin" in $$props) $$invalidate(6, linejoin = $$props.linejoin);
|
|
if ("name" in $$props) $$invalidate(7, name = $$props.name);
|
|
if ("inactive" in $$props) $$invalidate(8, inactive = $$props.inactive);
|
|
if ("light_color" in $$props) $$invalidate(9, light_color = $$props.light_color);
|
|
};
|
|
|
|
if ($$props && "$$inject" in $$props) {
|
|
$$self.$inject_state($$props.$$inject);
|
|
}
|
|
|
|
return [
|
|
size,
|
|
fill,
|
|
color,
|
|
light,
|
|
width,
|
|
linecap,
|
|
linejoin,
|
|
name,
|
|
inactive,
|
|
light_color
|
|
];
|
|
}
|
|
|
|
class Icon extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
|
|
init(this, options, instance$1, create_fragment$1, safe_not_equal, {
|
|
size: 0,
|
|
fill: 1,
|
|
color: 2,
|
|
light: 3,
|
|
width: 4,
|
|
linecap: 5,
|
|
linejoin: 6,
|
|
name: 7,
|
|
inactive: 8,
|
|
light_color: 9
|
|
});
|
|
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Icon",
|
|
options,
|
|
id: create_fragment$1.name
|
|
});
|
|
|
|
const { ctx } = this.$$;
|
|
const props = options.props || {};
|
|
|
|
if (/*name*/ ctx[7] === undefined && !("name" in props)) {
|
|
console.warn("<Icon> was created without expected prop 'name'");
|
|
}
|
|
}
|
|
|
|
get size() {
|
|
throw new Error("<Icon>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
set size(value) {
|
|
throw new Error("<Icon>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
get fill() {
|
|
throw new Error("<Icon>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
set fill(value) {
|
|
throw new Error("<Icon>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
get color() {
|
|
throw new Error("<Icon>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
set color(value) {
|
|
throw new Error("<Icon>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
get light() {
|
|
throw new Error("<Icon>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
set light(value) {
|
|
throw new Error("<Icon>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
get width() {
|
|
throw new Error("<Icon>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
set width(value) {
|
|
throw new Error("<Icon>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
get linecap() {
|
|
throw new Error("<Icon>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
set linecap(value) {
|
|
throw new Error("<Icon>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
get linejoin() {
|
|
throw new Error("<Icon>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
set linejoin(value) {
|
|
throw new Error("<Icon>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
get name() {
|
|
throw new Error("<Icon>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
set name(value) {
|
|
throw new Error("<Icon>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
get inactive() {
|
|
throw new Error("<Icon>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
set inactive(value) {
|
|
throw new Error("<Icon>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
get light_color() {
|
|
throw new Error("<Icon>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
set light_color(value) {
|
|
throw new Error("<Icon>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
}
|
|
|
|
/* src/Home.svelte generated by Svelte v3.30.0 */
|
|
const file$1 = "src/Home.svelte";
|
|
|
|
function create_fragment$2(ctx) {
|
|
let hero;
|
|
let h10;
|
|
let t1;
|
|
let p0;
|
|
let t2;
|
|
let b0;
|
|
let t4;
|
|
let b1;
|
|
let t6;
|
|
let t7;
|
|
let hr0;
|
|
let t8;
|
|
let section0;
|
|
let aside0;
|
|
let h30;
|
|
let t10;
|
|
let icon0;
|
|
let t11;
|
|
let p1;
|
|
let t12;
|
|
let a0;
|
|
let t14;
|
|
let t15;
|
|
let aside1;
|
|
let h31;
|
|
let t17;
|
|
let icon1;
|
|
let t18;
|
|
let p2;
|
|
let t19;
|
|
let a1;
|
|
let t21;
|
|
let t22;
|
|
let aside2;
|
|
let h32;
|
|
let t24;
|
|
let icon2;
|
|
let t25;
|
|
let p3;
|
|
let t27;
|
|
let rationale;
|
|
let section1;
|
|
let h11;
|
|
let t29;
|
|
let p4;
|
|
let t30;
|
|
let b2;
|
|
let t32;
|
|
let t33;
|
|
let p5;
|
|
let t35;
|
|
let section2;
|
|
let aside3;
|
|
let pre0;
|
|
let t37;
|
|
let p6;
|
|
let t39;
|
|
let section3;
|
|
let aside4;
|
|
let pre1;
|
|
let t41;
|
|
let hr1;
|
|
let t42;
|
|
let section4;
|
|
let p7;
|
|
let t43;
|
|
let a2;
|
|
let t45;
|
|
let t46;
|
|
let a3;
|
|
let button;
|
|
let link_action;
|
|
let t48;
|
|
let hr2;
|
|
let t49;
|
|
let h12;
|
|
let t51;
|
|
let p8;
|
|
let t52;
|
|
let b3;
|
|
let t54;
|
|
let b4;
|
|
let t56;
|
|
let b5;
|
|
let t58;
|
|
let b6;
|
|
let t60;
|
|
let b7;
|
|
let t62;
|
|
let b8;
|
|
let t64;
|
|
let t65;
|
|
let p9;
|
|
let t66;
|
|
let b9;
|
|
let t68;
|
|
let b10;
|
|
let t70;
|
|
let b11;
|
|
let t72;
|
|
let b12;
|
|
let t74;
|
|
let b13;
|
|
let t76;
|
|
let t77;
|
|
let p10;
|
|
let t78;
|
|
let b14;
|
|
let t80;
|
|
let b15;
|
|
let t82;
|
|
let b16;
|
|
let t84;
|
|
let b17;
|
|
let t86;
|
|
let b18;
|
|
let t88;
|
|
let t89;
|
|
let h13;
|
|
let t91;
|
|
let p11;
|
|
let t92;
|
|
let b19;
|
|
let t94;
|
|
let b20;
|
|
let t96;
|
|
let t97;
|
|
let p12;
|
|
let t98;
|
|
let b21;
|
|
let t100;
|
|
let b22;
|
|
let t102;
|
|
let b23;
|
|
let t104;
|
|
let t105;
|
|
let h14;
|
|
let t107;
|
|
let p13;
|
|
let t108;
|
|
let b24;
|
|
let t110;
|
|
let b25;
|
|
let t112;
|
|
let t113;
|
|
let p14;
|
|
let t114;
|
|
let b26;
|
|
let t116;
|
|
let b27;
|
|
let t118;
|
|
let b28;
|
|
let t120;
|
|
let b29;
|
|
let t122;
|
|
let current;
|
|
let mounted;
|
|
let dispose;
|
|
|
|
icon0 = new Icon({
|
|
props: { name: "code", size: "64" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon1 = new Icon({
|
|
props: { name: "box", size: "64" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon2 = new Icon({
|
|
props: { name: "sliders", size: "64" },
|
|
$$inline: true
|
|
});
|
|
|
|
const block = {
|
|
c: function create() {
|
|
hero = element("hero");
|
|
h10 = element("h1");
|
|
h10.textContent = "fsck CSS";
|
|
t1 = space();
|
|
p0 = element("p");
|
|
t2 = text("An experiment in cleaning up CSS and HTML with modern tools like ");
|
|
b0 = element("b");
|
|
b0.textContent = "flexbox";
|
|
t4 = text(" and ");
|
|
b1 = element("b");
|
|
b1.textContent = "grids";
|
|
t6 = text(".");
|
|
t7 = space();
|
|
hr0 = element("hr");
|
|
t8 = space();
|
|
section0 = element("section");
|
|
aside0 = element("aside");
|
|
h30 = element("h3");
|
|
h30.textContent = "Remove Classes";
|
|
t10 = space();
|
|
create_component(icon0.$$.fragment);
|
|
t11 = space();
|
|
p1 = element("p");
|
|
t12 = text("Using a classless style like ");
|
|
a0 = element("a");
|
|
a0.textContent = "MVP.css";
|
|
t14 = text(", you\n bring back CSS specificity to its original intent.");
|
|
t15 = space();
|
|
aside1 = element("aside");
|
|
h31 = element("h3");
|
|
h31.textContent = "Add Flexbox";
|
|
t17 = space();
|
|
create_component(icon1.$$.fragment);
|
|
t18 = space();
|
|
p2 = element("p");
|
|
t19 = text("Using ");
|
|
a1 = element("a");
|
|
a1.textContent = "flexbox";
|
|
t21 = text(" you can layout anything you want without tons of divs.");
|
|
t22 = space();
|
|
aside2 = element("aside");
|
|
h32 = element("h3");
|
|
h32.textContent = "Modify with Variables";
|
|
t24 = space();
|
|
create_component(icon2.$$.fragment);
|
|
t25 = space();
|
|
p3 = element("p");
|
|
p3.textContent = "Using CSS variables you can replace many uses of classes and ids, avoiding most specificity\n issues. Try the dark mode button below.";
|
|
t27 = space();
|
|
rationale = element("rationale");
|
|
section1 = element("section");
|
|
h11 = element("h1");
|
|
h11.textContent = "Cleaner CSS";
|
|
t29 = space();
|
|
p4 = element("p");
|
|
t30 = text("This website is nothing more than a set of small demos for the idea of\n using flexbox and grids to clean up and simplify CSS. Most everything else\n about CSS stays. Filters, transforms, attributes, and everything that\n applies to the visual display of the components of a design. What gets\n removed is ");
|
|
b2 = element("b");
|
|
b2.textContent = "div";
|
|
t32 = text(" heavy, class heavy, not-semantic-at-all layout\n systems cluttering the real information available through simple HTML\n tags.");
|
|
t33 = space();
|
|
p5 = element("p");
|
|
p5.textContent = "In short, if you're writing this:";
|
|
t35 = space();
|
|
section2 = element("section");
|
|
aside3 = element("aside");
|
|
pre0 = element("pre");
|
|
pre0.textContent = "<div class=\"grid col-1\">\n <div class=\"card\">\n ...\n </div>\n</div>";
|
|
t37 = space();
|
|
p6 = element("p");
|
|
p6.textContent = "You could write this if you use flexbox, grids, and variables:";
|
|
t39 = space();
|
|
section3 = element("section");
|
|
aside4 = element("aside");
|
|
pre1 = element("pre");
|
|
pre1.textContent = "<card>\n ...\n</card>";
|
|
t41 = space();
|
|
hr1 = element("hr");
|
|
t42 = space();
|
|
section4 = element("section");
|
|
p7 = element("p");
|
|
t43 = text("I demonstrate the idea with a series of copies of existing websites and other layout problems \n people frequently encounter. If you have a suggested layout challenge for me, then tell me on Twitter ");
|
|
a2 = element("a");
|
|
a2.textContent = "@lzsthw";
|
|
t45 = text(" and I'll give it a shot.");
|
|
t46 = space();
|
|
a3 = element("a");
|
|
button = element("button");
|
|
button.textContent = "View The Demos";
|
|
t48 = space();
|
|
hr2 = element("hr");
|
|
t49 = space();
|
|
h12 = element("h1");
|
|
h12.textContent = "What's wrong with classes?";
|
|
t51 = space();
|
|
p8 = element("p");
|
|
t52 = text("There's nothing wrong with classes in CSS. How they're used in recent CSS subverts the normal specificity rules making CSS unecessarily difficult. The original specificity rules put the base design of a component at the tag level, then a ");
|
|
b3 = element("b");
|
|
b3.textContent = "class";
|
|
t54 = text(" can be used to modify and extend the design, and an ");
|
|
b4 = element("b");
|
|
b4.textContent = "id";
|
|
t56 = text(" can make this even more specific. In today's use of ");
|
|
b5 = element("b");
|
|
b5.textContent = "div.class";
|
|
t58 = text(" heavy markup you lose this ability to alter the design as needed where its used, and instead you have to resort to ");
|
|
b6 = element("b");
|
|
b6.textContent = "!important";
|
|
t60 = text(" and specificity hacking to change how something looks, or add more ");
|
|
b7 = element("b");
|
|
b7.textContent = "div";
|
|
t62 = text(" with more ");
|
|
b8 = element("b");
|
|
b8.textContent = "class";
|
|
t64 = text(".");
|
|
t65 = space();
|
|
p9 = element("p");
|
|
t66 = text("The other problem with ");
|
|
b9 = element("b");
|
|
b9.textContent = "div.class";
|
|
t68 = text(" is it's more difficult to debug problems with the layout. Because you're relying on specificity that can come from anywhere in the cascade it's much more difficult to find exactly ");
|
|
b10 = element("b");
|
|
b10.textContent = "what";
|
|
t70 = text(" bit of CSS is overriding your local decisions. If you've ever had to open the inspector in your browser to troll through CSS locations looking for the culprit then that's why. If the base design decisions are at the tag level, then your local ");
|
|
b11 = element("b");
|
|
b11.textContent = "class";
|
|
t72 = text(" and ");
|
|
b12 = element("b");
|
|
b12.textContent = "id";
|
|
t74 = text(" specifics will work as expected. You can also replace many uses of class as design modifiers with scoped CSS variables and reduce the use of ");
|
|
b13 = element("b");
|
|
b13.textContent = "div.class";
|
|
t76 = text(" even further.");
|
|
t77 = space();
|
|
p10 = element("p");
|
|
t78 = text("Finally, using ");
|
|
b14 = element("b");
|
|
b14.textContent = "div.class";
|
|
t80 = text(" heavy layout systems polutes your markup with structure that's difficult to maintain and change over time. When you focus on using ");
|
|
b15 = element("b");
|
|
b15.textContent = "truly";
|
|
t82 = text(" semantic named tags and follow specificity as intended then your HTML is lighter and easier to understand because it isn't full of ");
|
|
b16 = element("b");
|
|
b16.textContent = "div.grid.col-1.col-mx-auto";
|
|
t84 = text(" class rules that really have nothing to do with the actual meaning of that particular visual element. With ");
|
|
b17 = element("b");
|
|
b17.textContent = "flexbox";
|
|
t86 = text(" and ");
|
|
b18 = element("b");
|
|
b18.textContent = "CSS grids";
|
|
t88 = text(" you don't need any layout divs, and can keep the HTML clean and semantic. This also ends up being more flexible with less or the same effort as using a pre-made grid system full of divs.");
|
|
t89 = space();
|
|
h13 = element("h1");
|
|
h13.textContent = "Should we ban div.class?";
|
|
t91 = space();
|
|
p11 = element("p");
|
|
t92 = text("Hell no. The current problem of ");
|
|
b19 = element("b");
|
|
b19.textContent = "too much";
|
|
t94 = text(" class based CSS is because of trends in recent years calling for everyone to irrationally ban some practice. Remember when everyone decided tables were evil? So then we banned tables and ");
|
|
b20 = element("b");
|
|
b20.textContent = "grids";
|
|
t96 = text(" completely? Then nobody could do a layout without crazy tricks and JavaScript? Nobody wants a repeat of the anti-tables \"semantic markup\" war, so please don't ban div.class.");
|
|
t97 = space();
|
|
p12 = element("p");
|
|
t98 = text("All this website does is demonstrate that you don't need ");
|
|
b21 = element("b");
|
|
b21.textContent = "so much div.class";
|
|
t100 = text(". You can scrap a lot of what you're using now to do layout and go with clean easy to read HTML that has a nicer flat structure and is easy to maintain, then judiciously add in any extra things you find you need like ");
|
|
b22 = element("b");
|
|
b22.textContent = "div.class";
|
|
t102 = text(". Treat ");
|
|
b23 = element("b");
|
|
b23.textContent = "div.class";
|
|
t104 = text(" like salt. Right now you're pouring a whole box of it on your HTML when a little bit makes it taste better.");
|
|
t105 = space();
|
|
h14 = element("h1");
|
|
h14.textContent = "How did it get like this?";
|
|
t107 = space();
|
|
p13 = element("p");
|
|
t108 = text("Before flexbox and CSS grids there really was no choice but to use ");
|
|
b24 = element("b");
|
|
b24.textContent = "div.class";
|
|
t110 = text(" to make grids for layout. Since everyone in the CSS design world irrationally banned tables as a layout mechanism your only choice was to invent another table but call it ");
|
|
b25 = element("b");
|
|
b25.textContent = "div.grid.col-1";
|
|
t112 = text(".");
|
|
t113 = space();
|
|
p14 = element("p");
|
|
t114 = text("Today we don't have to use divs for layout anymore. It's entirely possible to use flexbox and CSS grids to solve many layout problems, and to do it without too many irrelevant alterations to the meaningful HTML. You no longer have to wrap an ");
|
|
b26 = element("b");
|
|
b26.textContent = "img";
|
|
t116 = text(" with 5 ");
|
|
b27 = element("b");
|
|
b27.textContent = "div";
|
|
t118 = text(" tags just to overlay it on a background. You can write the ");
|
|
b28 = element("b");
|
|
b28.textContent = "img";
|
|
t120 = text(", maybe a ");
|
|
b29 = element("b");
|
|
b29.textContent = "figure";
|
|
t122 = text(" and then use CSS to do anything you want to it.");
|
|
attr_dev(h10, "class", "svelte-rf35ix");
|
|
add_location(h10, file$1, 30, 2, 463);
|
|
add_location(b0, file$1, 31, 70, 551);
|
|
add_location(b1, file$1, 31, 89, 570);
|
|
add_location(p0, file$1, 31, 2, 483);
|
|
attr_dev(hero, "class", "svelte-rf35ix");
|
|
add_location(hero, file$1, 29, 0, 454);
|
|
add_location(hr0, file$1, 34, 0, 597);
|
|
add_location(h30, file$1, 38, 4, 627);
|
|
attr_dev(a0, "href", "https://andybrewer.github.io/mvp/");
|
|
attr_dev(a0, "class", "svelte-rf35ix");
|
|
add_location(a0, file$1, 40, 36, 722);
|
|
add_location(p1, file$1, 40, 4, 690);
|
|
attr_dev(aside0, "class", "svelte-rf35ix");
|
|
add_location(aside0, file$1, 37, 2, 615);
|
|
add_location(h31, file$1, 45, 4, 868);
|
|
attr_dev(a1, "href", "https://css-tricks.com/snippets/css/a-guide-to-flexbox/");
|
|
attr_dev(a1, "class", "svelte-rf35ix");
|
|
add_location(a1, file$1, 47, 13, 936);
|
|
add_location(p2, file$1, 47, 4, 927);
|
|
attr_dev(aside1, "class", "svelte-rf35ix");
|
|
add_location(aside1, file$1, 44, 2, 856);
|
|
add_location(h32, file$1, 51, 4, 1099);
|
|
add_location(p3, file$1, 53, 4, 1172);
|
|
add_location(aside2, file$1, 50, 2, 1087);
|
|
add_location(section0, file$1, 36, 0, 603);
|
|
add_location(h11, file$1, 62, 4, 1374);
|
|
add_location(section1, file$1, 61, 2, 1360);
|
|
add_location(b2, file$1, 69, 15, 1730);
|
|
add_location(p4, file$1, 65, 2, 1411);
|
|
add_location(p5, file$1, 73, 2, 1879);
|
|
add_location(pre0, file$1, 77, 2, 1945);
|
|
add_location(aside3, file$1, 76, 2, 1935);
|
|
add_location(section2, file$1, 75, 2, 1923);
|
|
add_location(p6, file$1, 87, 2, 2067);
|
|
add_location(pre1, file$1, 91, 2, 2162);
|
|
add_location(aside4, file$1, 90, 2, 2152);
|
|
add_location(section3, file$1, 89, 2, 2140);
|
|
add_location(hr1, file$1, 99, 2, 2231);
|
|
attr_dev(a2, "href", "https://twitter.com/lzsthw");
|
|
add_location(a2, file$1, 102, 109, 2459);
|
|
add_location(p7, file$1, 101, 4, 2252);
|
|
add_location(button, file$1, 104, 30, 2572);
|
|
attr_dev(a3, "href", "/demos");
|
|
add_location(a3, file$1, 104, 4, 2546);
|
|
add_location(section4, file$1, 100, 2, 2238);
|
|
add_location(hr2, file$1, 107, 2, 2624);
|
|
add_location(h12, file$1, 108, 2, 2631);
|
|
add_location(b3, file$1, 110, 244, 2912);
|
|
add_location(b4, file$1, 110, 309, 2977);
|
|
add_location(b5, file$1, 110, 372, 3040);
|
|
add_location(b6, file$1, 110, 504, 3172);
|
|
add_location(b7, file$1, 110, 589, 3257);
|
|
add_location(b8, file$1, 110, 610, 3278);
|
|
add_location(p8, file$1, 110, 2, 2670);
|
|
add_location(b9, file$1, 112, 28, 3325);
|
|
add_location(b10, file$1, 112, 226, 3523);
|
|
add_location(b11, file$1, 112, 483, 3780);
|
|
add_location(b12, file$1, 112, 500, 3797);
|
|
add_location(b13, file$1, 112, 652, 3949);
|
|
add_location(p9, file$1, 112, 2, 3299);
|
|
add_location(b14, file$1, 114, 20, 4005);
|
|
add_location(b15, file$1, 114, 169, 4154);
|
|
add_location(b16, file$1, 114, 313, 4298);
|
|
add_location(b17, file$1, 114, 455, 4440);
|
|
add_location(b18, file$1, 114, 474, 4459);
|
|
add_location(p10, file$1, 114, 2, 3987);
|
|
add_location(h13, file$1, 116, 2, 4671);
|
|
add_location(b19, file$1, 118, 38, 4744);
|
|
add_location(b20, file$1, 118, 243, 4949);
|
|
add_location(p11, file$1, 118, 2, 4708);
|
|
add_location(b21, file$1, 120, 62, 5205);
|
|
add_location(b22, file$1, 120, 304, 5447);
|
|
add_location(b23, file$1, 120, 329, 5472);
|
|
add_location(p12, file$1, 120, 2, 5145);
|
|
add_location(h14, file$1, 122, 2, 5604);
|
|
add_location(b24, file$1, 123, 72, 5711);
|
|
add_location(b25, file$1, 123, 261, 5900);
|
|
add_location(p13, file$1, 123, 2, 5641);
|
|
add_location(b26, file$1, 125, 248, 6176);
|
|
add_location(b27, file$1, 125, 266, 6194);
|
|
add_location(b28, file$1, 125, 336, 6264);
|
|
add_location(b29, file$1, 125, 356, 6284);
|
|
add_location(p14, file$1, 125, 2, 5930);
|
|
attr_dev(rationale, "class", "svelte-rf35ix");
|
|
add_location(rationale, file$1, 60, 0, 1346);
|
|
},
|
|
l: function claim(nodes) {
|
|
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, hero, anchor);
|
|
append_dev(hero, h10);
|
|
append_dev(hero, t1);
|
|
append_dev(hero, p0);
|
|
append_dev(p0, t2);
|
|
append_dev(p0, b0);
|
|
append_dev(p0, t4);
|
|
append_dev(p0, b1);
|
|
append_dev(p0, t6);
|
|
insert_dev(target, t7, anchor);
|
|
insert_dev(target, hr0, anchor);
|
|
insert_dev(target, t8, anchor);
|
|
insert_dev(target, section0, anchor);
|
|
append_dev(section0, aside0);
|
|
append_dev(aside0, h30);
|
|
append_dev(aside0, t10);
|
|
mount_component(icon0, aside0, null);
|
|
append_dev(aside0, t11);
|
|
append_dev(aside0, p1);
|
|
append_dev(p1, t12);
|
|
append_dev(p1, a0);
|
|
append_dev(p1, t14);
|
|
append_dev(section0, t15);
|
|
append_dev(section0, aside1);
|
|
append_dev(aside1, h31);
|
|
append_dev(aside1, t17);
|
|
mount_component(icon1, aside1, null);
|
|
append_dev(aside1, t18);
|
|
append_dev(aside1, p2);
|
|
append_dev(p2, t19);
|
|
append_dev(p2, a1);
|
|
append_dev(p2, t21);
|
|
append_dev(section0, t22);
|
|
append_dev(section0, aside2);
|
|
append_dev(aside2, h32);
|
|
append_dev(aside2, t24);
|
|
mount_component(icon2, aside2, null);
|
|
append_dev(aside2, t25);
|
|
append_dev(aside2, p3);
|
|
insert_dev(target, t27, anchor);
|
|
insert_dev(target, rationale, anchor);
|
|
append_dev(rationale, section1);
|
|
append_dev(section1, h11);
|
|
append_dev(rationale, t29);
|
|
append_dev(rationale, p4);
|
|
append_dev(p4, t30);
|
|
append_dev(p4, b2);
|
|
append_dev(p4, t32);
|
|
append_dev(rationale, t33);
|
|
append_dev(rationale, p5);
|
|
append_dev(rationale, t35);
|
|
append_dev(rationale, section2);
|
|
append_dev(section2, aside3);
|
|
append_dev(aside3, pre0);
|
|
append_dev(rationale, t37);
|
|
append_dev(rationale, p6);
|
|
append_dev(rationale, t39);
|
|
append_dev(rationale, section3);
|
|
append_dev(section3, aside4);
|
|
append_dev(aside4, pre1);
|
|
append_dev(rationale, t41);
|
|
append_dev(rationale, hr1);
|
|
append_dev(rationale, t42);
|
|
append_dev(rationale, section4);
|
|
append_dev(section4, p7);
|
|
append_dev(p7, t43);
|
|
append_dev(p7, a2);
|
|
append_dev(p7, t45);
|
|
append_dev(section4, t46);
|
|
append_dev(section4, a3);
|
|
append_dev(a3, button);
|
|
append_dev(rationale, t48);
|
|
append_dev(rationale, hr2);
|
|
append_dev(rationale, t49);
|
|
append_dev(rationale, h12);
|
|
append_dev(rationale, t51);
|
|
append_dev(rationale, p8);
|
|
append_dev(p8, t52);
|
|
append_dev(p8, b3);
|
|
append_dev(p8, t54);
|
|
append_dev(p8, b4);
|
|
append_dev(p8, t56);
|
|
append_dev(p8, b5);
|
|
append_dev(p8, t58);
|
|
append_dev(p8, b6);
|
|
append_dev(p8, t60);
|
|
append_dev(p8, b7);
|
|
append_dev(p8, t62);
|
|
append_dev(p8, b8);
|
|
append_dev(p8, t64);
|
|
append_dev(rationale, t65);
|
|
append_dev(rationale, p9);
|
|
append_dev(p9, t66);
|
|
append_dev(p9, b9);
|
|
append_dev(p9, t68);
|
|
append_dev(p9, b10);
|
|
append_dev(p9, t70);
|
|
append_dev(p9, b11);
|
|
append_dev(p9, t72);
|
|
append_dev(p9, b12);
|
|
append_dev(p9, t74);
|
|
append_dev(p9, b13);
|
|
append_dev(p9, t76);
|
|
append_dev(rationale, t77);
|
|
append_dev(rationale, p10);
|
|
append_dev(p10, t78);
|
|
append_dev(p10, b14);
|
|
append_dev(p10, t80);
|
|
append_dev(p10, b15);
|
|
append_dev(p10, t82);
|
|
append_dev(p10, b16);
|
|
append_dev(p10, t84);
|
|
append_dev(p10, b17);
|
|
append_dev(p10, t86);
|
|
append_dev(p10, b18);
|
|
append_dev(p10, t88);
|
|
append_dev(rationale, t89);
|
|
append_dev(rationale, h13);
|
|
append_dev(rationale, t91);
|
|
append_dev(rationale, p11);
|
|
append_dev(p11, t92);
|
|
append_dev(p11, b19);
|
|
append_dev(p11, t94);
|
|
append_dev(p11, b20);
|
|
append_dev(p11, t96);
|
|
append_dev(rationale, t97);
|
|
append_dev(rationale, p12);
|
|
append_dev(p12, t98);
|
|
append_dev(p12, b21);
|
|
append_dev(p12, t100);
|
|
append_dev(p12, b22);
|
|
append_dev(p12, t102);
|
|
append_dev(p12, b23);
|
|
append_dev(p12, t104);
|
|
append_dev(rationale, t105);
|
|
append_dev(rationale, h14);
|
|
append_dev(rationale, t107);
|
|
append_dev(rationale, p13);
|
|
append_dev(p13, t108);
|
|
append_dev(p13, b24);
|
|
append_dev(p13, t110);
|
|
append_dev(p13, b25);
|
|
append_dev(p13, t112);
|
|
append_dev(rationale, t113);
|
|
append_dev(rationale, p14);
|
|
append_dev(p14, t114);
|
|
append_dev(p14, b26);
|
|
append_dev(p14, t116);
|
|
append_dev(p14, b27);
|
|
append_dev(p14, t118);
|
|
append_dev(p14, b28);
|
|
append_dev(p14, t120);
|
|
append_dev(p14, b29);
|
|
append_dev(p14, t122);
|
|
current = true;
|
|
|
|
if (!mounted) {
|
|
dispose = action_destroyer(link_action = link.call(null, a3));
|
|
mounted = true;
|
|
}
|
|
},
|
|
p: noop,
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(icon0.$$.fragment, local);
|
|
transition_in(icon1.$$.fragment, local);
|
|
transition_in(icon2.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(icon0.$$.fragment, local);
|
|
transition_out(icon1.$$.fragment, local);
|
|
transition_out(icon2.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(hero);
|
|
if (detaching) detach_dev(t7);
|
|
if (detaching) detach_dev(hr0);
|
|
if (detaching) detach_dev(t8);
|
|
if (detaching) detach_dev(section0);
|
|
destroy_component(icon0);
|
|
destroy_component(icon1);
|
|
destroy_component(icon2);
|
|
if (detaching) detach_dev(t27);
|
|
if (detaching) detach_dev(rationale);
|
|
mounted = false;
|
|
dispose();
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$2.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function instance$2($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Home", slots, []);
|
|
const writable_props = [];
|
|
|
|
Object.keys($$props).forEach(key => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(`<Home> was created with unknown prop '${key}'`);
|
|
});
|
|
|
|
$$self.$capture_state = () => ({ link, Icon });
|
|
return [];
|
|
}
|
|
|
|
class Home extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$2, create_fragment$2, safe_not_equal, {});
|
|
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Home",
|
|
options,
|
|
id: create_fragment$2.name
|
|
});
|
|
}
|
|
}
|
|
|
|
/* src/thumbs/Google.svelte generated by Svelte v3.30.0 */
|
|
const file$2 = "src/thumbs/Google.svelte";
|
|
|
|
function create_fragment$3(ctx) {
|
|
let content;
|
|
let header;
|
|
let nav;
|
|
let nav_left;
|
|
let a0;
|
|
let t1;
|
|
let a1;
|
|
let t3;
|
|
let ul;
|
|
let li0;
|
|
let t5;
|
|
let li1;
|
|
let t7;
|
|
let li2;
|
|
let icon;
|
|
let t8;
|
|
let li3;
|
|
let button0;
|
|
let t10;
|
|
let figure;
|
|
let a2;
|
|
let img;
|
|
let img_src_value;
|
|
let link_action;
|
|
let t11;
|
|
let search;
|
|
let input;
|
|
let t12;
|
|
let buttons;
|
|
let button1;
|
|
let t14;
|
|
let button2;
|
|
let current;
|
|
let mounted;
|
|
let dispose;
|
|
|
|
icon = new Icon({
|
|
props: { name: "grid", color: "#000" },
|
|
$$inline: true
|
|
});
|
|
|
|
const block = {
|
|
c: function create() {
|
|
content = element("content");
|
|
header = element("header");
|
|
nav = element("nav");
|
|
nav_left = element("nav-left");
|
|
a0 = element("a");
|
|
a0.textContent = "About";
|
|
t1 = space();
|
|
a1 = element("a");
|
|
a1.textContent = "Store";
|
|
t3 = space();
|
|
ul = element("ul");
|
|
li0 = element("li");
|
|
li0.textContent = "Gmail";
|
|
t5 = space();
|
|
li1 = element("li");
|
|
li1.textContent = "Image";
|
|
t7 = space();
|
|
li2 = element("li");
|
|
create_component(icon.$$.fragment);
|
|
t8 = space();
|
|
li3 = element("li");
|
|
button0 = element("button");
|
|
button0.textContent = "Sign In";
|
|
t10 = space();
|
|
figure = element("figure");
|
|
a2 = element("a");
|
|
img = element("img");
|
|
t11 = space();
|
|
search = element("search");
|
|
input = element("input");
|
|
t12 = space();
|
|
buttons = element("buttons");
|
|
button1 = element("button");
|
|
button1.textContent = "Google Search";
|
|
t14 = space();
|
|
button2 = element("button");
|
|
button2.textContent = "I'm Feeling Lucky";
|
|
attr_dev(a0, "class", "svelte-1xw0xeo");
|
|
add_location(a0, file$2, 74, 8, 1064);
|
|
attr_dev(a1, "class", "svelte-1xw0xeo");
|
|
add_location(a1, file$2, 75, 8, 1085);
|
|
add_location(nav_left, file$2, 73, 6, 1045);
|
|
add_location(li0, file$2, 78, 6, 1133);
|
|
add_location(li1, file$2, 79, 6, 1154);
|
|
add_location(li2, file$2, 80, 6, 1175);
|
|
attr_dev(button0, "class", "svelte-1xw0xeo");
|
|
add_location(button0, file$2, 81, 10, 1228);
|
|
add_location(li3, file$2, 81, 6, 1224);
|
|
add_location(ul, file$2, 77, 6, 1122);
|
|
attr_dev(nav, "class", "svelte-1xw0xeo");
|
|
add_location(nav, file$2, 72, 4, 1033);
|
|
attr_dev(header, "class", "svelte-1xw0xeo");
|
|
add_location(header, file$2, 71, 2, 1020);
|
|
if (img.src !== (img_src_value = "https://via.placeholder.com/500x200?text=Google+Doodle")) attr_dev(img, "src", img_src_value);
|
|
add_location(img, file$2, 88, 6, 1349);
|
|
attr_dev(a2, "href", "/demos/google");
|
|
attr_dev(a2, "class", "svelte-1xw0xeo");
|
|
add_location(a2, file$2, 87, 4, 1309);
|
|
attr_dev(figure, "class", "svelte-1xw0xeo");
|
|
add_location(figure, file$2, 86, 2, 1296);
|
|
attr_dev(input, "type", "text");
|
|
attr_dev(input, "class", "svelte-1xw0xeo");
|
|
add_location(input, file$2, 93, 2, 1451);
|
|
attr_dev(button1, "class", "svelte-1xw0xeo");
|
|
add_location(button1, file$2, 95, 6, 1491);
|
|
attr_dev(button2, "class", "svelte-1xw0xeo");
|
|
add_location(button2, file$2, 96, 6, 1528);
|
|
attr_dev(buttons, "class", "svelte-1xw0xeo");
|
|
add_location(buttons, file$2, 94, 4, 1475);
|
|
attr_dev(search, "class", "svelte-1xw0xeo");
|
|
add_location(search, file$2, 92, 2, 1440);
|
|
attr_dev(content, "class", "svelte-1xw0xeo");
|
|
add_location(content, file$2, 70, 0, 1008);
|
|
},
|
|
l: function claim(nodes) {
|
|
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, content, anchor);
|
|
append_dev(content, header);
|
|
append_dev(header, nav);
|
|
append_dev(nav, nav_left);
|
|
append_dev(nav_left, a0);
|
|
append_dev(nav_left, t1);
|
|
append_dev(nav_left, a1);
|
|
append_dev(nav, t3);
|
|
append_dev(nav, ul);
|
|
append_dev(ul, li0);
|
|
append_dev(ul, t5);
|
|
append_dev(ul, li1);
|
|
append_dev(ul, t7);
|
|
append_dev(ul, li2);
|
|
mount_component(icon, li2, null);
|
|
append_dev(ul, t8);
|
|
append_dev(ul, li3);
|
|
append_dev(li3, button0);
|
|
append_dev(content, t10);
|
|
append_dev(content, figure);
|
|
append_dev(figure, a2);
|
|
append_dev(a2, img);
|
|
append_dev(content, t11);
|
|
append_dev(content, search);
|
|
append_dev(search, input);
|
|
append_dev(search, t12);
|
|
append_dev(search, buttons);
|
|
append_dev(buttons, button1);
|
|
append_dev(buttons, t14);
|
|
append_dev(buttons, button2);
|
|
current = true;
|
|
|
|
if (!mounted) {
|
|
dispose = action_destroyer(link_action = link.call(null, a2));
|
|
mounted = true;
|
|
}
|
|
},
|
|
p: noop,
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(icon.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(icon.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(content);
|
|
destroy_component(icon);
|
|
mounted = false;
|
|
dispose();
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$3.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function instance$3($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Google", slots, []);
|
|
const writable_props = [];
|
|
|
|
Object.keys($$props).forEach(key => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(`<Google> was created with unknown prop '${key}'`);
|
|
});
|
|
|
|
$$self.$capture_state = () => ({ link, Icon });
|
|
return [];
|
|
}
|
|
|
|
class Google extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$3, create_fragment$3, safe_not_equal, {});
|
|
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Google",
|
|
options,
|
|
id: create_fragment$3.name
|
|
});
|
|
}
|
|
}
|
|
|
|
/* src/thumbs/Twitter.svelte generated by Svelte v3.30.0 */
|
|
const file$3 = "src/thumbs/Twitter.svelte";
|
|
|
|
function create_fragment$4(ctx) {
|
|
let content;
|
|
let middle;
|
|
let header;
|
|
let nav;
|
|
let back;
|
|
let icon0;
|
|
let t0;
|
|
let name;
|
|
let h4;
|
|
let t2;
|
|
let span;
|
|
let t4;
|
|
let images;
|
|
let figure0;
|
|
let img0;
|
|
let img0_src_value;
|
|
let t5;
|
|
let figure1;
|
|
let img1;
|
|
let img1_src_value;
|
|
let t6;
|
|
let button;
|
|
let t8;
|
|
let profile;
|
|
let h3;
|
|
let t10;
|
|
let p0;
|
|
let t12;
|
|
let p1;
|
|
let t14;
|
|
let p2;
|
|
let icon1;
|
|
let t15;
|
|
let icon2;
|
|
let t16;
|
|
let a;
|
|
let t18;
|
|
let icon3;
|
|
let t19;
|
|
let t20;
|
|
let p3;
|
|
let b0;
|
|
let t22;
|
|
let b1;
|
|
let t24;
|
|
let current;
|
|
|
|
icon0 = new Icon({
|
|
props: { name: "arrow-left" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon1 = new Icon({
|
|
props: {
|
|
name: "map",
|
|
size: "24",
|
|
color: "var(--color-bg-secondary)"
|
|
},
|
|
$$inline: true
|
|
});
|
|
|
|
icon2 = new Icon({
|
|
props: {
|
|
name: "link",
|
|
size: "24",
|
|
color: "var(--color-bg-secondary)"
|
|
},
|
|
$$inline: true
|
|
});
|
|
|
|
icon3 = new Icon({
|
|
props: {
|
|
name: "calendar",
|
|
size: "24",
|
|
color: "var(--color-bg-secondary)"
|
|
},
|
|
$$inline: true
|
|
});
|
|
|
|
const block = {
|
|
c: function create() {
|
|
content = element("content");
|
|
middle = element("middle");
|
|
header = element("header");
|
|
nav = element("nav");
|
|
back = element("back");
|
|
create_component(icon0.$$.fragment);
|
|
t0 = space();
|
|
name = element("name");
|
|
h4 = element("h4");
|
|
h4.textContent = "Zed A. Shaw, Writer";
|
|
t2 = space();
|
|
span = element("span");
|
|
span.textContent = "7,754 Tweets";
|
|
t4 = space();
|
|
images = element("images");
|
|
figure0 = element("figure");
|
|
img0 = element("img");
|
|
t5 = space();
|
|
figure1 = element("figure");
|
|
img1 = element("img");
|
|
t6 = space();
|
|
button = element("button");
|
|
button.textContent = "Follow";
|
|
t8 = space();
|
|
profile = element("profile");
|
|
h3 = element("h3");
|
|
h3.textContent = "Zed A. Shaw, Writer";
|
|
t10 = space();
|
|
p0 = element("p");
|
|
p0.textContent = "@lzsthw";
|
|
t12 = space();
|
|
p1 = element("p");
|
|
p1.textContent = "The author of The Hard Way Series published by Addison/Wesley including Learn Python The Hard Way and many more. Follow me here for coding tips and book news.";
|
|
t14 = space();
|
|
p2 = element("p");
|
|
create_component(icon1.$$.fragment);
|
|
t15 = text(" Some Place, KY ");
|
|
create_component(icon2.$$.fragment);
|
|
t16 = space();
|
|
a = element("a");
|
|
a.textContent = "learnjsthehardway.org";
|
|
t18 = space();
|
|
create_component(icon3.$$.fragment);
|
|
t19 = text(" Joined Jan, 1999.");
|
|
t20 = space();
|
|
p3 = element("p");
|
|
b0 = element("b");
|
|
b0.textContent = "167";
|
|
t22 = text(" Following ");
|
|
b1 = element("b");
|
|
b1.textContent = "10.4k";
|
|
t24 = text(" Followers");
|
|
attr_dev(back, "class", "svelte-1prpjq7");
|
|
add_location(back, file$3, 103, 8, 1582);
|
|
attr_dev(h4, "class", "svelte-1prpjq7");
|
|
add_location(h4, file$3, 105, 10, 1647);
|
|
attr_dev(span, "class", "svelte-1prpjq7");
|
|
add_location(span, file$3, 106, 10, 1686);
|
|
add_location(name, file$3, 104, 8, 1630);
|
|
attr_dev(nav, "class", "svelte-1prpjq7");
|
|
add_location(nav, file$3, 102, 6, 1568);
|
|
attr_dev(header, "class", "svelte-1prpjq7");
|
|
add_location(header, file$3, 101, 4, 1553);
|
|
attr_dev(img0, "alt", "Profile background");
|
|
if (img0.src !== (img0_src_value = "/header_pic.jpg")) attr_dev(img0, "src", img0_src_value);
|
|
attr_dev(img0, "class", "svelte-1prpjq7");
|
|
add_location(img0, file$3, 113, 8, 1808);
|
|
attr_dev(figure0, "id", "background");
|
|
attr_dev(figure0, "class", "svelte-1prpjq7");
|
|
add_location(figure0, file$3, 112, 6, 1775);
|
|
attr_dev(img1, "alt", "Profile picture");
|
|
if (img1.src !== (img1_src_value = "/profile_pic.jpg")) attr_dev(img1, "src", img1_src_value);
|
|
attr_dev(img1, "class", "svelte-1prpjq7");
|
|
add_location(img1, file$3, 117, 8, 1913);
|
|
attr_dev(button, "id", "follow");
|
|
attr_dev(button, "class", "svelte-1prpjq7");
|
|
add_location(button, file$3, 118, 8, 1972);
|
|
attr_dev(figure1, "id", "avatar");
|
|
attr_dev(figure1, "class", "svelte-1prpjq7");
|
|
add_location(figure1, file$3, 116, 6, 1884);
|
|
attr_dev(images, "class", "svelte-1prpjq7");
|
|
add_location(images, file$3, 111, 4, 1760);
|
|
add_location(h3, file$3, 123, 6, 2059);
|
|
add_location(p0, file$3, 124, 6, 2094);
|
|
add_location(p1, file$3, 125, 6, 2115);
|
|
add_location(a, file$3, 126, 153, 2434);
|
|
add_location(p2, file$3, 126, 6, 2287);
|
|
add_location(b0, file$3, 127, 9, 2564);
|
|
add_location(b1, file$3, 127, 30, 2585);
|
|
add_location(p3, file$3, 127, 6, 2561);
|
|
attr_dev(profile, "class", "svelte-1prpjq7");
|
|
add_location(profile, file$3, 122, 4, 2043);
|
|
attr_dev(middle, "class", "svelte-1prpjq7");
|
|
add_location(middle, file$3, 100, 2, 1540);
|
|
attr_dev(content, "class", "svelte-1prpjq7");
|
|
add_location(content, file$3, 99, 0, 1528);
|
|
},
|
|
l: function claim(nodes) {
|
|
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, content, anchor);
|
|
append_dev(content, middle);
|
|
append_dev(middle, header);
|
|
append_dev(header, nav);
|
|
append_dev(nav, back);
|
|
mount_component(icon0, back, null);
|
|
append_dev(nav, t0);
|
|
append_dev(nav, name);
|
|
append_dev(name, h4);
|
|
append_dev(name, t2);
|
|
append_dev(name, span);
|
|
append_dev(middle, t4);
|
|
append_dev(middle, images);
|
|
append_dev(images, figure0);
|
|
append_dev(figure0, img0);
|
|
append_dev(images, t5);
|
|
append_dev(images, figure1);
|
|
append_dev(figure1, img1);
|
|
append_dev(figure1, t6);
|
|
append_dev(figure1, button);
|
|
append_dev(middle, t8);
|
|
append_dev(middle, profile);
|
|
append_dev(profile, h3);
|
|
append_dev(profile, t10);
|
|
append_dev(profile, p0);
|
|
append_dev(profile, t12);
|
|
append_dev(profile, p1);
|
|
append_dev(profile, t14);
|
|
append_dev(profile, p2);
|
|
mount_component(icon1, p2, null);
|
|
append_dev(p2, t15);
|
|
mount_component(icon2, p2, null);
|
|
append_dev(p2, t16);
|
|
append_dev(p2, a);
|
|
append_dev(p2, t18);
|
|
mount_component(icon3, p2, null);
|
|
append_dev(p2, t19);
|
|
append_dev(profile, t20);
|
|
append_dev(profile, p3);
|
|
append_dev(p3, b0);
|
|
append_dev(p3, t22);
|
|
append_dev(p3, b1);
|
|
append_dev(p3, t24);
|
|
current = true;
|
|
},
|
|
p: noop,
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(icon0.$$.fragment, local);
|
|
transition_in(icon1.$$.fragment, local);
|
|
transition_in(icon2.$$.fragment, local);
|
|
transition_in(icon3.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(icon0.$$.fragment, local);
|
|
transition_out(icon1.$$.fragment, local);
|
|
transition_out(icon2.$$.fragment, local);
|
|
transition_out(icon3.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(content);
|
|
destroy_component(icon0);
|
|
destroy_component(icon1);
|
|
destroy_component(icon2);
|
|
destroy_component(icon3);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$4.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function instance$4($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Twitter", slots, []);
|
|
const writable_props = [];
|
|
|
|
Object.keys($$props).forEach(key => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(`<Twitter> was created with unknown prop '${key}'`);
|
|
});
|
|
|
|
$$self.$capture_state = () => ({ Icon });
|
|
return [];
|
|
}
|
|
|
|
class Twitter extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$4, create_fragment$4, safe_not_equal, {});
|
|
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Twitter",
|
|
options,
|
|
id: create_fragment$4.name
|
|
});
|
|
}
|
|
}
|
|
|
|
/* src/thumbs/Youtube.svelte generated by Svelte v3.30.0 */
|
|
const file$4 = "src/thumbs/Youtube.svelte";
|
|
|
|
function create_fragment$5(ctx) {
|
|
let content;
|
|
let header;
|
|
let nav;
|
|
let nav_left;
|
|
let a0;
|
|
let icon0;
|
|
let t0;
|
|
let icon1;
|
|
let t1;
|
|
let logo;
|
|
let t3;
|
|
let input;
|
|
let t4;
|
|
let ul;
|
|
let li0;
|
|
let icon2;
|
|
let t5;
|
|
let li1;
|
|
let icon3;
|
|
let t6;
|
|
let li2;
|
|
let icon4;
|
|
let t7;
|
|
let li3;
|
|
let button;
|
|
let icon5;
|
|
let t8;
|
|
let t9;
|
|
let main;
|
|
let left;
|
|
let figure;
|
|
let img;
|
|
let img_src_value;
|
|
let t10;
|
|
let figcaption;
|
|
let a1;
|
|
let t12;
|
|
let a2;
|
|
let t14;
|
|
let p;
|
|
let t16;
|
|
let video_actions;
|
|
let likes;
|
|
let t18;
|
|
let video_buttons;
|
|
let icon6;
|
|
let t19;
|
|
let icon7;
|
|
let t20;
|
|
let icon8;
|
|
let t21;
|
|
let icon9;
|
|
let t22;
|
|
let icon10;
|
|
let current;
|
|
icon0 = new Icon({ props: { name: "menu" }, $$inline: true });
|
|
|
|
icon1 = new Icon({
|
|
props: { name: "youtube" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon2 = new Icon({
|
|
props: { name: "camera", color: "#000" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon3 = new Icon({
|
|
props: { name: "more-vertical", color: "#000" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon4 = new Icon({
|
|
props: { name: "grid", color: "#000" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon5 = new Icon({ props: { name: "user" }, $$inline: true });
|
|
|
|
icon6 = new Icon({
|
|
props: { name: "thumbs-up", color: "#999" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon7 = new Icon({
|
|
props: { name: "thumbs-down", color: "#999" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon8 = new Icon({
|
|
props: { name: "corner-up-right", color: "#999" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon9 = new Icon({
|
|
props: { name: "menu", color: "#999" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon10 = new Icon({
|
|
props: { name: "vertical-more" },
|
|
$$inline: true
|
|
});
|
|
|
|
const block = {
|
|
c: function create() {
|
|
content = element("content");
|
|
header = element("header");
|
|
nav = element("nav");
|
|
nav_left = element("nav-left");
|
|
a0 = element("a");
|
|
create_component(icon0.$$.fragment);
|
|
t0 = space();
|
|
create_component(icon1.$$.fragment);
|
|
t1 = space();
|
|
logo = element("logo");
|
|
logo.textContent = "Youtube";
|
|
t3 = space();
|
|
input = element("input");
|
|
t4 = space();
|
|
ul = element("ul");
|
|
li0 = element("li");
|
|
create_component(icon2.$$.fragment);
|
|
t5 = space();
|
|
li1 = element("li");
|
|
create_component(icon3.$$.fragment);
|
|
t6 = space();
|
|
li2 = element("li");
|
|
create_component(icon4.$$.fragment);
|
|
t7 = space();
|
|
li3 = element("li");
|
|
button = element("button");
|
|
create_component(icon5.$$.fragment);
|
|
t8 = text(" Sign In");
|
|
t9 = space();
|
|
main = element("main");
|
|
left = element("left");
|
|
figure = element("figure");
|
|
img = element("img");
|
|
t10 = space();
|
|
figcaption = element("figcaption");
|
|
a1 = element("a");
|
|
a1.textContent = "#tag";
|
|
t12 = space();
|
|
a2 = element("a");
|
|
a2.textContent = "#anothertag";
|
|
t14 = space();
|
|
p = element("p");
|
|
p.textContent = "Title And Stuff";
|
|
t16 = space();
|
|
video_actions = element("video-actions");
|
|
likes = element("likes");
|
|
likes.textContent = "Stats Stats";
|
|
t18 = space();
|
|
video_buttons = element("video-buttons");
|
|
create_component(icon6.$$.fragment);
|
|
t19 = text(" 1.1K\n ");
|
|
create_component(icon7.$$.fragment);
|
|
t20 = text(" 22\n ");
|
|
create_component(icon8.$$.fragment);
|
|
t21 = text(" SHARE\n ");
|
|
create_component(icon9.$$.fragment);
|
|
t22 = text(" SAVE\n ");
|
|
create_component(icon10.$$.fragment);
|
|
attr_dev(logo, "class", "svelte-oxwxiv");
|
|
add_location(logo, file$4, 78, 56, 1184);
|
|
add_location(a0, file$4, 78, 8, 1136);
|
|
add_location(nav_left, file$4, 77, 6, 1117);
|
|
attr_dev(input, "id", "search");
|
|
attr_dev(input, "placeholder", "Search");
|
|
attr_dev(input, "name", "search");
|
|
attr_dev(input, "class", "svelte-oxwxiv");
|
|
add_location(input, file$4, 80, 6, 1233);
|
|
add_location(li0, file$4, 82, 8, 1307);
|
|
add_location(li1, file$4, 83, 8, 1360);
|
|
add_location(li2, file$4, 84, 8, 1420);
|
|
attr_dev(button, "class", "svelte-oxwxiv");
|
|
add_location(button, file$4, 85, 12, 1475);
|
|
add_location(li3, file$4, 85, 8, 1471);
|
|
add_location(ul, file$4, 81, 6, 1294);
|
|
attr_dev(nav, "class", "svelte-oxwxiv");
|
|
add_location(nav, file$4, 76, 4, 1105);
|
|
attr_dev(header, "class", "svelte-oxwxiv");
|
|
add_location(header, file$4, 75, 2, 1092);
|
|
if (img.src !== (img_src_value = "https://via.placeholder.com/800x450?text=Video")) attr_dev(img, "src", img_src_value);
|
|
add_location(img, file$4, 92, 8, 1604);
|
|
attr_dev(a1, "class", "svelte-oxwxiv");
|
|
add_location(a1, file$4, 94, 10, 1694);
|
|
attr_dev(a2, "class", "svelte-oxwxiv");
|
|
add_location(a2, file$4, 94, 22, 1706);
|
|
attr_dev(p, "class", "svelte-oxwxiv");
|
|
add_location(p, file$4, 95, 10, 1735);
|
|
add_location(likes, file$4, 97, 12, 1796);
|
|
add_location(video_buttons, file$4, 98, 12, 1835);
|
|
set_custom_element_data(video_actions, "class", "svelte-oxwxiv");
|
|
add_location(video_actions, file$4, 96, 10, 1768);
|
|
attr_dev(figcaption, "class", "svelte-oxwxiv");
|
|
add_location(figcaption, file$4, 93, 8, 1671);
|
|
add_location(figure, file$4, 91, 6, 1587);
|
|
add_location(left, file$4, 90, 4, 1574);
|
|
attr_dev(main, "class", "svelte-oxwxiv");
|
|
add_location(main, file$4, 89, 2, 1563);
|
|
attr_dev(content, "class", "svelte-oxwxiv");
|
|
add_location(content, file$4, 74, 0, 1080);
|
|
},
|
|
l: function claim(nodes) {
|
|
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, content, anchor);
|
|
append_dev(content, header);
|
|
append_dev(header, nav);
|
|
append_dev(nav, nav_left);
|
|
append_dev(nav_left, a0);
|
|
mount_component(icon0, a0, null);
|
|
append_dev(a0, t0);
|
|
mount_component(icon1, a0, null);
|
|
append_dev(a0, t1);
|
|
append_dev(a0, logo);
|
|
append_dev(nav, t3);
|
|
append_dev(nav, input);
|
|
append_dev(nav, t4);
|
|
append_dev(nav, ul);
|
|
append_dev(ul, li0);
|
|
mount_component(icon2, li0, null);
|
|
append_dev(ul, t5);
|
|
append_dev(ul, li1);
|
|
mount_component(icon3, li1, null);
|
|
append_dev(ul, t6);
|
|
append_dev(ul, li2);
|
|
mount_component(icon4, li2, null);
|
|
append_dev(ul, t7);
|
|
append_dev(ul, li3);
|
|
append_dev(li3, button);
|
|
mount_component(icon5, button, null);
|
|
append_dev(button, t8);
|
|
append_dev(content, t9);
|
|
append_dev(content, main);
|
|
append_dev(main, left);
|
|
append_dev(left, figure);
|
|
append_dev(figure, img);
|
|
append_dev(figure, t10);
|
|
append_dev(figure, figcaption);
|
|
append_dev(figcaption, a1);
|
|
append_dev(figcaption, t12);
|
|
append_dev(figcaption, a2);
|
|
append_dev(figcaption, t14);
|
|
append_dev(figcaption, p);
|
|
append_dev(figcaption, t16);
|
|
append_dev(figcaption, video_actions);
|
|
append_dev(video_actions, likes);
|
|
append_dev(video_actions, t18);
|
|
append_dev(video_actions, video_buttons);
|
|
mount_component(icon6, video_buttons, null);
|
|
append_dev(video_buttons, t19);
|
|
mount_component(icon7, video_buttons, null);
|
|
append_dev(video_buttons, t20);
|
|
mount_component(icon8, video_buttons, null);
|
|
append_dev(video_buttons, t21);
|
|
mount_component(icon9, video_buttons, null);
|
|
append_dev(video_buttons, t22);
|
|
mount_component(icon10, video_buttons, null);
|
|
current = true;
|
|
},
|
|
p: noop,
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(icon0.$$.fragment, local);
|
|
transition_in(icon1.$$.fragment, local);
|
|
transition_in(icon2.$$.fragment, local);
|
|
transition_in(icon3.$$.fragment, local);
|
|
transition_in(icon4.$$.fragment, local);
|
|
transition_in(icon5.$$.fragment, local);
|
|
transition_in(icon6.$$.fragment, local);
|
|
transition_in(icon7.$$.fragment, local);
|
|
transition_in(icon8.$$.fragment, local);
|
|
transition_in(icon9.$$.fragment, local);
|
|
transition_in(icon10.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(icon0.$$.fragment, local);
|
|
transition_out(icon1.$$.fragment, local);
|
|
transition_out(icon2.$$.fragment, local);
|
|
transition_out(icon3.$$.fragment, local);
|
|
transition_out(icon4.$$.fragment, local);
|
|
transition_out(icon5.$$.fragment, local);
|
|
transition_out(icon6.$$.fragment, local);
|
|
transition_out(icon7.$$.fragment, local);
|
|
transition_out(icon8.$$.fragment, local);
|
|
transition_out(icon9.$$.fragment, local);
|
|
transition_out(icon10.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(content);
|
|
destroy_component(icon0);
|
|
destroy_component(icon1);
|
|
destroy_component(icon2);
|
|
destroy_component(icon3);
|
|
destroy_component(icon4);
|
|
destroy_component(icon5);
|
|
destroy_component(icon6);
|
|
destroy_component(icon7);
|
|
destroy_component(icon8);
|
|
destroy_component(icon9);
|
|
destroy_component(icon10);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$5.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function instance$5($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Youtube", slots, []);
|
|
let cards = [1, 2, 3, 4];
|
|
const writable_props = [];
|
|
|
|
Object.keys($$props).forEach(key => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(`<Youtube> was created with unknown prop '${key}'`);
|
|
});
|
|
|
|
$$self.$capture_state = () => ({ Icon, cards });
|
|
|
|
$$self.$inject_state = $$props => {
|
|
if ("cards" in $$props) cards = $$props.cards;
|
|
};
|
|
|
|
if ($$props && "$$inject" in $$props) {
|
|
$$self.$inject_state($$props.$$inject);
|
|
}
|
|
|
|
return [];
|
|
}
|
|
|
|
class Youtube extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$5, create_fragment$5, safe_not_equal, {});
|
|
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Youtube",
|
|
options,
|
|
id: create_fragment$5.name
|
|
});
|
|
}
|
|
}
|
|
|
|
/* src/thumbs/Instagram.svelte generated by Svelte v3.30.0 */
|
|
const file$5 = "src/thumbs/Instagram.svelte";
|
|
|
|
function get_each_context(ctx, list, i) {
|
|
const child_ctx = ctx.slice();
|
|
child_ctx[1] = list[i];
|
|
return child_ctx;
|
|
}
|
|
|
|
// (108:2) {#each pins as pin}
|
|
function create_each_block(ctx) {
|
|
let figure;
|
|
let img;
|
|
let img_src_value;
|
|
let t;
|
|
|
|
const block = {
|
|
c: function create() {
|
|
figure = element("figure");
|
|
img = element("img");
|
|
t = space();
|
|
attr_dev(img, "alt", "Stock photo");
|
|
if (img.src !== (img_src_value = "https://via.placeholder.com/82x82?text=Story")) attr_dev(img, "src", img_src_value);
|
|
add_location(img, file$5, 109, 6, 1889);
|
|
add_location(figure, file$5, 108, 4, 1874);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, figure, anchor);
|
|
append_dev(figure, img);
|
|
append_dev(figure, t);
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(figure);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_each_block.name,
|
|
type: "each",
|
|
source: "(108:2) {#each pins as pin}",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function create_fragment$6(ctx) {
|
|
let content;
|
|
let header;
|
|
let nav;
|
|
let b0;
|
|
let icon;
|
|
let t0;
|
|
let t1;
|
|
let input;
|
|
let t2;
|
|
let ul;
|
|
let li0;
|
|
let button0;
|
|
let t4;
|
|
let li1;
|
|
let a0;
|
|
let t6;
|
|
let profile;
|
|
let figure;
|
|
let img;
|
|
let img_src_value;
|
|
let t7;
|
|
let info;
|
|
let p0;
|
|
let b1;
|
|
let t9;
|
|
let button1;
|
|
let t11;
|
|
let p1;
|
|
let b2;
|
|
let t13;
|
|
let b3;
|
|
let t15;
|
|
let b4;
|
|
let t17;
|
|
let p2;
|
|
let b5;
|
|
let t19;
|
|
let p3;
|
|
let t20;
|
|
let br;
|
|
let t21;
|
|
let a1;
|
|
let t23;
|
|
let pins_1;
|
|
let current;
|
|
|
|
icon = new Icon({
|
|
props: {
|
|
name: "instagram",
|
|
color: "var(--color-text)"
|
|
},
|
|
$$inline: true
|
|
});
|
|
|
|
let each_value = /*pins*/ ctx[0];
|
|
validate_each_argument(each_value);
|
|
let each_blocks = [];
|
|
|
|
for (let i = 0; i < each_value.length; i += 1) {
|
|
each_blocks[i] = create_each_block(get_each_context(ctx, each_value, i));
|
|
}
|
|
|
|
const block = {
|
|
c: function create() {
|
|
content = element("content");
|
|
header = element("header");
|
|
nav = element("nav");
|
|
b0 = element("b");
|
|
create_component(icon.$$.fragment);
|
|
t0 = text(" Instagram");
|
|
t1 = space();
|
|
input = element("input");
|
|
t2 = space();
|
|
ul = element("ul");
|
|
li0 = element("li");
|
|
button0 = element("button");
|
|
button0.textContent = "Log In";
|
|
t4 = space();
|
|
li1 = element("li");
|
|
a0 = element("a");
|
|
a0.textContent = "Sign Up";
|
|
t6 = space();
|
|
profile = element("profile");
|
|
figure = element("figure");
|
|
img = element("img");
|
|
t7 = space();
|
|
info = element("info");
|
|
p0 = element("p");
|
|
b1 = element("b");
|
|
b1.textContent = "zedshaw";
|
|
t9 = space();
|
|
button1 = element("button");
|
|
button1.textContent = "follow";
|
|
t11 = space();
|
|
p1 = element("p");
|
|
b2 = element("b");
|
|
b2.textContent = "280";
|
|
t13 = text(" posts ");
|
|
b3 = element("b");
|
|
b3.textContent = "4,695 followers";
|
|
t15 = space();
|
|
b4 = element("b");
|
|
b4.textContent = "1,778 following";
|
|
t17 = space();
|
|
p2 = element("p");
|
|
b5 = element("b");
|
|
b5.textContent = "Zed A. Shaw";
|
|
t19 = space();
|
|
p3 = element("p");
|
|
t20 = text("Painter in oil, watercolor, and pastel. I’m doing live streams of little paintings on Twitch:");
|
|
br = element("br");
|
|
t21 = space();
|
|
a1 = element("a");
|
|
a1.textContent = "www.twitch.tv/zedashaw";
|
|
t23 = space();
|
|
pins_1 = element("pins");
|
|
|
|
for (let i = 0; i < each_blocks.length; i += 1) {
|
|
each_blocks[i].c();
|
|
}
|
|
|
|
add_location(b0, file$5, 76, 6, 1071);
|
|
attr_dev(input, "placeholder", "Search");
|
|
add_location(input, file$5, 77, 6, 1146);
|
|
attr_dev(button0, "class", "svelte-oov5yx");
|
|
add_location(button0, file$5, 79, 12, 1198);
|
|
add_location(li0, file$5, 79, 8, 1194);
|
|
attr_dev(a0, "class", "svelte-oov5yx");
|
|
add_location(a0, file$5, 80, 12, 1239);
|
|
add_location(li1, file$5, 80, 8, 1235);
|
|
add_location(ul, file$5, 78, 6, 1181);
|
|
attr_dev(nav, "class", "svelte-oov5yx");
|
|
add_location(nav, file$5, 75, 4, 1059);
|
|
attr_dev(header, "class", "svelte-oov5yx");
|
|
add_location(header, file$5, 74, 2, 1046);
|
|
attr_dev(img, "alt", "Zed's Face");
|
|
if (img.src !== (img_src_value = "https://via.placeholder.com/256x256?text=Zed's Face")) attr_dev(img, "src", img_src_value);
|
|
add_location(img, file$5, 87, 6, 1326);
|
|
attr_dev(figure, "class", "svelte-oov5yx");
|
|
add_location(figure, file$5, 86, 4, 1311);
|
|
add_location(b1, file$5, 92, 8, 1451);
|
|
attr_dev(button1, "class", "svelte-oov5yx");
|
|
add_location(button1, file$5, 92, 23, 1466);
|
|
attr_dev(p0, "class", "svelte-oov5yx");
|
|
add_location(p0, file$5, 91, 6, 1439);
|
|
add_location(b2, file$5, 96, 8, 1520);
|
|
add_location(b3, file$5, 96, 25, 1537);
|
|
add_location(b4, file$5, 96, 48, 1560);
|
|
attr_dev(p1, "class", "svelte-oov5yx");
|
|
add_location(p1, file$5, 95, 6, 1508);
|
|
add_location(b5, file$5, 99, 9, 1604);
|
|
attr_dev(p2, "class", "svelte-oov5yx");
|
|
add_location(p2, file$5, 99, 6, 1601);
|
|
add_location(br, file$5, 100, 102, 1729);
|
|
attr_dev(a1, "href", "www.twitch.tv/zedashaw");
|
|
attr_dev(a1, "class", "svelte-oov5yx");
|
|
add_location(a1, file$5, 101, 8, 1742);
|
|
attr_dev(p3, "class", "svelte-oov5yx");
|
|
add_location(p3, file$5, 100, 6, 1633);
|
|
attr_dev(info, "class", "svelte-oov5yx");
|
|
add_location(info, file$5, 90, 4, 1426);
|
|
attr_dev(profile, "class", "svelte-oov5yx");
|
|
add_location(profile, file$5, 85, 2, 1297);
|
|
attr_dev(pins_1, "class", "svelte-oov5yx");
|
|
add_location(pins_1, file$5, 106, 2, 1841);
|
|
attr_dev(content, "class", "svelte-oov5yx");
|
|
add_location(content, file$5, 73, 0, 1034);
|
|
},
|
|
l: function claim(nodes) {
|
|
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, content, anchor);
|
|
append_dev(content, header);
|
|
append_dev(header, nav);
|
|
append_dev(nav, b0);
|
|
mount_component(icon, b0, null);
|
|
append_dev(b0, t0);
|
|
append_dev(nav, t1);
|
|
append_dev(nav, input);
|
|
append_dev(nav, t2);
|
|
append_dev(nav, ul);
|
|
append_dev(ul, li0);
|
|
append_dev(li0, button0);
|
|
append_dev(ul, t4);
|
|
append_dev(ul, li1);
|
|
append_dev(li1, a0);
|
|
append_dev(content, t6);
|
|
append_dev(content, profile);
|
|
append_dev(profile, figure);
|
|
append_dev(figure, img);
|
|
append_dev(profile, t7);
|
|
append_dev(profile, info);
|
|
append_dev(info, p0);
|
|
append_dev(p0, b1);
|
|
append_dev(p0, t9);
|
|
append_dev(p0, button1);
|
|
append_dev(info, t11);
|
|
append_dev(info, p1);
|
|
append_dev(p1, b2);
|
|
append_dev(p1, t13);
|
|
append_dev(p1, b3);
|
|
append_dev(p1, t15);
|
|
append_dev(p1, b4);
|
|
append_dev(info, t17);
|
|
append_dev(info, p2);
|
|
append_dev(p2, b5);
|
|
append_dev(info, t19);
|
|
append_dev(info, p3);
|
|
append_dev(p3, t20);
|
|
append_dev(p3, br);
|
|
append_dev(p3, t21);
|
|
append_dev(p3, a1);
|
|
append_dev(content, t23);
|
|
append_dev(content, pins_1);
|
|
|
|
for (let i = 0; i < each_blocks.length; i += 1) {
|
|
each_blocks[i].m(pins_1, null);
|
|
}
|
|
|
|
current = true;
|
|
},
|
|
p: noop,
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(icon.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(icon.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(content);
|
|
destroy_component(icon);
|
|
destroy_each(each_blocks, detaching);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$6.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function instance$6($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Instagram", slots, []);
|
|
let pins = [1, 2, 3, 4];
|
|
const writable_props = [];
|
|
|
|
Object.keys($$props).forEach(key => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(`<Instagram> was created with unknown prop '${key}'`);
|
|
});
|
|
|
|
$$self.$capture_state = () => ({ link, Icon, pins });
|
|
|
|
$$self.$inject_state = $$props => {
|
|
if ("pins" in $$props) $$invalidate(0, pins = $$props.pins);
|
|
};
|
|
|
|
if ($$props && "$$inject" in $$props) {
|
|
$$self.$inject_state($$props.$$inject);
|
|
}
|
|
|
|
return [pins];
|
|
}
|
|
|
|
class Instagram extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$6, create_fragment$6, safe_not_equal, {});
|
|
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Instagram",
|
|
options,
|
|
id: create_fragment$6.name
|
|
});
|
|
}
|
|
}
|
|
|
|
/* src/thumbs/Pinterest.svelte generated by Svelte v3.30.0 */
|
|
const file$6 = "src/thumbs/Pinterest.svelte";
|
|
|
|
function create_fragment$7(ctx) {
|
|
let content;
|
|
let header;
|
|
let nav;
|
|
let left;
|
|
let logo;
|
|
let icon;
|
|
let t0;
|
|
let t1;
|
|
let a0;
|
|
let t3;
|
|
let a1;
|
|
let t5;
|
|
let input;
|
|
let t6;
|
|
let ul;
|
|
let li0;
|
|
let button0;
|
|
let t8;
|
|
let li1;
|
|
let button1;
|
|
let t10;
|
|
let profile;
|
|
let info;
|
|
let h1;
|
|
let t12;
|
|
let p0;
|
|
let t14;
|
|
let p1;
|
|
let b0;
|
|
let t16;
|
|
let b1;
|
|
let t18;
|
|
let t19;
|
|
let p2;
|
|
let t21;
|
|
let figure;
|
|
let img;
|
|
let img_src_value;
|
|
let current;
|
|
|
|
icon = new Icon({
|
|
props: { name: "pinterest", color: "var(--color)" },
|
|
$$inline: true
|
|
});
|
|
|
|
const block = {
|
|
c: function create() {
|
|
content = element("content");
|
|
header = element("header");
|
|
nav = element("nav");
|
|
left = element("left");
|
|
logo = element("logo");
|
|
create_component(icon.$$.fragment);
|
|
t0 = text(" Pinterest");
|
|
t1 = space();
|
|
a0 = element("a");
|
|
a0.textContent = "Today";
|
|
t3 = space();
|
|
a1 = element("a");
|
|
a1.textContent = "Explore";
|
|
t5 = space();
|
|
input = element("input");
|
|
t6 = space();
|
|
ul = element("ul");
|
|
li0 = element("li");
|
|
button0 = element("button");
|
|
button0.textContent = "Log In";
|
|
t8 = space();
|
|
li1 = element("li");
|
|
button1 = element("button");
|
|
button1.textContent = "Sign Up";
|
|
t10 = space();
|
|
profile = element("profile");
|
|
info = element("info");
|
|
h1 = element("h1");
|
|
h1.textContent = "Vincent van Gogh";
|
|
t12 = space();
|
|
p0 = element("p");
|
|
p0.textContent = "Collection by A Person";
|
|
t14 = space();
|
|
p1 = element("p");
|
|
b0 = element("b");
|
|
b0.textContent = "420";
|
|
t16 = text(" Pins • ");
|
|
b1 = element("b");
|
|
b1.textContent = "3.59k";
|
|
t18 = text(" Followers");
|
|
t19 = space();
|
|
p2 = element("p");
|
|
p2.textContent = "\"I dream my painting and I paint my dream.\" ~ Vincent van Gogh";
|
|
t21 = space();
|
|
figure = element("figure");
|
|
img = element("img");
|
|
attr_dev(logo, "class", "svelte-1w7ltga");
|
|
add_location(logo, file$6, 99, 6, 1437);
|
|
attr_dev(a0, "class", "svelte-1w7ltga");
|
|
add_location(a0, file$6, 100, 8, 1515);
|
|
attr_dev(a1, "class", "svelte-1w7ltga");
|
|
add_location(a1, file$6, 101, 8, 1536);
|
|
attr_dev(left, "class", "svelte-1w7ltga");
|
|
add_location(left, file$6, 98, 6, 1424);
|
|
attr_dev(input, "placeholder", "Search");
|
|
attr_dev(input, "class", "svelte-1w7ltga");
|
|
add_location(input, file$6, 104, 6, 1572);
|
|
attr_dev(button0, "class", "svelte-1w7ltga");
|
|
add_location(button0, file$6, 107, 12, 1625);
|
|
attr_dev(li0, "class", "svelte-1w7ltga");
|
|
add_location(li0, file$6, 107, 8, 1621);
|
|
attr_dev(button1, "id", "signup");
|
|
attr_dev(button1, "class", "svelte-1w7ltga");
|
|
add_location(button1, file$6, 108, 12, 1666);
|
|
attr_dev(li1, "class", "svelte-1w7ltga");
|
|
add_location(li1, file$6, 108, 8, 1662);
|
|
attr_dev(ul, "class", "svelte-1w7ltga");
|
|
add_location(ul, file$6, 106, 6, 1608);
|
|
attr_dev(nav, "class", "svelte-1w7ltga");
|
|
add_location(nav, file$6, 97, 4, 1412);
|
|
attr_dev(header, "class", "svelte-1w7ltga");
|
|
add_location(header, file$6, 96, 2, 1399);
|
|
attr_dev(h1, "class", "svelte-1w7ltga");
|
|
add_location(h1, file$6, 115, 2, 1767);
|
|
attr_dev(p0, "class", "svelte-1w7ltga");
|
|
add_location(p0, file$6, 116, 2, 1795);
|
|
attr_dev(b0, "class", "svelte-1w7ltga");
|
|
add_location(b0, file$6, 117, 5, 1830);
|
|
attr_dev(b1, "class", "svelte-1w7ltga");
|
|
add_location(b1, file$6, 117, 23, 1848);
|
|
attr_dev(p1, "class", "svelte-1w7ltga");
|
|
add_location(p1, file$6, 117, 2, 1827);
|
|
attr_dev(p2, "class", "svelte-1w7ltga");
|
|
add_location(p2, file$6, 118, 2, 1877);
|
|
attr_dev(info, "class", "svelte-1w7ltga");
|
|
add_location(info, file$6, 114, 2, 1758);
|
|
attr_dev(img, "alt", "Zed's Face");
|
|
if (img.src !== (img_src_value = "https://via.placeholder.com/128x128?text=Zed's Face")) attr_dev(img, "src", img_src_value);
|
|
attr_dev(img, "class", "svelte-1w7ltga");
|
|
add_location(img, file$6, 122, 4, 1969);
|
|
attr_dev(figure, "class", "svelte-1w7ltga");
|
|
add_location(figure, file$6, 121, 2, 1956);
|
|
attr_dev(profile, "class", "svelte-1w7ltga");
|
|
add_location(profile, file$6, 113, 2, 1746);
|
|
attr_dev(content, "class", "svelte-1w7ltga");
|
|
add_location(content, file$6, 95, 0, 1387);
|
|
},
|
|
l: function claim(nodes) {
|
|
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, content, anchor);
|
|
append_dev(content, header);
|
|
append_dev(header, nav);
|
|
append_dev(nav, left);
|
|
append_dev(left, logo);
|
|
mount_component(icon, logo, null);
|
|
append_dev(logo, t0);
|
|
append_dev(left, t1);
|
|
append_dev(left, a0);
|
|
append_dev(left, t3);
|
|
append_dev(left, a1);
|
|
append_dev(nav, t5);
|
|
append_dev(nav, input);
|
|
append_dev(nav, t6);
|
|
append_dev(nav, ul);
|
|
append_dev(ul, li0);
|
|
append_dev(li0, button0);
|
|
append_dev(ul, t8);
|
|
append_dev(ul, li1);
|
|
append_dev(li1, button1);
|
|
append_dev(content, t10);
|
|
append_dev(content, profile);
|
|
append_dev(profile, info);
|
|
append_dev(info, h1);
|
|
append_dev(info, t12);
|
|
append_dev(info, p0);
|
|
append_dev(info, t14);
|
|
append_dev(info, p1);
|
|
append_dev(p1, b0);
|
|
append_dev(p1, t16);
|
|
append_dev(p1, b1);
|
|
append_dev(p1, t18);
|
|
append_dev(info, t19);
|
|
append_dev(info, p2);
|
|
append_dev(profile, t21);
|
|
append_dev(profile, figure);
|
|
append_dev(figure, img);
|
|
current = true;
|
|
},
|
|
p: noop,
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(icon.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(icon.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(content);
|
|
destroy_component(icon);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$7.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function instance$7($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Pinterest", slots, []);
|
|
const writable_props = [];
|
|
|
|
Object.keys($$props).forEach(key => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(`<Pinterest> was created with unknown prop '${key}'`);
|
|
});
|
|
|
|
$$self.$capture_state = () => ({ Icon });
|
|
return [];
|
|
}
|
|
|
|
class Pinterest extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$7, create_fragment$7, safe_not_equal, {});
|
|
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Pinterest",
|
|
options,
|
|
id: create_fragment$7.name
|
|
});
|
|
}
|
|
}
|
|
|
|
/* src/thumbs/Login.svelte generated by Svelte v3.30.0 */
|
|
|
|
const file$7 = "src/thumbs/Login.svelte";
|
|
|
|
function create_fragment$8(ctx) {
|
|
let content;
|
|
let spacer0;
|
|
let t0;
|
|
let form;
|
|
let header;
|
|
let t2;
|
|
let label0;
|
|
let t4;
|
|
let input0;
|
|
let t5;
|
|
let label1;
|
|
let t7;
|
|
let input1;
|
|
let t8;
|
|
let br;
|
|
let t9;
|
|
let button;
|
|
let t11;
|
|
let spacer1;
|
|
|
|
const block = {
|
|
c: function create() {
|
|
content = element("content");
|
|
spacer0 = element("spacer");
|
|
t0 = space();
|
|
form = element("form");
|
|
header = element("header");
|
|
header.textContent = "Login";
|
|
t2 = space();
|
|
label0 = element("label");
|
|
label0.textContent = "Username";
|
|
t4 = space();
|
|
input0 = element("input");
|
|
t5 = space();
|
|
label1 = element("label");
|
|
label1.textContent = "Password";
|
|
t7 = space();
|
|
input1 = element("input");
|
|
t8 = space();
|
|
br = element("br");
|
|
t9 = space();
|
|
button = element("button");
|
|
button.textContent = "Login";
|
|
t11 = space();
|
|
spacer1 = element("spacer");
|
|
add_location(spacer0, file$7, 10, 2, 135);
|
|
add_location(header, file$7, 12, 4, 166);
|
|
attr_dev(label0, "for", "username");
|
|
add_location(label0, file$7, 13, 4, 193);
|
|
attr_dev(input0, "type", "text");
|
|
attr_dev(input0, "id", "username");
|
|
attr_dev(input0, "name", "username");
|
|
attr_dev(input0, "size", "32");
|
|
attr_dev(input0, "placeholder", "Username");
|
|
add_location(input0, file$7, 14, 4, 236);
|
|
attr_dev(label1, "for", "password");
|
|
add_location(label1, file$7, 15, 4, 323);
|
|
attr_dev(input1, "type", "password");
|
|
attr_dev(input1, "id", "password");
|
|
attr_dev(input1, "name", "password");
|
|
attr_dev(input1, "size", "32");
|
|
attr_dev(input1, "placeholder", "Password");
|
|
add_location(input1, file$7, 16, 4, 366);
|
|
add_location(br, file$7, 17, 4, 457);
|
|
attr_dev(button, "type", "submit");
|
|
add_location(button, file$7, 18, 4, 466);
|
|
add_location(form, file$7, 11, 2, 155);
|
|
add_location(spacer1, file$7, 20, 2, 515);
|
|
attr_dev(content, "class", "svelte-t7gl8c");
|
|
add_location(content, file$7, 9, 0, 123);
|
|
},
|
|
l: function claim(nodes) {
|
|
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, content, anchor);
|
|
append_dev(content, spacer0);
|
|
append_dev(content, t0);
|
|
append_dev(content, form);
|
|
append_dev(form, header);
|
|
append_dev(form, t2);
|
|
append_dev(form, label0);
|
|
append_dev(form, t4);
|
|
append_dev(form, input0);
|
|
append_dev(form, t5);
|
|
append_dev(form, label1);
|
|
append_dev(form, t7);
|
|
append_dev(form, input1);
|
|
append_dev(form, t8);
|
|
append_dev(form, br);
|
|
append_dev(form, t9);
|
|
append_dev(form, button);
|
|
append_dev(content, t11);
|
|
append_dev(content, spacer1);
|
|
},
|
|
p: noop,
|
|
i: noop,
|
|
o: noop,
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(content);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$8.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function instance$8($$self, $$props) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Login", slots, []);
|
|
const writable_props = [];
|
|
|
|
Object.keys($$props).forEach(key => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(`<Login> was created with unknown prop '${key}'`);
|
|
});
|
|
|
|
return [];
|
|
}
|
|
|
|
class Login extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$8, create_fragment$8, safe_not_equal, {});
|
|
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Login",
|
|
options,
|
|
id: create_fragment$8.name
|
|
});
|
|
}
|
|
}
|
|
|
|
/* src/demos/index.svelte generated by Svelte v3.30.0 */
|
|
const file$8 = "src/demos/index.svelte";
|
|
|
|
function create_fragment$9(ctx) {
|
|
let h1;
|
|
let t1;
|
|
let images;
|
|
let figure0;
|
|
let google;
|
|
let t2;
|
|
let figcaption0;
|
|
let t4;
|
|
let figure1;
|
|
let twitter;
|
|
let t5;
|
|
let figcaption1;
|
|
let t7;
|
|
let figure2;
|
|
let login;
|
|
let t8;
|
|
let figcaption2;
|
|
let t10;
|
|
let figure3;
|
|
let youtube;
|
|
let t11;
|
|
let figcaption3;
|
|
let t13;
|
|
let figure4;
|
|
let instagram;
|
|
let t14;
|
|
let figcaption4;
|
|
let t16;
|
|
let figure5;
|
|
let pinterest;
|
|
let t17;
|
|
let figcaption5;
|
|
let current;
|
|
let mounted;
|
|
let dispose;
|
|
google = new Google({ $$inline: true });
|
|
twitter = new Twitter({ $$inline: true });
|
|
login = new Login({ $$inline: true });
|
|
youtube = new Youtube({ $$inline: true });
|
|
instagram = new Instagram({ $$inline: true });
|
|
pinterest = new Pinterest({ $$inline: true });
|
|
|
|
const block = {
|
|
c: function create() {
|
|
h1 = element("h1");
|
|
h1.textContent = "A Compendium of Layout Demos";
|
|
t1 = space();
|
|
images = element("images");
|
|
figure0 = element("figure");
|
|
create_component(google.$$.fragment);
|
|
t2 = space();
|
|
figcaption0 = element("figcaption");
|
|
figcaption0.textContent = "Google";
|
|
t4 = space();
|
|
figure1 = element("figure");
|
|
create_component(twitter.$$.fragment);
|
|
t5 = space();
|
|
figcaption1 = element("figcaption");
|
|
figcaption1.textContent = "Twitter";
|
|
t7 = space();
|
|
figure2 = element("figure");
|
|
create_component(login.$$.fragment);
|
|
t8 = space();
|
|
figcaption2 = element("figcaption");
|
|
figcaption2.textContent = "Basic Login";
|
|
t10 = space();
|
|
figure3 = element("figure");
|
|
create_component(youtube.$$.fragment);
|
|
t11 = space();
|
|
figcaption3 = element("figcaption");
|
|
figcaption3.textContent = "Youtube";
|
|
t13 = space();
|
|
figure4 = element("figure");
|
|
create_component(instagram.$$.fragment);
|
|
t14 = space();
|
|
figcaption4 = element("figcaption");
|
|
figcaption4.textContent = "Instagram";
|
|
t16 = space();
|
|
figure5 = element("figure");
|
|
create_component(pinterest.$$.fragment);
|
|
t17 = space();
|
|
figcaption5 = element("figcaption");
|
|
figcaption5.textContent = "Pinterest";
|
|
add_location(h1, file$8, 47, 0, 1013);
|
|
attr_dev(figcaption0, "class", "svelte-1bny7ze");
|
|
add_location(figcaption0, file$8, 53, 2, 1129);
|
|
attr_dev(figure0, "class", "svelte-1bny7ze");
|
|
add_location(figure0, file$8, 51, 0, 1062);
|
|
attr_dev(figcaption1, "class", "svelte-1bny7ze");
|
|
add_location(figcaption1, file$8, 58, 2, 1239);
|
|
attr_dev(figure1, "class", "svelte-1bny7ze");
|
|
add_location(figure1, file$8, 56, 0, 1172);
|
|
attr_dev(figcaption2, "class", "svelte-1bny7ze");
|
|
add_location(figcaption2, file$8, 63, 2, 1356);
|
|
attr_dev(figure2, "id", "main");
|
|
attr_dev(figure2, "class", "svelte-1bny7ze");
|
|
add_location(figure2, file$8, 61, 0, 1283);
|
|
attr_dev(figcaption3, "class", "svelte-1bny7ze");
|
|
add_location(figcaption3, file$8, 68, 2, 1471);
|
|
attr_dev(figure3, "class", "svelte-1bny7ze");
|
|
add_location(figure3, file$8, 66, 0, 1404);
|
|
attr_dev(figcaption4, "class", "svelte-1bny7ze");
|
|
add_location(figcaption4, file$8, 73, 2, 1586);
|
|
attr_dev(figure4, "class", "svelte-1bny7ze");
|
|
add_location(figure4, file$8, 71, 0, 1515);
|
|
attr_dev(figcaption5, "class", "svelte-1bny7ze");
|
|
add_location(figcaption5, file$8, 78, 2, 1704);
|
|
attr_dev(figure5, "class", "svelte-1bny7ze");
|
|
add_location(figure5, file$8, 76, 0, 1633);
|
|
attr_dev(images, "class", "svelte-1bny7ze");
|
|
add_location(images, file$8, 49, 0, 1052);
|
|
},
|
|
l: function claim(nodes) {
|
|
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, h1, anchor);
|
|
insert_dev(target, t1, anchor);
|
|
insert_dev(target, images, anchor);
|
|
append_dev(images, figure0);
|
|
mount_component(google, figure0, null);
|
|
append_dev(figure0, t2);
|
|
append_dev(figure0, figcaption0);
|
|
append_dev(images, t4);
|
|
append_dev(images, figure1);
|
|
mount_component(twitter, figure1, null);
|
|
append_dev(figure1, t5);
|
|
append_dev(figure1, figcaption1);
|
|
append_dev(images, t7);
|
|
append_dev(images, figure2);
|
|
mount_component(login, figure2, null);
|
|
append_dev(figure2, t8);
|
|
append_dev(figure2, figcaption2);
|
|
append_dev(images, t10);
|
|
append_dev(images, figure3);
|
|
mount_component(youtube, figure3, null);
|
|
append_dev(figure3, t11);
|
|
append_dev(figure3, figcaption3);
|
|
append_dev(images, t13);
|
|
append_dev(images, figure4);
|
|
mount_component(instagram, figure4, null);
|
|
append_dev(figure4, t14);
|
|
append_dev(figure4, figcaption4);
|
|
append_dev(images, t16);
|
|
append_dev(images, figure5);
|
|
mount_component(pinterest, figure5, null);
|
|
append_dev(figure5, t17);
|
|
append_dev(figure5, figcaption5);
|
|
current = true;
|
|
|
|
if (!mounted) {
|
|
dispose = [
|
|
listen_dev(figure0, "click", /*click_handler*/ ctx[0], false, false, false),
|
|
listen_dev(figure1, "click", /*click_handler_1*/ ctx[1], false, false, false),
|
|
listen_dev(figure2, "click", /*click_handler_2*/ ctx[2], false, false, false),
|
|
listen_dev(figure3, "click", /*click_handler_3*/ ctx[3], false, false, false),
|
|
listen_dev(figure4, "click", /*click_handler_4*/ ctx[4], false, false, false),
|
|
listen_dev(figure5, "click", /*click_handler_5*/ ctx[5], false, false, false)
|
|
];
|
|
|
|
mounted = true;
|
|
}
|
|
},
|
|
p: noop,
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(google.$$.fragment, local);
|
|
transition_in(twitter.$$.fragment, local);
|
|
transition_in(login.$$.fragment, local);
|
|
transition_in(youtube.$$.fragment, local);
|
|
transition_in(instagram.$$.fragment, local);
|
|
transition_in(pinterest.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(google.$$.fragment, local);
|
|
transition_out(twitter.$$.fragment, local);
|
|
transition_out(login.$$.fragment, local);
|
|
transition_out(youtube.$$.fragment, local);
|
|
transition_out(instagram.$$.fragment, local);
|
|
transition_out(pinterest.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(h1);
|
|
if (detaching) detach_dev(t1);
|
|
if (detaching) detach_dev(images);
|
|
destroy_component(google);
|
|
destroy_component(twitter);
|
|
destroy_component(login);
|
|
destroy_component(youtube);
|
|
destroy_component(instagram);
|
|
destroy_component(pinterest);
|
|
mounted = false;
|
|
run_all(dispose);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$9.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function instance$9($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Demos", slots, []);
|
|
const writable_props = [];
|
|
|
|
Object.keys($$props).forEach(key => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(`<Demos> was created with unknown prop '${key}'`);
|
|
});
|
|
|
|
const click_handler = () => push("/demos/google");
|
|
const click_handler_1 = () => push("/demos/twitter");
|
|
const click_handler_2 = () => push("/demos/login");
|
|
const click_handler_3 = () => push("/demos/youtube");
|
|
const click_handler_4 = () => push("/demos/instagram");
|
|
const click_handler_5 = () => push("/demos/pinterest");
|
|
|
|
$$self.$capture_state = () => ({
|
|
Google,
|
|
Twitter,
|
|
Youtube,
|
|
Instagram,
|
|
Pinterest,
|
|
Login,
|
|
push
|
|
});
|
|
|
|
return [
|
|
click_handler,
|
|
click_handler_1,
|
|
click_handler_2,
|
|
click_handler_3,
|
|
click_handler_4,
|
|
click_handler_5
|
|
];
|
|
}
|
|
|
|
class Demos extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$9, create_fragment$9, safe_not_equal, {});
|
|
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Demos",
|
|
options,
|
|
id: create_fragment$9.name
|
|
});
|
|
}
|
|
}
|
|
|
|
/* src/About.svelte generated by Svelte v3.30.0 */
|
|
|
|
const file$9 = "src/About.svelte";
|
|
|
|
function create_fragment$a(ctx) {
|
|
let h1;
|
|
|
|
const block = {
|
|
c: function create() {
|
|
h1 = element("h1");
|
|
h1.textContent = "About Page";
|
|
add_location(h1, file$9, 0, 0, 0);
|
|
},
|
|
l: function claim(nodes) {
|
|
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, h1, anchor);
|
|
},
|
|
p: noop,
|
|
i: noop,
|
|
o: noop,
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(h1);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$a.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function instance$a($$self, $$props) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("About", slots, []);
|
|
const writable_props = [];
|
|
|
|
Object.keys($$props).forEach(key => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(`<About> was created with unknown prop '${key}'`);
|
|
});
|
|
|
|
return [];
|
|
}
|
|
|
|
class About extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$a, create_fragment$a, safe_not_equal, {});
|
|
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "About",
|
|
options,
|
|
id: create_fragment$a.name
|
|
});
|
|
}
|
|
}
|
|
|
|
/* src/NotFound.svelte generated by Svelte v3.30.0 */
|
|
|
|
const file$a = "src/NotFound.svelte";
|
|
|
|
function create_fragment$b(ctx) {
|
|
let h1;
|
|
|
|
const block = {
|
|
c: function create() {
|
|
h1 = element("h1");
|
|
h1.textContent = "Not found";
|
|
add_location(h1, file$a, 0, 0, 0);
|
|
},
|
|
l: function claim(nodes) {
|
|
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, h1, anchor);
|
|
},
|
|
p: noop,
|
|
i: noop,
|
|
o: noop,
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(h1);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$b.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function instance$b($$self, $$props) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("NotFound", slots, []);
|
|
const writable_props = [];
|
|
|
|
Object.keys($$props).forEach(key => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(`<NotFound> was created with unknown prop '${key}'`);
|
|
});
|
|
|
|
return [];
|
|
}
|
|
|
|
class NotFound extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$b, create_fragment$b, safe_not_equal, {});
|
|
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "NotFound",
|
|
options,
|
|
id: create_fragment$b.name
|
|
});
|
|
}
|
|
}
|
|
|
|
/* src/demos/Google.svelte generated by Svelte v3.30.0 */
|
|
const file$b = "src/demos/Google.svelte";
|
|
|
|
function create_fragment$c(ctx) {
|
|
let content;
|
|
let header;
|
|
let nav;
|
|
let nav_left;
|
|
let a0;
|
|
let t1;
|
|
let a1;
|
|
let t3;
|
|
let ul;
|
|
let li0;
|
|
let t5;
|
|
let li1;
|
|
let t7;
|
|
let li2;
|
|
let icon;
|
|
let t8;
|
|
let li3;
|
|
let button0;
|
|
let t10;
|
|
let figure;
|
|
let a2;
|
|
let img;
|
|
let img_src_value;
|
|
let link_action;
|
|
let t11;
|
|
let search;
|
|
let input;
|
|
let t12;
|
|
let buttons;
|
|
let button1;
|
|
let t14;
|
|
let button2;
|
|
let current;
|
|
let mounted;
|
|
let dispose;
|
|
|
|
icon = new Icon({
|
|
props: { name: "grid", color: "#000" },
|
|
$$inline: true
|
|
});
|
|
|
|
const block = {
|
|
c: function create() {
|
|
content = element("content");
|
|
header = element("header");
|
|
nav = element("nav");
|
|
nav_left = element("nav-left");
|
|
a0 = element("a");
|
|
a0.textContent = "About";
|
|
t1 = space();
|
|
a1 = element("a");
|
|
a1.textContent = "Store";
|
|
t3 = space();
|
|
ul = element("ul");
|
|
li0 = element("li");
|
|
li0.textContent = "Gmail";
|
|
t5 = space();
|
|
li1 = element("li");
|
|
li1.textContent = "Image";
|
|
t7 = space();
|
|
li2 = element("li");
|
|
create_component(icon.$$.fragment);
|
|
t8 = space();
|
|
li3 = element("li");
|
|
button0 = element("button");
|
|
button0.textContent = "Sign In";
|
|
t10 = space();
|
|
figure = element("figure");
|
|
a2 = element("a");
|
|
img = element("img");
|
|
t11 = space();
|
|
search = element("search");
|
|
input = element("input");
|
|
t12 = space();
|
|
buttons = element("buttons");
|
|
button1 = element("button");
|
|
button1.textContent = "Google Search";
|
|
t14 = space();
|
|
button2 = element("button");
|
|
button2.textContent = "I'm Feeling Lucky";
|
|
attr_dev(a0, "class", "svelte-1xw0xeo");
|
|
add_location(a0, file$b, 75, 8, 1065);
|
|
attr_dev(a1, "class", "svelte-1xw0xeo");
|
|
add_location(a1, file$b, 76, 8, 1086);
|
|
add_location(nav_left, file$b, 74, 6, 1046);
|
|
add_location(li0, file$b, 79, 6, 1134);
|
|
add_location(li1, file$b, 80, 6, 1155);
|
|
add_location(li2, file$b, 81, 6, 1176);
|
|
attr_dev(button0, "class", "svelte-1xw0xeo");
|
|
add_location(button0, file$b, 82, 10, 1229);
|
|
add_location(li3, file$b, 82, 6, 1225);
|
|
add_location(ul, file$b, 78, 6, 1123);
|
|
attr_dev(nav, "class", "svelte-1xw0xeo");
|
|
add_location(nav, file$b, 73, 4, 1034);
|
|
attr_dev(header, "class", "svelte-1xw0xeo");
|
|
add_location(header, file$b, 72, 2, 1021);
|
|
if (img.src !== (img_src_value = "https://via.placeholder.com/500x200?text=Google+Doodle")) attr_dev(img, "src", img_src_value);
|
|
add_location(img, file$b, 89, 6, 1350);
|
|
attr_dev(a2, "href", "/demos/google");
|
|
attr_dev(a2, "class", "svelte-1xw0xeo");
|
|
add_location(a2, file$b, 88, 4, 1310);
|
|
attr_dev(figure, "class", "svelte-1xw0xeo");
|
|
add_location(figure, file$b, 87, 2, 1297);
|
|
attr_dev(input, "type", "text");
|
|
attr_dev(input, "class", "svelte-1xw0xeo");
|
|
add_location(input, file$b, 94, 2, 1452);
|
|
attr_dev(button1, "class", "svelte-1xw0xeo");
|
|
add_location(button1, file$b, 96, 6, 1492);
|
|
attr_dev(button2, "class", "svelte-1xw0xeo");
|
|
add_location(button2, file$b, 97, 6, 1529);
|
|
attr_dev(buttons, "class", "svelte-1xw0xeo");
|
|
add_location(buttons, file$b, 95, 4, 1476);
|
|
attr_dev(search, "class", "svelte-1xw0xeo");
|
|
add_location(search, file$b, 93, 2, 1441);
|
|
attr_dev(content, "class", "svelte-1xw0xeo");
|
|
add_location(content, file$b, 70, 0, 1008);
|
|
},
|
|
l: function claim(nodes) {
|
|
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, content, anchor);
|
|
append_dev(content, header);
|
|
append_dev(header, nav);
|
|
append_dev(nav, nav_left);
|
|
append_dev(nav_left, a0);
|
|
append_dev(nav_left, t1);
|
|
append_dev(nav_left, a1);
|
|
append_dev(nav, t3);
|
|
append_dev(nav, ul);
|
|
append_dev(ul, li0);
|
|
append_dev(ul, t5);
|
|
append_dev(ul, li1);
|
|
append_dev(ul, t7);
|
|
append_dev(ul, li2);
|
|
mount_component(icon, li2, null);
|
|
append_dev(ul, t8);
|
|
append_dev(ul, li3);
|
|
append_dev(li3, button0);
|
|
append_dev(content, t10);
|
|
append_dev(content, figure);
|
|
append_dev(figure, a2);
|
|
append_dev(a2, img);
|
|
append_dev(content, t11);
|
|
append_dev(content, search);
|
|
append_dev(search, input);
|
|
append_dev(search, t12);
|
|
append_dev(search, buttons);
|
|
append_dev(buttons, button1);
|
|
append_dev(buttons, t14);
|
|
append_dev(buttons, button2);
|
|
current = true;
|
|
|
|
if (!mounted) {
|
|
dispose = action_destroyer(link_action = link.call(null, a2));
|
|
mounted = true;
|
|
}
|
|
},
|
|
p: noop,
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(icon.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(icon.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(content);
|
|
destroy_component(icon);
|
|
mounted = false;
|
|
dispose();
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$c.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function instance$c($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Google", slots, []);
|
|
const writable_props = [];
|
|
|
|
Object.keys($$props).forEach(key => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(`<Google> was created with unknown prop '${key}'`);
|
|
});
|
|
|
|
$$self.$capture_state = () => ({ link, Icon });
|
|
return [];
|
|
}
|
|
|
|
class Google$1 extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$c, create_fragment$c, safe_not_equal, {});
|
|
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Google",
|
|
options,
|
|
id: create_fragment$c.name
|
|
});
|
|
}
|
|
}
|
|
|
|
function fade(node, { delay = 0, duration = 400, easing = identity }) {
|
|
const o = +getComputedStyle(node).opacity;
|
|
return {
|
|
delay,
|
|
duration,
|
|
easing,
|
|
css: t => `opacity: ${t * o}`
|
|
};
|
|
}
|
|
|
|
/* src/components/CodeBubble.svelte generated by Svelte v3.30.0 */
|
|
|
|
const { window: window_1 } = globals;
|
|
const file$c = "src/components/CodeBubble.svelte";
|
|
|
|
// (36:0) {#if visible}
|
|
function create_if_block$1(ctx) {
|
|
let code_bubble;
|
|
let button;
|
|
let icon;
|
|
let button_transition;
|
|
let current;
|
|
let mounted;
|
|
let dispose;
|
|
|
|
icon = new Icon({
|
|
props: { name: "code", size: "32" },
|
|
$$inline: true
|
|
});
|
|
|
|
const block = {
|
|
c: function create() {
|
|
code_bubble = element("code-bubble");
|
|
button = element("button");
|
|
create_component(icon.$$.fragment);
|
|
attr_dev(button, "class", "svelte-1p875ep");
|
|
add_location(button, file$c, 37, 4, 787);
|
|
set_custom_element_data(code_bubble, "class", "svelte-1p875ep");
|
|
add_location(code_bubble, file$c, 36, 2, 769);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, code_bubble, anchor);
|
|
append_dev(code_bubble, button);
|
|
mount_component(icon, button, null);
|
|
current = true;
|
|
|
|
if (!mounted) {
|
|
dispose = listen_dev(button, "click", /*click_handler*/ ctx[4], false, false, false);
|
|
mounted = true;
|
|
}
|
|
},
|
|
p: noop,
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(icon.$$.fragment, local);
|
|
|
|
add_render_callback(() => {
|
|
if (!button_transition) button_transition = create_bidirectional_transition(button, fade, {}, true);
|
|
button_transition.run(1);
|
|
});
|
|
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(icon.$$.fragment, local);
|
|
if (!button_transition) button_transition = create_bidirectional_transition(button, fade, {}, false);
|
|
button_transition.run(0);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(code_bubble);
|
|
destroy_component(icon);
|
|
if (detaching && button_transition) button_transition.end();
|
|
mounted = false;
|
|
dispose();
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_if_block$1.name,
|
|
type: "if",
|
|
source: "(36:0) {#if visible}",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function create_fragment$d(ctx) {
|
|
let if_block_anchor;
|
|
let current;
|
|
let mounted;
|
|
let dispose;
|
|
let if_block = /*visible*/ ctx[0] && create_if_block$1(ctx);
|
|
|
|
const block = {
|
|
c: function create() {
|
|
if (if_block) if_block.c();
|
|
if_block_anchor = empty();
|
|
},
|
|
l: function claim(nodes) {
|
|
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
|
|
},
|
|
m: function mount(target, anchor) {
|
|
if (if_block) if_block.m(target, anchor);
|
|
insert_dev(target, if_block_anchor, anchor);
|
|
current = true;
|
|
|
|
if (!mounted) {
|
|
dispose = listen_dev(window_1, "scroll", /*hide_code_button*/ ctx[2], false, false, false);
|
|
mounted = true;
|
|
}
|
|
},
|
|
p: function update(ctx, [dirty]) {
|
|
if (/*visible*/ ctx[0]) {
|
|
if (if_block) {
|
|
if_block.p(ctx, dirty);
|
|
|
|
if (dirty & /*visible*/ 1) {
|
|
transition_in(if_block, 1);
|
|
}
|
|
} else {
|
|
if_block = create_if_block$1(ctx);
|
|
if_block.c();
|
|
transition_in(if_block, 1);
|
|
if_block.m(if_block_anchor.parentNode, if_block_anchor);
|
|
}
|
|
} else if (if_block) {
|
|
group_outros();
|
|
|
|
transition_out(if_block, 1, 1, () => {
|
|
if_block = null;
|
|
});
|
|
|
|
check_outros();
|
|
}
|
|
},
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(if_block);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(if_block);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (if_block) if_block.d(detaching);
|
|
if (detaching) detach_dev(if_block_anchor);
|
|
mounted = false;
|
|
dispose();
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$d.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function instance$d($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("CodeBubble", slots, []);
|
|
let { visible = false } = $$props;
|
|
let { url = "" } = $$props;
|
|
const dispatch = createEventDispatcher();
|
|
|
|
const hide_code_button = () => {
|
|
if (window.innerHeight + window.scrollY >= document.body.offsetHeight) {
|
|
$$invalidate(0, visible = false);
|
|
} else {
|
|
$$invalidate(0, visible = true);
|
|
}
|
|
};
|
|
|
|
const writable_props = ["visible", "url"];
|
|
|
|
Object.keys($$props).forEach(key => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(`<CodeBubble> was created with unknown prop '${key}'`);
|
|
});
|
|
|
|
const click_handler = () => dispatch("click");
|
|
|
|
$$self.$$set = $$props => {
|
|
if ("visible" in $$props) $$invalidate(0, visible = $$props.visible);
|
|
if ("url" in $$props) $$invalidate(3, url = $$props.url);
|
|
};
|
|
|
|
$$self.$capture_state = () => ({
|
|
Icon,
|
|
fade,
|
|
visible,
|
|
url,
|
|
createEventDispatcher,
|
|
dispatch,
|
|
hide_code_button
|
|
});
|
|
|
|
$$self.$inject_state = $$props => {
|
|
if ("visible" in $$props) $$invalidate(0, visible = $$props.visible);
|
|
if ("url" in $$props) $$invalidate(3, url = $$props.url);
|
|
};
|
|
|
|
if ($$props && "$$inject" in $$props) {
|
|
$$self.$inject_state($$props.$$inject);
|
|
}
|
|
|
|
return [visible, dispatch, hide_code_button, url, click_handler];
|
|
}
|
|
|
|
class CodeBubble extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$d, create_fragment$d, safe_not_equal, { visible: 0, url: 3 });
|
|
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "CodeBubble",
|
|
options,
|
|
id: create_fragment$d.name
|
|
});
|
|
}
|
|
|
|
get visible() {
|
|
throw new Error("<CodeBubble>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
set visible(value) {
|
|
throw new Error("<CodeBubble>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
get url() {
|
|
throw new Error("<CodeBubble>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
set url(value) {
|
|
throw new Error("<CodeBubble>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
}
|
|
|
|
/* src/components/Modal.svelte generated by Svelte v3.30.0 */
|
|
const file$d = "src/components/Modal.svelte";
|
|
|
|
// (38:0) {#if visible}
|
|
function create_if_block$2(ctx) {
|
|
let modal;
|
|
let modal_content;
|
|
let current;
|
|
let mounted;
|
|
let dispose;
|
|
const default_slot_template = /*#slots*/ ctx[3].default;
|
|
const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[2], null);
|
|
|
|
const block = {
|
|
c: function create() {
|
|
modal = element("modal");
|
|
modal_content = element("modal-content");
|
|
if (default_slot) default_slot.c();
|
|
set_custom_element_data(modal_content, "class", "svelte-7akfqw");
|
|
add_location(modal_content, file$d, 39, 2, 851);
|
|
attr_dev(modal, "class", "svelte-7akfqw");
|
|
add_location(modal, file$d, 38, 2, 804);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, modal, anchor);
|
|
append_dev(modal, modal_content);
|
|
|
|
if (default_slot) {
|
|
default_slot.m(modal_content, null);
|
|
}
|
|
|
|
current = true;
|
|
|
|
if (!mounted) {
|
|
dispose = listen_dev(modal, "click", /*click_handler*/ ctx[4], false, false, false);
|
|
mounted = true;
|
|
}
|
|
},
|
|
p: function update(ctx, dirty) {
|
|
if (default_slot) {
|
|
if (default_slot.p && dirty & /*$$scope*/ 4) {
|
|
update_slot(default_slot, default_slot_template, ctx, /*$$scope*/ ctx[2], dirty, null, null);
|
|
}
|
|
}
|
|
},
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(default_slot, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(default_slot, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(modal);
|
|
if (default_slot) default_slot.d(detaching);
|
|
mounted = false;
|
|
dispose();
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_if_block$2.name,
|
|
type: "if",
|
|
source: "(38:0) {#if visible}",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function create_fragment$e(ctx) {
|
|
let if_block_anchor;
|
|
let current;
|
|
let if_block = /*visible*/ ctx[0] && create_if_block$2(ctx);
|
|
|
|
const block = {
|
|
c: function create() {
|
|
if (if_block) if_block.c();
|
|
if_block_anchor = empty();
|
|
},
|
|
l: function claim(nodes) {
|
|
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
|
|
},
|
|
m: function mount(target, anchor) {
|
|
if (if_block) if_block.m(target, anchor);
|
|
insert_dev(target, if_block_anchor, anchor);
|
|
current = true;
|
|
},
|
|
p: function update(ctx, [dirty]) {
|
|
if (/*visible*/ ctx[0]) {
|
|
if (if_block) {
|
|
if_block.p(ctx, dirty);
|
|
|
|
if (dirty & /*visible*/ 1) {
|
|
transition_in(if_block, 1);
|
|
}
|
|
} else {
|
|
if_block = create_if_block$2(ctx);
|
|
if_block.c();
|
|
transition_in(if_block, 1);
|
|
if_block.m(if_block_anchor.parentNode, if_block_anchor);
|
|
}
|
|
} else if (if_block) {
|
|
group_outros();
|
|
|
|
transition_out(if_block, 1, 1, () => {
|
|
if_block = null;
|
|
});
|
|
|
|
check_outros();
|
|
}
|
|
},
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(if_block);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(if_block);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (if_block) if_block.d(detaching);
|
|
if (detaching) detach_dev(if_block_anchor);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$e.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function instance$e($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Modal", slots, ['default']);
|
|
let { visible = false } = $$props;
|
|
const dispatch = createEventDispatcher();
|
|
const writable_props = ["visible"];
|
|
|
|
Object.keys($$props).forEach(key => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(`<Modal> was created with unknown prop '${key}'`);
|
|
});
|
|
|
|
const click_handler = () => dispatch("click");
|
|
|
|
$$self.$$set = $$props => {
|
|
if ("visible" in $$props) $$invalidate(0, visible = $$props.visible);
|
|
if ("$$scope" in $$props) $$invalidate(2, $$scope = $$props.$$scope);
|
|
};
|
|
|
|
$$self.$capture_state = () => ({
|
|
Icon,
|
|
fade,
|
|
visible,
|
|
createEventDispatcher,
|
|
dispatch
|
|
});
|
|
|
|
$$self.$inject_state = $$props => {
|
|
if ("visible" in $$props) $$invalidate(0, visible = $$props.visible);
|
|
};
|
|
|
|
if ($$props && "$$inject" in $$props) {
|
|
$$self.$inject_state($$props.$$inject);
|
|
}
|
|
|
|
return [visible, dispatch, $$scope, slots, click_handler];
|
|
}
|
|
|
|
class Modal extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$e, create_fragment$e, safe_not_equal, { visible: 0 });
|
|
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Modal",
|
|
options,
|
|
id: create_fragment$e.name
|
|
});
|
|
}
|
|
|
|
get visible() {
|
|
throw new Error("<Modal>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
set visible(value) {
|
|
throw new Error("<Modal>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
}
|
|
|
|
/* src/demos/Twitter.svelte generated by Svelte v3.30.0 */
|
|
const file$e = "src/demos/Twitter.svelte";
|
|
|
|
function get_each_context$1(ctx, list, i) {
|
|
const child_ctx = ctx.slice();
|
|
child_ctx[3] = list[i];
|
|
return child_ctx;
|
|
}
|
|
|
|
// (244:4) {#each tweets as tweet}
|
|
function create_each_block$1(ctx) {
|
|
let tweet;
|
|
let figure;
|
|
let img;
|
|
let img_src_value;
|
|
let t0;
|
|
let post;
|
|
let h4;
|
|
let t2;
|
|
let p;
|
|
let t3;
|
|
let br;
|
|
let t4;
|
|
let a;
|
|
let t6;
|
|
let t7;
|
|
let actions;
|
|
let icon0;
|
|
let t8;
|
|
let icon1;
|
|
let t9;
|
|
let icon2;
|
|
let t10;
|
|
let icon3;
|
|
let t11;
|
|
let icon4;
|
|
let t12;
|
|
let current;
|
|
|
|
icon0 = new Icon({
|
|
props: {
|
|
size: "16",
|
|
name: "message-circle",
|
|
color: "var(--color-inactive)"
|
|
},
|
|
$$inline: true
|
|
});
|
|
|
|
icon1 = new Icon({
|
|
props: {
|
|
size: "16",
|
|
name: "repeat",
|
|
color: "var(--color-inactive)"
|
|
},
|
|
$$inline: true
|
|
});
|
|
|
|
icon2 = new Icon({
|
|
props: {
|
|
size: "16",
|
|
name: "heart",
|
|
color: "var(--color-inactive)"
|
|
},
|
|
$$inline: true
|
|
});
|
|
|
|
icon3 = new Icon({
|
|
props: {
|
|
size: "16",
|
|
name: "upload",
|
|
color: "var(--color-inactive)"
|
|
},
|
|
$$inline: true
|
|
});
|
|
|
|
icon4 = new Icon({
|
|
props: { name: "more-horizontal" },
|
|
$$inline: true
|
|
});
|
|
|
|
const block = {
|
|
c: function create() {
|
|
tweet = element("tweet");
|
|
figure = element("figure");
|
|
img = element("img");
|
|
t0 = space();
|
|
post = element("post");
|
|
h4 = element("h4");
|
|
h4.textContent = "Zed A. Shaw, Writer";
|
|
t2 = space();
|
|
p = element("p");
|
|
t3 = text("Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam: ");
|
|
br = element("br");
|
|
t4 = space();
|
|
a = element("a");
|
|
a.textContent = "quis nostrud exercitation";
|
|
t6 = text(" ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.");
|
|
t7 = space();
|
|
actions = element("actions");
|
|
create_component(icon0.$$.fragment);
|
|
t8 = text(" 2\n ");
|
|
create_component(icon1.$$.fragment);
|
|
t9 = text(" 1\n ");
|
|
create_component(icon2.$$.fragment);
|
|
t10 = text(" 12\n ");
|
|
create_component(icon3.$$.fragment);
|
|
t11 = space();
|
|
create_component(icon4.$$.fragment);
|
|
t12 = space();
|
|
attr_dev(img, "alt", "Stock photo");
|
|
if (img.src !== (img_src_value = "/profile_pic.jpg")) attr_dev(img, "src", img_src_value);
|
|
attr_dev(img, "class", "svelte-bnvc6y");
|
|
add_location(img, file$e, 246, 12, 4617);
|
|
attr_dev(figure, "id", "avatar");
|
|
attr_dev(figure, "class", "svelte-bnvc6y");
|
|
add_location(figure, file$e, 245, 8, 4584);
|
|
attr_dev(h4, "class", "svelte-bnvc6y");
|
|
add_location(h4, file$e, 249, 10, 4707);
|
|
add_location(br, file$e, 250, 162, 4898);
|
|
add_location(a, file$e, 252, 12, 4916);
|
|
attr_dev(p, "class", "svelte-bnvc6y");
|
|
add_location(p, file$e, 250, 10, 4746);
|
|
attr_dev(actions, "class", "svelte-bnvc6y");
|
|
add_location(actions, file$e, 253, 10, 5234);
|
|
attr_dev(post, "class", "svelte-bnvc6y");
|
|
add_location(post, file$e, 248, 8, 4690);
|
|
attr_dev(tweet, "class", "svelte-bnvc6y");
|
|
add_location(tweet, file$e, 244, 6, 4568);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, tweet, anchor);
|
|
append_dev(tweet, figure);
|
|
append_dev(figure, img);
|
|
append_dev(tweet, t0);
|
|
append_dev(tweet, post);
|
|
append_dev(post, h4);
|
|
append_dev(post, t2);
|
|
append_dev(post, p);
|
|
append_dev(p, t3);
|
|
append_dev(p, br);
|
|
append_dev(p, t4);
|
|
append_dev(p, a);
|
|
append_dev(p, t6);
|
|
append_dev(post, t7);
|
|
append_dev(post, actions);
|
|
mount_component(icon0, actions, null);
|
|
append_dev(actions, t8);
|
|
mount_component(icon1, actions, null);
|
|
append_dev(actions, t9);
|
|
mount_component(icon2, actions, null);
|
|
append_dev(actions, t10);
|
|
mount_component(icon3, actions, null);
|
|
append_dev(tweet, t11);
|
|
mount_component(icon4, tweet, null);
|
|
append_dev(tweet, t12);
|
|
current = true;
|
|
},
|
|
p: noop,
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(icon0.$$.fragment, local);
|
|
transition_in(icon1.$$.fragment, local);
|
|
transition_in(icon2.$$.fragment, local);
|
|
transition_in(icon3.$$.fragment, local);
|
|
transition_in(icon4.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(icon0.$$.fragment, local);
|
|
transition_out(icon1.$$.fragment, local);
|
|
transition_out(icon2.$$.fragment, local);
|
|
transition_out(icon3.$$.fragment, local);
|
|
transition_out(icon4.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(tweet);
|
|
destroy_component(icon0);
|
|
destroy_component(icon1);
|
|
destroy_component(icon2);
|
|
destroy_component(icon3);
|
|
destroy_component(icon4);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_each_block$1.name,
|
|
type: "each",
|
|
source: "(244:4) {#each tweets as tweet}",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
// (326:0) <Modal visible={modal_visible} on:click={ toggle_modal }>
|
|
function create_default_slot(ctx) {
|
|
let h1;
|
|
|
|
const block = {
|
|
c: function create() {
|
|
h1 = element("h1");
|
|
h1.textContent = "Hi! This is Cool!";
|
|
add_location(h1, file$e, 326, 2, 7471);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, h1, anchor);
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(h1);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_default_slot.name,
|
|
type: "slot",
|
|
source: "(326:0) <Modal visible={modal_visible} on:click={ toggle_modal }>",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function create_fragment$f(ctx) {
|
|
let content;
|
|
let left;
|
|
let icon0;
|
|
let t0;
|
|
let h40;
|
|
let t2;
|
|
let h41;
|
|
let icon1;
|
|
let t3;
|
|
let t4;
|
|
let middle;
|
|
let header;
|
|
let nav;
|
|
let back;
|
|
let icon2;
|
|
let t5;
|
|
let name;
|
|
let h42;
|
|
let t7;
|
|
let span;
|
|
let t9;
|
|
let images;
|
|
let figure0;
|
|
let img0;
|
|
let img0_src_value;
|
|
let t10;
|
|
let figure1;
|
|
let img1;
|
|
let img1_src_value;
|
|
let t11;
|
|
let button0;
|
|
let t13;
|
|
let profile;
|
|
let h30;
|
|
let t15;
|
|
let p0;
|
|
let t17;
|
|
let p1;
|
|
let t19;
|
|
let p2;
|
|
let icon3;
|
|
let t20;
|
|
let icon4;
|
|
let t21;
|
|
let a0;
|
|
let t23;
|
|
let icon5;
|
|
let t24;
|
|
let t25;
|
|
let p3;
|
|
let b0;
|
|
let t27;
|
|
let b1;
|
|
let t29;
|
|
let t30;
|
|
let hr;
|
|
let t31;
|
|
let tweets_1;
|
|
let t32;
|
|
let right;
|
|
let input;
|
|
let t33;
|
|
let section;
|
|
let aside0;
|
|
let h31;
|
|
let t35;
|
|
let p4;
|
|
let t37;
|
|
let button1;
|
|
let t39;
|
|
let aside1;
|
|
let recent_media;
|
|
let figure2;
|
|
let img2;
|
|
let img2_src_value;
|
|
let t40;
|
|
let figure3;
|
|
let img3;
|
|
let img3_src_value;
|
|
let t41;
|
|
let figure4;
|
|
let img4;
|
|
let img4_src_value;
|
|
let t42;
|
|
let figure5;
|
|
let img5;
|
|
let img5_src_value;
|
|
let t43;
|
|
let figure6;
|
|
let img6;
|
|
let img6_src_value;
|
|
let t44;
|
|
let figure7;
|
|
let img7;
|
|
let img7_src_value;
|
|
let t45;
|
|
let aside2;
|
|
let h32;
|
|
let t47;
|
|
let ul0;
|
|
let li0;
|
|
let t49;
|
|
let li1;
|
|
let t51;
|
|
let li2;
|
|
let t53;
|
|
let a1;
|
|
let t55;
|
|
let aside3;
|
|
let h33;
|
|
let t57;
|
|
let ul1;
|
|
let li3;
|
|
let t59;
|
|
let li4;
|
|
let t61;
|
|
let li5;
|
|
let t63;
|
|
let li6;
|
|
let t65;
|
|
let li7;
|
|
let t67;
|
|
let codebubble;
|
|
let t68;
|
|
let modal;
|
|
let current;
|
|
|
|
icon0 = new Icon({
|
|
props: { name: "twitter", color: "var(--color)" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon1 = new Icon({
|
|
props: {
|
|
name: "settings",
|
|
color: "var(--color-text)"
|
|
},
|
|
$$inline: true
|
|
});
|
|
|
|
icon2 = new Icon({
|
|
props: { name: "arrow-left" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon3 = new Icon({
|
|
props: {
|
|
name: "map",
|
|
size: "24",
|
|
color: "var(--color-bg-secondary)"
|
|
},
|
|
$$inline: true
|
|
});
|
|
|
|
icon4 = new Icon({
|
|
props: {
|
|
name: "link",
|
|
size: "24",
|
|
color: "var(--color-bg-secondary)"
|
|
},
|
|
$$inline: true
|
|
});
|
|
|
|
icon5 = new Icon({
|
|
props: {
|
|
name: "calendar",
|
|
size: "24",
|
|
color: "var(--color-bg-secondary)"
|
|
},
|
|
$$inline: true
|
|
});
|
|
|
|
let each_value = /*tweets*/ ctx[1];
|
|
validate_each_argument(each_value);
|
|
let each_blocks = [];
|
|
|
|
for (let i = 0; i < each_value.length; i += 1) {
|
|
each_blocks[i] = create_each_block$1(get_each_context$1(ctx, each_value, i));
|
|
}
|
|
|
|
codebubble = new CodeBubble({
|
|
props: {
|
|
url: "https://git.learnjsthehardway.com/"
|
|
},
|
|
$$inline: true
|
|
});
|
|
|
|
codebubble.$on("click", /*toggle_modal*/ ctx[2]);
|
|
|
|
modal = new Modal({
|
|
props: {
|
|
visible: /*modal_visible*/ ctx[0],
|
|
$$slots: { default: [create_default_slot] },
|
|
$$scope: { ctx }
|
|
},
|
|
$$inline: true
|
|
});
|
|
|
|
modal.$on("click", /*toggle_modal*/ ctx[2]);
|
|
|
|
const block = {
|
|
c: function create() {
|
|
content = element("content");
|
|
left = element("left");
|
|
create_component(icon0.$$.fragment);
|
|
t0 = space();
|
|
h40 = element("h4");
|
|
h40.textContent = "# Explore";
|
|
t2 = space();
|
|
h41 = element("h4");
|
|
create_component(icon1.$$.fragment);
|
|
t3 = text(" Settings");
|
|
t4 = space();
|
|
middle = element("middle");
|
|
header = element("header");
|
|
nav = element("nav");
|
|
back = element("back");
|
|
create_component(icon2.$$.fragment);
|
|
t5 = space();
|
|
name = element("name");
|
|
h42 = element("h4");
|
|
h42.textContent = "Zed A. Shaw, Writer";
|
|
t7 = space();
|
|
span = element("span");
|
|
span.textContent = "7,754 Tweets";
|
|
t9 = space();
|
|
images = element("images");
|
|
figure0 = element("figure");
|
|
img0 = element("img");
|
|
t10 = space();
|
|
figure1 = element("figure");
|
|
img1 = element("img");
|
|
t11 = space();
|
|
button0 = element("button");
|
|
button0.textContent = "Follow";
|
|
t13 = space();
|
|
profile = element("profile");
|
|
h30 = element("h3");
|
|
h30.textContent = "Zed A. Shaw, Writer";
|
|
t15 = space();
|
|
p0 = element("p");
|
|
p0.textContent = "@lzsthw";
|
|
t17 = space();
|
|
p1 = element("p");
|
|
p1.textContent = "The author of The Hard Way Series published by Addison/Wesley including Learn Python The Hard Way and many more. Follow me here for coding tips and book news.";
|
|
t19 = space();
|
|
p2 = element("p");
|
|
create_component(icon3.$$.fragment);
|
|
t20 = text(" Some Place, KY ");
|
|
create_component(icon4.$$.fragment);
|
|
t21 = space();
|
|
a0 = element("a");
|
|
a0.textContent = "learnjsthehardway.org";
|
|
t23 = space();
|
|
create_component(icon5.$$.fragment);
|
|
t24 = text(" Joined Jan, 1999.");
|
|
t25 = space();
|
|
p3 = element("p");
|
|
b0 = element("b");
|
|
b0.textContent = "167";
|
|
t27 = text(" Following ");
|
|
b1 = element("b");
|
|
b1.textContent = "10.4k";
|
|
t29 = text(" Followers");
|
|
t30 = space();
|
|
hr = element("hr");
|
|
t31 = space();
|
|
tweets_1 = element("tweets");
|
|
|
|
for (let i = 0; i < each_blocks.length; i += 1) {
|
|
each_blocks[i].c();
|
|
}
|
|
|
|
t32 = space();
|
|
right = element("right");
|
|
input = element("input");
|
|
t33 = space();
|
|
section = element("section");
|
|
aside0 = element("aside");
|
|
h31 = element("h3");
|
|
h31.textContent = "New to Twitter?";
|
|
t35 = space();
|
|
p4 = element("p");
|
|
p4.textContent = "Sign up now to get your own personalized hate stream!";
|
|
t37 = space();
|
|
button1 = element("button");
|
|
button1.textContent = "Sign Up";
|
|
t39 = space();
|
|
aside1 = element("aside");
|
|
recent_media = element("recent-media");
|
|
figure2 = element("figure");
|
|
img2 = element("img");
|
|
t40 = space();
|
|
figure3 = element("figure");
|
|
img3 = element("img");
|
|
t41 = space();
|
|
figure4 = element("figure");
|
|
img4 = element("img");
|
|
t42 = space();
|
|
figure5 = element("figure");
|
|
img5 = element("img");
|
|
t43 = space();
|
|
figure6 = element("figure");
|
|
img6 = element("img");
|
|
t44 = space();
|
|
figure7 = element("figure");
|
|
img7 = element("img");
|
|
t45 = space();
|
|
aside2 = element("aside");
|
|
h32 = element("h3");
|
|
h32.textContent = "You Might Like";
|
|
t47 = space();
|
|
ul0 = element("ul");
|
|
li0 = element("li");
|
|
li0.textContent = "Card Person";
|
|
t49 = space();
|
|
li1 = element("li");
|
|
li1.textContent = "Card Person";
|
|
t51 = space();
|
|
li2 = element("li");
|
|
li2.textContent = "Card Person";
|
|
t53 = space();
|
|
a1 = element("a");
|
|
a1.textContent = "Show More";
|
|
t55 = space();
|
|
aside3 = element("aside");
|
|
h33 = element("h3");
|
|
h33.textContent = "What's Happening";
|
|
t57 = space();
|
|
ul1 = element("ul");
|
|
li3 = element("li");
|
|
li3.textContent = "News news news.";
|
|
t59 = space();
|
|
li4 = element("li");
|
|
li4.textContent = "News news news.";
|
|
t61 = space();
|
|
li5 = element("li");
|
|
li5.textContent = "News news news.";
|
|
t63 = space();
|
|
li6 = element("li");
|
|
li6.textContent = "News news news.";
|
|
t65 = space();
|
|
li7 = element("li");
|
|
li7.textContent = "News news news.";
|
|
t67 = space();
|
|
create_component(codebubble.$$.fragment);
|
|
t68 = space();
|
|
create_component(modal.$$.fragment);
|
|
add_location(h40, file$e, 206, 2, 3367);
|
|
add_location(h41, file$e, 207, 2, 3388);
|
|
attr_dev(left, "class", "svelte-bnvc6y");
|
|
add_location(left, file$e, 204, 2, 3311);
|
|
attr_dev(back, "class", "svelte-bnvc6y");
|
|
add_location(back, file$e, 213, 8, 3512);
|
|
attr_dev(h42, "class", "svelte-bnvc6y");
|
|
add_location(h42, file$e, 215, 10, 3577);
|
|
attr_dev(span, "class", "svelte-bnvc6y");
|
|
add_location(span, file$e, 216, 10, 3616);
|
|
add_location(name, file$e, 214, 8, 3560);
|
|
attr_dev(nav, "class", "svelte-bnvc6y");
|
|
add_location(nav, file$e, 212, 6, 3498);
|
|
attr_dev(header, "class", "svelte-bnvc6y");
|
|
add_location(header, file$e, 211, 4, 3483);
|
|
if (img0.src !== (img0_src_value = "/header_pic.jpg")) attr_dev(img0, "src", img0_src_value);
|
|
attr_dev(img0, "class", "svelte-bnvc6y");
|
|
add_location(img0, file$e, 223, 8, 3738);
|
|
attr_dev(figure0, "id", "background");
|
|
attr_dev(figure0, "class", "svelte-bnvc6y");
|
|
add_location(figure0, file$e, 222, 6, 3705);
|
|
if (img1.src !== (img1_src_value = "/profile_pic.jpg")) attr_dev(img1, "src", img1_src_value);
|
|
attr_dev(img1, "class", "svelte-bnvc6y");
|
|
add_location(img1, file$e, 227, 8, 3818);
|
|
attr_dev(button0, "id", "follow");
|
|
attr_dev(button0, "class", "svelte-bnvc6y");
|
|
add_location(button0, file$e, 228, 8, 3855);
|
|
attr_dev(figure1, "id", "avatar");
|
|
attr_dev(figure1, "class", "svelte-bnvc6y");
|
|
add_location(figure1, file$e, 226, 6, 3789);
|
|
attr_dev(images, "class", "svelte-bnvc6y");
|
|
add_location(images, file$e, 221, 4, 3690);
|
|
add_location(h30, file$e, 233, 6, 3942);
|
|
add_location(p0, file$e, 234, 6, 3977);
|
|
add_location(p1, file$e, 235, 6, 3998);
|
|
add_location(a0, file$e, 236, 153, 4317);
|
|
add_location(p2, file$e, 236, 6, 4170);
|
|
add_location(b0, file$e, 237, 9, 4447);
|
|
add_location(b1, file$e, 237, 30, 4468);
|
|
add_location(p3, file$e, 237, 6, 4444);
|
|
attr_dev(profile, "class", "svelte-bnvc6y");
|
|
add_location(profile, file$e, 232, 4, 3926);
|
|
attr_dev(hr, "class", "svelte-bnvc6y");
|
|
add_location(hr, file$e, 240, 4, 4515);
|
|
add_location(tweets_1, file$e, 242, 4, 4525);
|
|
attr_dev(middle, "class", "svelte-bnvc6y");
|
|
add_location(middle, file$e, 210, 2, 3470);
|
|
attr_dev(input, "placeholder", "Search Twitter");
|
|
add_location(input, file$e, 267, 4, 5711);
|
|
add_location(h31, file$e, 271, 6, 5800);
|
|
attr_dev(p4, "class", "svelte-bnvc6y");
|
|
add_location(p4, file$e, 272, 6, 5831);
|
|
attr_dev(button1, "id", "signup");
|
|
attr_dev(button1, "class", "svelte-bnvc6y");
|
|
add_location(button1, file$e, 273, 6, 5898);
|
|
attr_dev(aside0, "id", "newperson");
|
|
attr_dev(aside0, "class", "svelte-bnvc6y");
|
|
add_location(aside0, file$e, 270, 6, 5771);
|
|
attr_dev(img2, "alt", "Stock photo");
|
|
if (img2.src !== (img2_src_value = "https://via.placeholder.com/82x82?text=Media")) attr_dev(img2, "src", img2_src_value);
|
|
add_location(img2, file$e, 279, 12, 6019);
|
|
add_location(figure2, file$e, 278, 10, 5998);
|
|
attr_dev(img3, "alt", "Stock photo");
|
|
if (img3.src !== (img3_src_value = "https://via.placeholder.com/82x82?text=Media")) attr_dev(img3, "src", img3_src_value);
|
|
add_location(img3, file$e, 282, 12, 6146);
|
|
add_location(figure3, file$e, 281, 10, 6125);
|
|
attr_dev(img4, "alt", "Stock photo");
|
|
if (img4.src !== (img4_src_value = "https://via.placeholder.com/82x82?text=Media")) attr_dev(img4, "src", img4_src_value);
|
|
add_location(img4, file$e, 285, 12, 6273);
|
|
add_location(figure4, file$e, 284, 10, 6252);
|
|
attr_dev(img5, "alt", "Stock photo");
|
|
if (img5.src !== (img5_src_value = "https://via.placeholder.com/82x82?text=Media")) attr_dev(img5, "src", img5_src_value);
|
|
add_location(img5, file$e, 288, 12, 6400);
|
|
add_location(figure5, file$e, 287, 10, 6379);
|
|
attr_dev(img6, "alt", "Stock photo");
|
|
if (img6.src !== (img6_src_value = "https://via.placeholder.com/82x82?text=Media")) attr_dev(img6, "src", img6_src_value);
|
|
add_location(img6, file$e, 291, 12, 6527);
|
|
add_location(figure6, file$e, 290, 10, 6506);
|
|
attr_dev(img7, "alt", "Stock photo");
|
|
if (img7.src !== (img7_src_value = "https://via.placeholder.com/82x82?text=Media")) attr_dev(img7, "src", img7_src_value);
|
|
add_location(img7, file$e, 294, 12, 6654);
|
|
add_location(figure7, file$e, 293, 10, 6633);
|
|
set_custom_element_data(recent_media, "class", "svelte-bnvc6y");
|
|
add_location(recent_media, file$e, 277, 8, 5973);
|
|
add_location(aside1, file$e, 276, 6, 5957);
|
|
attr_dev(h32, "class", "svelte-bnvc6y");
|
|
add_location(h32, file$e, 300, 8, 6826);
|
|
attr_dev(li0, "class", "svelte-bnvc6y");
|
|
add_location(li0, file$e, 302, 10, 6873);
|
|
attr_dev(li1, "class", "svelte-bnvc6y");
|
|
add_location(li1, file$e, 303, 10, 6904);
|
|
attr_dev(li2, "class", "svelte-bnvc6y");
|
|
add_location(li2, file$e, 304, 10, 6935);
|
|
attr_dev(ul0, "class", "svelte-bnvc6y");
|
|
add_location(ul0, file$e, 301, 8, 6858);
|
|
attr_dev(a1, "class", "svelte-bnvc6y");
|
|
add_location(a1, file$e, 306, 8, 6978);
|
|
attr_dev(aside2, "id", "trending");
|
|
attr_dev(aside2, "class", "svelte-bnvc6y");
|
|
add_location(aside2, file$e, 299, 6, 6796);
|
|
attr_dev(h33, "class", "svelte-bnvc6y");
|
|
add_location(h33, file$e, 310, 8, 7047);
|
|
attr_dev(li3, "class", "svelte-bnvc6y");
|
|
add_location(li3, file$e, 312, 10, 7096);
|
|
attr_dev(li4, "class", "svelte-bnvc6y");
|
|
add_location(li4, file$e, 313, 10, 7131);
|
|
attr_dev(li5, "class", "svelte-bnvc6y");
|
|
add_location(li5, file$e, 314, 10, 7166);
|
|
attr_dev(li6, "class", "svelte-bnvc6y");
|
|
add_location(li6, file$e, 315, 10, 7201);
|
|
attr_dev(li7, "class", "svelte-bnvc6y");
|
|
add_location(li7, file$e, 316, 10, 7236);
|
|
attr_dev(ul1, "class", "svelte-bnvc6y");
|
|
add_location(ul1, file$e, 311, 8, 7081);
|
|
attr_dev(aside3, "id", "trending");
|
|
attr_dev(aside3, "class", "svelte-bnvc6y");
|
|
add_location(aside3, file$e, 309, 6, 7017);
|
|
add_location(section, file$e, 269, 4, 5755);
|
|
attr_dev(right, "class", "svelte-bnvc6y");
|
|
add_location(right, file$e, 266, 2, 5699);
|
|
attr_dev(content, "class", "svelte-bnvc6y");
|
|
add_location(content, file$e, 203, 0, 3299);
|
|
},
|
|
l: function claim(nodes) {
|
|
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, content, anchor);
|
|
append_dev(content, left);
|
|
mount_component(icon0, left, null);
|
|
append_dev(left, t0);
|
|
append_dev(left, h40);
|
|
append_dev(left, t2);
|
|
append_dev(left, h41);
|
|
mount_component(icon1, h41, null);
|
|
append_dev(h41, t3);
|
|
append_dev(content, t4);
|
|
append_dev(content, middle);
|
|
append_dev(middle, header);
|
|
append_dev(header, nav);
|
|
append_dev(nav, back);
|
|
mount_component(icon2, back, null);
|
|
append_dev(nav, t5);
|
|
append_dev(nav, name);
|
|
append_dev(name, h42);
|
|
append_dev(name, t7);
|
|
append_dev(name, span);
|
|
append_dev(middle, t9);
|
|
append_dev(middle, images);
|
|
append_dev(images, figure0);
|
|
append_dev(figure0, img0);
|
|
append_dev(images, t10);
|
|
append_dev(images, figure1);
|
|
append_dev(figure1, img1);
|
|
append_dev(figure1, t11);
|
|
append_dev(figure1, button0);
|
|
append_dev(middle, t13);
|
|
append_dev(middle, profile);
|
|
append_dev(profile, h30);
|
|
append_dev(profile, t15);
|
|
append_dev(profile, p0);
|
|
append_dev(profile, t17);
|
|
append_dev(profile, p1);
|
|
append_dev(profile, t19);
|
|
append_dev(profile, p2);
|
|
mount_component(icon3, p2, null);
|
|
append_dev(p2, t20);
|
|
mount_component(icon4, p2, null);
|
|
append_dev(p2, t21);
|
|
append_dev(p2, a0);
|
|
append_dev(p2, t23);
|
|
mount_component(icon5, p2, null);
|
|
append_dev(p2, t24);
|
|
append_dev(profile, t25);
|
|
append_dev(profile, p3);
|
|
append_dev(p3, b0);
|
|
append_dev(p3, t27);
|
|
append_dev(p3, b1);
|
|
append_dev(p3, t29);
|
|
append_dev(middle, t30);
|
|
append_dev(middle, hr);
|
|
append_dev(middle, t31);
|
|
append_dev(middle, tweets_1);
|
|
|
|
for (let i = 0; i < each_blocks.length; i += 1) {
|
|
each_blocks[i].m(tweets_1, null);
|
|
}
|
|
|
|
append_dev(content, t32);
|
|
append_dev(content, right);
|
|
append_dev(right, input);
|
|
append_dev(right, t33);
|
|
append_dev(right, section);
|
|
append_dev(section, aside0);
|
|
append_dev(aside0, h31);
|
|
append_dev(aside0, t35);
|
|
append_dev(aside0, p4);
|
|
append_dev(aside0, t37);
|
|
append_dev(aside0, button1);
|
|
append_dev(section, t39);
|
|
append_dev(section, aside1);
|
|
append_dev(aside1, recent_media);
|
|
append_dev(recent_media, figure2);
|
|
append_dev(figure2, img2);
|
|
append_dev(recent_media, t40);
|
|
append_dev(recent_media, figure3);
|
|
append_dev(figure3, img3);
|
|
append_dev(recent_media, t41);
|
|
append_dev(recent_media, figure4);
|
|
append_dev(figure4, img4);
|
|
append_dev(recent_media, t42);
|
|
append_dev(recent_media, figure5);
|
|
append_dev(figure5, img5);
|
|
append_dev(recent_media, t43);
|
|
append_dev(recent_media, figure6);
|
|
append_dev(figure6, img6);
|
|
append_dev(recent_media, t44);
|
|
append_dev(recent_media, figure7);
|
|
append_dev(figure7, img7);
|
|
append_dev(section, t45);
|
|
append_dev(section, aside2);
|
|
append_dev(aside2, h32);
|
|
append_dev(aside2, t47);
|
|
append_dev(aside2, ul0);
|
|
append_dev(ul0, li0);
|
|
append_dev(ul0, t49);
|
|
append_dev(ul0, li1);
|
|
append_dev(ul0, t51);
|
|
append_dev(ul0, li2);
|
|
append_dev(aside2, t53);
|
|
append_dev(aside2, a1);
|
|
append_dev(section, t55);
|
|
append_dev(section, aside3);
|
|
append_dev(aside3, h33);
|
|
append_dev(aside3, t57);
|
|
append_dev(aside3, ul1);
|
|
append_dev(ul1, li3);
|
|
append_dev(ul1, t59);
|
|
append_dev(ul1, li4);
|
|
append_dev(ul1, t61);
|
|
append_dev(ul1, li5);
|
|
append_dev(ul1, t63);
|
|
append_dev(ul1, li6);
|
|
append_dev(ul1, t65);
|
|
append_dev(ul1, li7);
|
|
insert_dev(target, t67, anchor);
|
|
mount_component(codebubble, target, anchor);
|
|
insert_dev(target, t68, anchor);
|
|
mount_component(modal, target, anchor);
|
|
current = true;
|
|
},
|
|
p: function update(ctx, [dirty]) {
|
|
const modal_changes = {};
|
|
if (dirty & /*modal_visible*/ 1) modal_changes.visible = /*modal_visible*/ ctx[0];
|
|
|
|
if (dirty & /*$$scope*/ 64) {
|
|
modal_changes.$$scope = { dirty, ctx };
|
|
}
|
|
|
|
modal.$set(modal_changes);
|
|
},
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(icon0.$$.fragment, local);
|
|
transition_in(icon1.$$.fragment, local);
|
|
transition_in(icon2.$$.fragment, local);
|
|
transition_in(icon3.$$.fragment, local);
|
|
transition_in(icon4.$$.fragment, local);
|
|
transition_in(icon5.$$.fragment, local);
|
|
|
|
for (let i = 0; i < each_value.length; i += 1) {
|
|
transition_in(each_blocks[i]);
|
|
}
|
|
|
|
transition_in(codebubble.$$.fragment, local);
|
|
transition_in(modal.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(icon0.$$.fragment, local);
|
|
transition_out(icon1.$$.fragment, local);
|
|
transition_out(icon2.$$.fragment, local);
|
|
transition_out(icon3.$$.fragment, local);
|
|
transition_out(icon4.$$.fragment, local);
|
|
transition_out(icon5.$$.fragment, local);
|
|
each_blocks = each_blocks.filter(Boolean);
|
|
|
|
for (let i = 0; i < each_blocks.length; i += 1) {
|
|
transition_out(each_blocks[i]);
|
|
}
|
|
|
|
transition_out(codebubble.$$.fragment, local);
|
|
transition_out(modal.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(content);
|
|
destroy_component(icon0);
|
|
destroy_component(icon1);
|
|
destroy_component(icon2);
|
|
destroy_component(icon3);
|
|
destroy_component(icon4);
|
|
destroy_component(icon5);
|
|
destroy_each(each_blocks, detaching);
|
|
if (detaching) detach_dev(t67);
|
|
destroy_component(codebubble, detaching);
|
|
if (detaching) detach_dev(t68);
|
|
destroy_component(modal, detaching);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$f.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function instance$f($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Twitter", slots, []);
|
|
let tweets = [1, 2, 3, 4, 5];
|
|
let modal_visible = true;
|
|
const toggle_modal = () => $$invalidate(0, modal_visible = !modal_visible);
|
|
const writable_props = [];
|
|
|
|
Object.keys($$props).forEach(key => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(`<Twitter> was created with unknown prop '${key}'`);
|
|
});
|
|
|
|
$$self.$capture_state = () => ({
|
|
link,
|
|
Icon,
|
|
CodeBubble,
|
|
Modal,
|
|
tweets,
|
|
modal_visible,
|
|
toggle_modal
|
|
});
|
|
|
|
$$self.$inject_state = $$props => {
|
|
if ("tweets" in $$props) $$invalidate(1, tweets = $$props.tweets);
|
|
if ("modal_visible" in $$props) $$invalidate(0, modal_visible = $$props.modal_visible);
|
|
};
|
|
|
|
if ($$props && "$$inject" in $$props) {
|
|
$$self.$inject_state($$props.$$inject);
|
|
}
|
|
|
|
return [modal_visible, tweets, toggle_modal];
|
|
}
|
|
|
|
class Twitter$1 extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$f, create_fragment$f, safe_not_equal, {});
|
|
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Twitter",
|
|
options,
|
|
id: create_fragment$f.name
|
|
});
|
|
}
|
|
}
|
|
|
|
/* src/demos/Youtube.svelte generated by Svelte v3.30.0 */
|
|
const file$f = "src/demos/Youtube.svelte";
|
|
|
|
function get_each_context$2(ctx, list, i) {
|
|
const child_ctx = ctx.slice();
|
|
child_ctx[2] = list[i];
|
|
return child_ctx;
|
|
}
|
|
|
|
function get_each_context_1(ctx, list, i) {
|
|
const child_ctx = ctx.slice();
|
|
child_ctx[2] = list[i];
|
|
return child_ctx;
|
|
}
|
|
|
|
function get_each_context_2(ctx, list, i) {
|
|
const child_ctx = ctx.slice();
|
|
child_ctx[2] = list[i];
|
|
return child_ctx;
|
|
}
|
|
|
|
// (230:8) {#each cards as card}
|
|
function create_each_block_2(ctx) {
|
|
let card;
|
|
let img;
|
|
let img_src_value;
|
|
let t0;
|
|
let info;
|
|
let h4;
|
|
let t2;
|
|
let p;
|
|
let t4;
|
|
let nav;
|
|
let icon0;
|
|
let t5;
|
|
let icon1;
|
|
let t6;
|
|
let t7;
|
|
let reply;
|
|
let icon2;
|
|
let t8;
|
|
let t9;
|
|
let current;
|
|
|
|
icon0 = new Icon({
|
|
props: {
|
|
name: "thumbs-up",
|
|
color: "var(--sub-color)"
|
|
},
|
|
$$inline: true
|
|
});
|
|
|
|
icon1 = new Icon({
|
|
props: {
|
|
name: "thumbs-down",
|
|
color: "var(--sub-color)"
|
|
},
|
|
$$inline: true
|
|
});
|
|
|
|
icon2 = new Icon({
|
|
props: { name: "chevron-down" },
|
|
$$inline: true
|
|
});
|
|
|
|
const block = {
|
|
c: function create() {
|
|
card = element("card");
|
|
img = element("img");
|
|
t0 = space();
|
|
info = element("info");
|
|
h4 = element("h4");
|
|
h4.textContent = "Guys";
|
|
t2 = space();
|
|
p = element("p");
|
|
p.textContent = "Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque";
|
|
t4 = space();
|
|
nav = element("nav");
|
|
create_component(icon0.$$.fragment);
|
|
t5 = text(" 233\n ");
|
|
create_component(icon1.$$.fragment);
|
|
t6 = text(" 1");
|
|
t7 = space();
|
|
reply = element("reply");
|
|
create_component(icon2.$$.fragment);
|
|
t8 = text(" View replies");
|
|
t9 = space();
|
|
if (img.src !== (img_src_value = "https://via.placeholder.com/64x64?text=Person")) attr_dev(img, "src", img_src_value);
|
|
attr_dev(img, "class", "svelte-87j0be");
|
|
add_location(img, file$f, 231, 10, 5212);
|
|
attr_dev(h4, "class", "svelte-87j0be");
|
|
add_location(h4, file$f, 233, 12, 5299);
|
|
attr_dev(p, "class", "svelte-87j0be");
|
|
add_location(p, file$f, 234, 12, 5325);
|
|
attr_dev(nav, "class", "svelte-87j0be");
|
|
add_location(nav, file$f, 235, 12, 5467);
|
|
attr_dev(reply, "class", "svelte-87j0be");
|
|
add_location(reply, file$f, 239, 12, 5642);
|
|
attr_dev(info, "class", "svelte-87j0be");
|
|
add_location(info, file$f, 232, 10, 5280);
|
|
attr_dev(card, "class", "svelte-87j0be");
|
|
add_location(card, file$f, 230, 8, 5195);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, card, anchor);
|
|
append_dev(card, img);
|
|
append_dev(card, t0);
|
|
append_dev(card, info);
|
|
append_dev(info, h4);
|
|
append_dev(info, t2);
|
|
append_dev(info, p);
|
|
append_dev(info, t4);
|
|
append_dev(info, nav);
|
|
mount_component(icon0, nav, null);
|
|
append_dev(nav, t5);
|
|
mount_component(icon1, nav, null);
|
|
append_dev(nav, t6);
|
|
append_dev(info, t7);
|
|
append_dev(info, reply);
|
|
mount_component(icon2, reply, null);
|
|
append_dev(reply, t8);
|
|
append_dev(card, t9);
|
|
current = true;
|
|
},
|
|
p: noop,
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(icon0.$$.fragment, local);
|
|
transition_in(icon1.$$.fragment, local);
|
|
transition_in(icon2.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(icon0.$$.fragment, local);
|
|
transition_out(icon1.$$.fragment, local);
|
|
transition_out(icon2.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(card);
|
|
destroy_component(icon0);
|
|
destroy_component(icon1);
|
|
destroy_component(icon2);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_each_block_2.name,
|
|
type: "each",
|
|
source: "(230:8) {#each cards as card}",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
// (248:6) {#each cards as card}
|
|
function create_each_block_1(ctx) {
|
|
let card;
|
|
let img;
|
|
let img_src_value;
|
|
let t0;
|
|
let info;
|
|
let h4;
|
|
let t2;
|
|
let author;
|
|
let t4;
|
|
let views;
|
|
let t6;
|
|
let date;
|
|
|
|
const block = {
|
|
c: function create() {
|
|
card = element("card");
|
|
img = element("img");
|
|
t0 = space();
|
|
info = element("info");
|
|
h4 = element("h4");
|
|
h4.textContent = "Video Thumb Title";
|
|
t2 = space();
|
|
author = element("author");
|
|
author.textContent = "Zed";
|
|
t4 = space();
|
|
views = element("views");
|
|
views.textContent = "1.1M views";
|
|
t6 = space();
|
|
date = element("date");
|
|
date.textContent = "2 years ago";
|
|
if (img.src !== (img_src_value = "https://via.placeholder.com/120x80?text=Thumb")) attr_dev(img, "src", img_src_value);
|
|
attr_dev(img, "class", "svelte-87j0be");
|
|
add_location(img, file$f, 249, 8, 5855);
|
|
attr_dev(h4, "class", "svelte-87j0be");
|
|
add_location(h4, file$f, 251, 10, 5938);
|
|
add_location(author, file$f, 252, 10, 5975);
|
|
add_location(views, file$f, 253, 10, 6006);
|
|
add_location(date, file$f, 254, 10, 6042);
|
|
attr_dev(info, "class", "svelte-87j0be");
|
|
add_location(info, file$f, 250, 8, 5921);
|
|
attr_dev(card, "class", "small svelte-87j0be");
|
|
add_location(card, file$f, 248, 6, 5826);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, card, anchor);
|
|
append_dev(card, img);
|
|
append_dev(card, t0);
|
|
append_dev(card, info);
|
|
append_dev(info, h4);
|
|
append_dev(info, t2);
|
|
append_dev(info, author);
|
|
append_dev(info, t4);
|
|
append_dev(info, views);
|
|
append_dev(info, t6);
|
|
append_dev(info, date);
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(card);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_each_block_1.name,
|
|
type: "each",
|
|
source: "(248:6) {#each cards as card}",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
// (266:6) {#each cards as card}
|
|
function create_each_block$2(ctx) {
|
|
let card;
|
|
let img;
|
|
let img_src_value;
|
|
let t0;
|
|
let info;
|
|
let h4;
|
|
let t2;
|
|
let author;
|
|
let t4;
|
|
let views;
|
|
let t6;
|
|
let date;
|
|
let t8;
|
|
|
|
const block = {
|
|
c: function create() {
|
|
card = element("card");
|
|
img = element("img");
|
|
t0 = space();
|
|
info = element("info");
|
|
h4 = element("h4");
|
|
h4.textContent = "Video Thumb Title";
|
|
t2 = space();
|
|
author = element("author");
|
|
author.textContent = "Zed";
|
|
t4 = space();
|
|
views = element("views");
|
|
views.textContent = "1.1M views";
|
|
t6 = space();
|
|
date = element("date");
|
|
date.textContent = "2 years ago";
|
|
t8 = space();
|
|
if (img.src !== (img_src_value = "https://via.placeholder.com/120x80?text=Thumb")) attr_dev(img, "src", img_src_value);
|
|
attr_dev(img, "class", "svelte-87j0be");
|
|
add_location(img, file$f, 267, 8, 6318);
|
|
attr_dev(h4, "class", "svelte-87j0be");
|
|
add_location(h4, file$f, 269, 10, 6401);
|
|
add_location(author, file$f, 270, 10, 6438);
|
|
add_location(views, file$f, 271, 10, 6469);
|
|
add_location(date, file$f, 272, 10, 6505);
|
|
attr_dev(info, "class", "svelte-87j0be");
|
|
add_location(info, file$f, 268, 8, 6384);
|
|
attr_dev(card, "class", "svelte-87j0be");
|
|
add_location(card, file$f, 266, 6, 6303);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, card, anchor);
|
|
append_dev(card, img);
|
|
append_dev(card, t0);
|
|
append_dev(card, info);
|
|
append_dev(info, h4);
|
|
append_dev(info, t2);
|
|
append_dev(info, author);
|
|
append_dev(info, t4);
|
|
append_dev(info, views);
|
|
append_dev(info, t6);
|
|
append_dev(info, date);
|
|
append_dev(card, t8);
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(card);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_each_block$2.name,
|
|
type: "each",
|
|
source: "(266:6) {#each cards as card}",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function create_fragment$g(ctx) {
|
|
let content1;
|
|
let header;
|
|
let nav0;
|
|
let nav_left;
|
|
let a0;
|
|
let icon0;
|
|
let t0;
|
|
let icon1;
|
|
let t1;
|
|
let logo;
|
|
let t3;
|
|
let input;
|
|
let t4;
|
|
let ul;
|
|
let li0;
|
|
let icon2;
|
|
let t5;
|
|
let li1;
|
|
let icon3;
|
|
let t6;
|
|
let li2;
|
|
let icon4;
|
|
let t7;
|
|
let li3;
|
|
let button0;
|
|
let icon5;
|
|
let t8;
|
|
let t9;
|
|
let main;
|
|
let left;
|
|
let figure0;
|
|
let a1;
|
|
let img0;
|
|
let img0_src_value;
|
|
let link_action;
|
|
let t10;
|
|
let figcaption;
|
|
let a2;
|
|
let t12;
|
|
let a3;
|
|
let t14;
|
|
let p;
|
|
let t16;
|
|
let video_actions;
|
|
let likes;
|
|
let t18;
|
|
let video_buttons;
|
|
let icon6;
|
|
let t19;
|
|
let icon7;
|
|
let t20;
|
|
let icon8;
|
|
let t21;
|
|
let icon9;
|
|
let t22;
|
|
let icon10;
|
|
let t23;
|
|
let hr0;
|
|
let t24;
|
|
let promotion;
|
|
let nav1;
|
|
let card;
|
|
let img1;
|
|
let img1_src_value;
|
|
let t25;
|
|
let info;
|
|
let h4;
|
|
let t27;
|
|
let subs;
|
|
let t29;
|
|
let button1;
|
|
let t31;
|
|
let content0;
|
|
let t33;
|
|
let hr1;
|
|
let t34;
|
|
let comments;
|
|
let nav2;
|
|
let span;
|
|
let t36;
|
|
let sort;
|
|
let icon11;
|
|
let t37;
|
|
let t38;
|
|
let t39;
|
|
let right;
|
|
let t40;
|
|
let figure1;
|
|
let a4;
|
|
let img2;
|
|
let img2_src_value;
|
|
let link_action_1;
|
|
let t41;
|
|
let current;
|
|
let mounted;
|
|
let dispose;
|
|
icon0 = new Icon({ props: { name: "menu" }, $$inline: true });
|
|
|
|
icon1 = new Icon({
|
|
props: { name: "youtube" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon2 = new Icon({
|
|
props: { name: "camera", color: "#000" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon3 = new Icon({
|
|
props: { name: "more-vertical", color: "#000" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon4 = new Icon({
|
|
props: { name: "grid", color: "#000" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon5 = new Icon({ props: { name: "user" }, $$inline: true });
|
|
|
|
icon6 = new Icon({
|
|
props: { name: "thumbs-up", color: "#999" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon7 = new Icon({
|
|
props: { name: "thumbs-down", color: "#999" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon8 = new Icon({
|
|
props: { name: "corner-up-right", color: "#999" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon9 = new Icon({
|
|
props: { name: "menu", color: "#999" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon10 = new Icon({
|
|
props: { name: "vertical-more" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon11 = new Icon({
|
|
props: {
|
|
name: "bar-chart",
|
|
color: "var(--sub-color)"
|
|
},
|
|
$$inline: true
|
|
});
|
|
|
|
let each_value_2 = /*cards*/ ctx[0];
|
|
validate_each_argument(each_value_2);
|
|
let each_blocks_2 = [];
|
|
|
|
for (let i = 0; i < each_value_2.length; i += 1) {
|
|
each_blocks_2[i] = create_each_block_2(get_each_context_2(ctx, each_value_2, i));
|
|
}
|
|
|
|
let each_value_1 = /*cards*/ ctx[0];
|
|
validate_each_argument(each_value_1);
|
|
let each_blocks_1 = [];
|
|
|
|
for (let i = 0; i < each_value_1.length; i += 1) {
|
|
each_blocks_1[i] = create_each_block_1(get_each_context_1(ctx, each_value_1, i));
|
|
}
|
|
|
|
let each_value = /*cards*/ ctx[0];
|
|
validate_each_argument(each_value);
|
|
let each_blocks = [];
|
|
|
|
for (let i = 0; i < each_value.length; i += 1) {
|
|
each_blocks[i] = create_each_block$2(get_each_context$2(ctx, each_value, i));
|
|
}
|
|
|
|
const block = {
|
|
c: function create() {
|
|
content1 = element("content");
|
|
header = element("header");
|
|
nav0 = element("nav");
|
|
nav_left = element("nav-left");
|
|
a0 = element("a");
|
|
create_component(icon0.$$.fragment);
|
|
t0 = space();
|
|
create_component(icon1.$$.fragment);
|
|
t1 = space();
|
|
logo = element("logo");
|
|
logo.textContent = "Youtube";
|
|
t3 = space();
|
|
input = element("input");
|
|
t4 = space();
|
|
ul = element("ul");
|
|
li0 = element("li");
|
|
create_component(icon2.$$.fragment);
|
|
t5 = space();
|
|
li1 = element("li");
|
|
create_component(icon3.$$.fragment);
|
|
t6 = space();
|
|
li2 = element("li");
|
|
create_component(icon4.$$.fragment);
|
|
t7 = space();
|
|
li3 = element("li");
|
|
button0 = element("button");
|
|
create_component(icon5.$$.fragment);
|
|
t8 = text(" Sign In");
|
|
t9 = space();
|
|
main = element("main");
|
|
left = element("left");
|
|
figure0 = element("figure");
|
|
a1 = element("a");
|
|
img0 = element("img");
|
|
t10 = space();
|
|
figcaption = element("figcaption");
|
|
a2 = element("a");
|
|
a2.textContent = "#tag";
|
|
t12 = space();
|
|
a3 = element("a");
|
|
a3.textContent = "#anothertag";
|
|
t14 = space();
|
|
p = element("p");
|
|
p.textContent = "Title And Stuff";
|
|
t16 = space();
|
|
video_actions = element("video-actions");
|
|
likes = element("likes");
|
|
likes.textContent = "Stats Stats";
|
|
t18 = space();
|
|
video_buttons = element("video-buttons");
|
|
create_component(icon6.$$.fragment);
|
|
t19 = text(" 1.1K\n ");
|
|
create_component(icon7.$$.fragment);
|
|
t20 = text(" 22\n ");
|
|
create_component(icon8.$$.fragment);
|
|
t21 = text(" SHARE\n ");
|
|
create_component(icon9.$$.fragment);
|
|
t22 = text(" SAVE\n ");
|
|
create_component(icon10.$$.fragment);
|
|
t23 = space();
|
|
hr0 = element("hr");
|
|
t24 = space();
|
|
promotion = element("promotion");
|
|
nav1 = element("nav");
|
|
card = element("card");
|
|
img1 = element("img");
|
|
t25 = space();
|
|
info = element("info");
|
|
h4 = element("h4");
|
|
h4.textContent = "Zed A. Shaw";
|
|
t27 = space();
|
|
subs = element("subs");
|
|
subs.textContent = "1 subscriber";
|
|
t29 = space();
|
|
button1 = element("button");
|
|
button1.textContent = "SUBSCRIBE";
|
|
t31 = space();
|
|
content0 = element("content");
|
|
content0.textContent = "Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur";
|
|
t33 = space();
|
|
hr1 = element("hr");
|
|
t34 = space();
|
|
comments = element("comments");
|
|
nav2 = element("nav");
|
|
span = element("span");
|
|
span.textContent = "125 Comments";
|
|
t36 = space();
|
|
sort = element("sort");
|
|
create_component(icon11.$$.fragment);
|
|
t37 = text(" SORT BY");
|
|
t38 = space();
|
|
|
|
for (let i = 0; i < each_blocks_2.length; i += 1) {
|
|
each_blocks_2[i].c();
|
|
}
|
|
|
|
t39 = space();
|
|
right = element("right");
|
|
|
|
for (let i = 0; i < each_blocks_1.length; i += 1) {
|
|
each_blocks_1[i].c();
|
|
}
|
|
|
|
t40 = space();
|
|
figure1 = element("figure");
|
|
a4 = element("a");
|
|
img2 = element("img");
|
|
t41 = space();
|
|
|
|
for (let i = 0; i < each_blocks.length; i += 1) {
|
|
each_blocks[i].c();
|
|
}
|
|
|
|
attr_dev(logo, "class", "svelte-87j0be");
|
|
add_location(logo, file$f, 174, 56, 2661);
|
|
add_location(a0, file$f, 174, 8, 2613);
|
|
add_location(nav_left, file$f, 173, 6, 2594);
|
|
attr_dev(input, "id", "search");
|
|
attr_dev(input, "placeholder", "Search");
|
|
attr_dev(input, "name", "search");
|
|
attr_dev(input, "class", "svelte-87j0be");
|
|
add_location(input, file$f, 176, 6, 2710);
|
|
add_location(li0, file$f, 178, 8, 2784);
|
|
add_location(li1, file$f, 179, 8, 2837);
|
|
add_location(li2, file$f, 180, 8, 2897);
|
|
attr_dev(button0, "class", "svelte-87j0be");
|
|
add_location(button0, file$f, 181, 12, 2952);
|
|
add_location(li3, file$f, 181, 8, 2948);
|
|
add_location(ul, file$f, 177, 6, 2771);
|
|
attr_dev(nav0, "class", "svelte-87j0be");
|
|
add_location(nav0, file$f, 172, 4, 2582);
|
|
attr_dev(header, "class", "svelte-87j0be");
|
|
add_location(header, file$f, 171, 2, 2569);
|
|
if (img0.src !== (img0_src_value = "https://via.placeholder.com/800x450?text=Video")) attr_dev(img0, "src", img0_src_value);
|
|
add_location(img0, file$f, 189, 10, 3125);
|
|
attr_dev(a1, "href", "/demos/google");
|
|
add_location(a1, file$f, 188, 8, 3081);
|
|
attr_dev(a2, "class", "svelte-87j0be");
|
|
add_location(a2, file$f, 192, 10, 3228);
|
|
attr_dev(a3, "class", "svelte-87j0be");
|
|
add_location(a3, file$f, 192, 22, 3240);
|
|
attr_dev(p, "class", "svelte-87j0be");
|
|
add_location(p, file$f, 193, 10, 3269);
|
|
add_location(likes, file$f, 195, 12, 3330);
|
|
add_location(video_buttons, file$f, 196, 12, 3369);
|
|
set_custom_element_data(video_actions, "class", "svelte-87j0be");
|
|
add_location(video_actions, file$f, 194, 10, 3302);
|
|
attr_dev(figcaption, "class", "svelte-87j0be");
|
|
add_location(figcaption, file$f, 191, 8, 3205);
|
|
add_location(figure0, file$f, 187, 6, 3064);
|
|
attr_dev(hr0, "class", "svelte-87j0be");
|
|
add_location(hr0, file$f, 206, 6, 3763);
|
|
if (img1.src !== (img1_src_value = "https://via.placeholder.com/64x64?text=ME")) attr_dev(img1, "src", img1_src_value);
|
|
attr_dev(img1, "class", "svelte-87j0be");
|
|
add_location(img1, file$f, 210, 12, 3829);
|
|
attr_dev(h4, "class", "svelte-87j0be");
|
|
add_location(h4, file$f, 212, 12, 3914);
|
|
add_location(subs, file$f, 213, 12, 3947);
|
|
attr_dev(info, "class", "svelte-87j0be");
|
|
add_location(info, file$f, 211, 12, 3895);
|
|
attr_dev(card, "class", "svelte-87j0be");
|
|
add_location(card, file$f, 209, 10, 3810);
|
|
attr_dev(button1, "id", "subscribe");
|
|
attr_dev(button1, "class", "svelte-87j0be");
|
|
add_location(button1, file$f, 215, 10, 4001);
|
|
attr_dev(nav1, "class", "svelte-87j0be");
|
|
add_location(nav1, file$f, 208, 8, 3794);
|
|
attr_dev(content0, "class", "svelte-87j0be");
|
|
add_location(content0, file$f, 218, 8, 4067);
|
|
attr_dev(promotion, "class", "svelte-87j0be");
|
|
add_location(promotion, file$f, 207, 6, 3774);
|
|
attr_dev(hr1, "class", "svelte-87j0be");
|
|
add_location(hr1, file$f, 222, 6, 4996);
|
|
add_location(span, file$f, 226, 10, 5043);
|
|
attr_dev(sort, "class", "svelte-87j0be");
|
|
add_location(sort, file$f, 226, 36, 5069);
|
|
attr_dev(nav2, "class", "svelte-87j0be");
|
|
add_location(nav2, file$f, 225, 8, 5027);
|
|
attr_dev(comments, "class", "svelte-87j0be");
|
|
add_location(comments, file$f, 224, 6, 5008);
|
|
attr_dev(left, "class", "svelte-87j0be");
|
|
add_location(left, file$f, 186, 4, 3051);
|
|
if (img2.src !== (img2_src_value = "https://via.placeholder.com/300x150?text=Advert")) attr_dev(img2, "src", img2_src_value);
|
|
add_location(img2, file$f, 261, 10, 6179);
|
|
attr_dev(a4, "href", "/demos/google");
|
|
add_location(a4, file$f, 260, 8, 6135);
|
|
add_location(figure1, file$f, 259, 6, 6118);
|
|
attr_dev(right, "class", "svelte-87j0be");
|
|
add_location(right, file$f, 246, 4, 5784);
|
|
attr_dev(main, "class", "svelte-87j0be");
|
|
add_location(main, file$f, 185, 2, 3040);
|
|
attr_dev(content1, "class", "svelte-87j0be");
|
|
add_location(content1, file$f, 170, 0, 2557);
|
|
},
|
|
l: function claim(nodes) {
|
|
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, content1, anchor);
|
|
append_dev(content1, header);
|
|
append_dev(header, nav0);
|
|
append_dev(nav0, nav_left);
|
|
append_dev(nav_left, a0);
|
|
mount_component(icon0, a0, null);
|
|
append_dev(a0, t0);
|
|
mount_component(icon1, a0, null);
|
|
append_dev(a0, t1);
|
|
append_dev(a0, logo);
|
|
append_dev(nav0, t3);
|
|
append_dev(nav0, input);
|
|
append_dev(nav0, t4);
|
|
append_dev(nav0, ul);
|
|
append_dev(ul, li0);
|
|
mount_component(icon2, li0, null);
|
|
append_dev(ul, t5);
|
|
append_dev(ul, li1);
|
|
mount_component(icon3, li1, null);
|
|
append_dev(ul, t6);
|
|
append_dev(ul, li2);
|
|
mount_component(icon4, li2, null);
|
|
append_dev(ul, t7);
|
|
append_dev(ul, li3);
|
|
append_dev(li3, button0);
|
|
mount_component(icon5, button0, null);
|
|
append_dev(button0, t8);
|
|
append_dev(content1, t9);
|
|
append_dev(content1, main);
|
|
append_dev(main, left);
|
|
append_dev(left, figure0);
|
|
append_dev(figure0, a1);
|
|
append_dev(a1, img0);
|
|
append_dev(figure0, t10);
|
|
append_dev(figure0, figcaption);
|
|
append_dev(figcaption, a2);
|
|
append_dev(figcaption, t12);
|
|
append_dev(figcaption, a3);
|
|
append_dev(figcaption, t14);
|
|
append_dev(figcaption, p);
|
|
append_dev(figcaption, t16);
|
|
append_dev(figcaption, video_actions);
|
|
append_dev(video_actions, likes);
|
|
append_dev(video_actions, t18);
|
|
append_dev(video_actions, video_buttons);
|
|
mount_component(icon6, video_buttons, null);
|
|
append_dev(video_buttons, t19);
|
|
mount_component(icon7, video_buttons, null);
|
|
append_dev(video_buttons, t20);
|
|
mount_component(icon8, video_buttons, null);
|
|
append_dev(video_buttons, t21);
|
|
mount_component(icon9, video_buttons, null);
|
|
append_dev(video_buttons, t22);
|
|
mount_component(icon10, video_buttons, null);
|
|
append_dev(left, t23);
|
|
append_dev(left, hr0);
|
|
append_dev(left, t24);
|
|
append_dev(left, promotion);
|
|
append_dev(promotion, nav1);
|
|
append_dev(nav1, card);
|
|
append_dev(card, img1);
|
|
append_dev(card, t25);
|
|
append_dev(card, info);
|
|
append_dev(info, h4);
|
|
append_dev(info, t27);
|
|
append_dev(info, subs);
|
|
append_dev(nav1, t29);
|
|
append_dev(nav1, button1);
|
|
append_dev(promotion, t31);
|
|
append_dev(promotion, content0);
|
|
append_dev(left, t33);
|
|
append_dev(left, hr1);
|
|
append_dev(left, t34);
|
|
append_dev(left, comments);
|
|
append_dev(comments, nav2);
|
|
append_dev(nav2, span);
|
|
append_dev(nav2, t36);
|
|
append_dev(nav2, sort);
|
|
mount_component(icon11, sort, null);
|
|
append_dev(sort, t37);
|
|
append_dev(comments, t38);
|
|
|
|
for (let i = 0; i < each_blocks_2.length; i += 1) {
|
|
each_blocks_2[i].m(comments, null);
|
|
}
|
|
|
|
append_dev(main, t39);
|
|
append_dev(main, right);
|
|
|
|
for (let i = 0; i < each_blocks_1.length; i += 1) {
|
|
each_blocks_1[i].m(right, null);
|
|
}
|
|
|
|
append_dev(right, t40);
|
|
append_dev(right, figure1);
|
|
append_dev(figure1, a4);
|
|
append_dev(a4, img2);
|
|
append_dev(right, t41);
|
|
|
|
for (let i = 0; i < each_blocks.length; i += 1) {
|
|
each_blocks[i].m(right, null);
|
|
}
|
|
|
|
current = true;
|
|
|
|
if (!mounted) {
|
|
dispose = [
|
|
action_destroyer(link_action = link.call(null, a1)),
|
|
action_destroyer(link_action_1 = link.call(null, a4))
|
|
];
|
|
|
|
mounted = true;
|
|
}
|
|
},
|
|
p: noop,
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(icon0.$$.fragment, local);
|
|
transition_in(icon1.$$.fragment, local);
|
|
transition_in(icon2.$$.fragment, local);
|
|
transition_in(icon3.$$.fragment, local);
|
|
transition_in(icon4.$$.fragment, local);
|
|
transition_in(icon5.$$.fragment, local);
|
|
transition_in(icon6.$$.fragment, local);
|
|
transition_in(icon7.$$.fragment, local);
|
|
transition_in(icon8.$$.fragment, local);
|
|
transition_in(icon9.$$.fragment, local);
|
|
transition_in(icon10.$$.fragment, local);
|
|
transition_in(icon11.$$.fragment, local);
|
|
|
|
for (let i = 0; i < each_value_2.length; i += 1) {
|
|
transition_in(each_blocks_2[i]);
|
|
}
|
|
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(icon0.$$.fragment, local);
|
|
transition_out(icon1.$$.fragment, local);
|
|
transition_out(icon2.$$.fragment, local);
|
|
transition_out(icon3.$$.fragment, local);
|
|
transition_out(icon4.$$.fragment, local);
|
|
transition_out(icon5.$$.fragment, local);
|
|
transition_out(icon6.$$.fragment, local);
|
|
transition_out(icon7.$$.fragment, local);
|
|
transition_out(icon8.$$.fragment, local);
|
|
transition_out(icon9.$$.fragment, local);
|
|
transition_out(icon10.$$.fragment, local);
|
|
transition_out(icon11.$$.fragment, local);
|
|
each_blocks_2 = each_blocks_2.filter(Boolean);
|
|
|
|
for (let i = 0; i < each_blocks_2.length; i += 1) {
|
|
transition_out(each_blocks_2[i]);
|
|
}
|
|
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(content1);
|
|
destroy_component(icon0);
|
|
destroy_component(icon1);
|
|
destroy_component(icon2);
|
|
destroy_component(icon3);
|
|
destroy_component(icon4);
|
|
destroy_component(icon5);
|
|
destroy_component(icon6);
|
|
destroy_component(icon7);
|
|
destroy_component(icon8);
|
|
destroy_component(icon9);
|
|
destroy_component(icon10);
|
|
destroy_component(icon11);
|
|
destroy_each(each_blocks_2, detaching);
|
|
destroy_each(each_blocks_1, detaching);
|
|
destroy_each(each_blocks, detaching);
|
|
mounted = false;
|
|
run_all(dispose);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$g.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function instance$g($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Youtube", slots, []);
|
|
let cards = [1, 2, 3, 4];
|
|
let { thumbnail = false } = $$props;
|
|
const writable_props = ["thumbnail"];
|
|
|
|
Object.keys($$props).forEach(key => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(`<Youtube> was created with unknown prop '${key}'`);
|
|
});
|
|
|
|
$$self.$$set = $$props => {
|
|
if ("thumbnail" in $$props) $$invalidate(1, thumbnail = $$props.thumbnail);
|
|
};
|
|
|
|
$$self.$capture_state = () => ({ link, Icon, cards, thumbnail });
|
|
|
|
$$self.$inject_state = $$props => {
|
|
if ("cards" in $$props) $$invalidate(0, cards = $$props.cards);
|
|
if ("thumbnail" in $$props) $$invalidate(1, thumbnail = $$props.thumbnail);
|
|
};
|
|
|
|
if ($$props && "$$inject" in $$props) {
|
|
$$self.$inject_state($$props.$$inject);
|
|
}
|
|
|
|
return [cards, thumbnail];
|
|
}
|
|
|
|
class Youtube$1 extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$g, create_fragment$g, safe_not_equal, { thumbnail: 1 });
|
|
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Youtube",
|
|
options,
|
|
id: create_fragment$g.name
|
|
});
|
|
}
|
|
|
|
get thumbnail() {
|
|
throw new Error("<Youtube>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
set thumbnail(value) {
|
|
throw new Error("<Youtube>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
}
|
|
|
|
/* src/demos/Instagram.svelte generated by Svelte v3.30.0 */
|
|
const file$g = "src/demos/Instagram.svelte";
|
|
|
|
function get_each_context$3(ctx, list, i) {
|
|
const child_ctx = ctx.slice();
|
|
child_ctx[2] = list[i];
|
|
return child_ctx;
|
|
}
|
|
|
|
function get_each_context_1$1(ctx, list, i) {
|
|
const child_ctx = ctx.slice();
|
|
child_ctx[5] = list[i];
|
|
return child_ctx;
|
|
}
|
|
|
|
// (118:2) {#each pins as pin}
|
|
function create_each_block_1$1(ctx) {
|
|
let figure;
|
|
let img;
|
|
let img_src_value;
|
|
let t;
|
|
|
|
const block = {
|
|
c: function create() {
|
|
figure = element("figure");
|
|
img = element("img");
|
|
t = space();
|
|
attr_dev(img, "alt", "Stock photo");
|
|
if (img.src !== (img_src_value = "https://via.placeholder.com/82x82?text=Story")) attr_dev(img, "src", img_src_value);
|
|
add_location(img, file$g, 119, 6, 2024);
|
|
add_location(figure, file$g, 118, 4, 2009);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, figure, anchor);
|
|
append_dev(figure, img);
|
|
append_dev(figure, t);
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(figure);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_each_block_1$1.name,
|
|
type: "each",
|
|
source: "(118:2) {#each pins as pin}",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
// (137:2) {#each posts as post}
|
|
function create_each_block$3(ctx) {
|
|
let figure;
|
|
let img;
|
|
let img_src_value;
|
|
let t;
|
|
|
|
const block = {
|
|
c: function create() {
|
|
figure = element("figure");
|
|
img = element("img");
|
|
t = space();
|
|
attr_dev(img, "alt", "Stock photo");
|
|
if (img.src !== (img_src_value = "https://via.placeholder.com/300x300?text=Post Image")) attr_dev(img, "src", img_src_value);
|
|
add_location(img, file$g, 138, 6, 2529);
|
|
attr_dev(figure, "class", "svelte-1ri9kvn");
|
|
add_location(figure, file$g, 137, 4, 2514);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, figure, anchor);
|
|
append_dev(figure, img);
|
|
append_dev(figure, t);
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(figure);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_each_block$3.name,
|
|
type: "each",
|
|
source: "(137:2) {#each posts as post}",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function create_fragment$h(ctx) {
|
|
let content;
|
|
let header;
|
|
let nav0;
|
|
let b0;
|
|
let icon0;
|
|
let t0;
|
|
let t1;
|
|
let input;
|
|
let t2;
|
|
let ul0;
|
|
let li0;
|
|
let button0;
|
|
let t4;
|
|
let li1;
|
|
let a0;
|
|
let t6;
|
|
let profile;
|
|
let figure;
|
|
let img;
|
|
let img_src_value;
|
|
let t7;
|
|
let info;
|
|
let p0;
|
|
let b1;
|
|
let t9;
|
|
let button1;
|
|
let t11;
|
|
let p1;
|
|
let b2;
|
|
let t13;
|
|
let b3;
|
|
let t15;
|
|
let b4;
|
|
let t17;
|
|
let p2;
|
|
let b5;
|
|
let t19;
|
|
let p3;
|
|
let t20;
|
|
let br;
|
|
let t21;
|
|
let a1;
|
|
let t23;
|
|
let pins_1;
|
|
let t24;
|
|
let tabs;
|
|
let nav1;
|
|
let ul1;
|
|
let li2;
|
|
let icon1;
|
|
let t25;
|
|
let t26;
|
|
let li3;
|
|
let icon2;
|
|
let t27;
|
|
let t28;
|
|
let li4;
|
|
let icon3;
|
|
let t29;
|
|
let t30;
|
|
let li5;
|
|
let icon4;
|
|
let t31;
|
|
let t32;
|
|
let posts_1;
|
|
let current;
|
|
|
|
icon0 = new Icon({
|
|
props: {
|
|
name: "instagram",
|
|
color: "var(--color-text)"
|
|
},
|
|
$$inline: true
|
|
});
|
|
|
|
let each_value_1 = /*pins*/ ctx[1];
|
|
validate_each_argument(each_value_1);
|
|
let each_blocks_1 = [];
|
|
|
|
for (let i = 0; i < each_value_1.length; i += 1) {
|
|
each_blocks_1[i] = create_each_block_1$1(get_each_context_1$1(ctx, each_value_1, i));
|
|
}
|
|
|
|
icon1 = new Icon({
|
|
props: { name: "grid", color: "var(--color-text)" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon2 = new Icon({
|
|
props: {
|
|
name: "movie",
|
|
color: "var(--color-text)"
|
|
},
|
|
$$inline: true
|
|
});
|
|
|
|
icon3 = new Icon({
|
|
props: { name: "tv", color: "var(--color-text)" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon4 = new Icon({
|
|
props: { name: "user", color: "var(--color-text)" },
|
|
$$inline: true
|
|
});
|
|
|
|
let each_value = /*posts*/ ctx[0];
|
|
validate_each_argument(each_value);
|
|
let each_blocks = [];
|
|
|
|
for (let i = 0; i < each_value.length; i += 1) {
|
|
each_blocks[i] = create_each_block$3(get_each_context$3(ctx, each_value, i));
|
|
}
|
|
|
|
const block = {
|
|
c: function create() {
|
|
content = element("content");
|
|
header = element("header");
|
|
nav0 = element("nav");
|
|
b0 = element("b");
|
|
create_component(icon0.$$.fragment);
|
|
t0 = text(" Instagram");
|
|
t1 = space();
|
|
input = element("input");
|
|
t2 = space();
|
|
ul0 = element("ul");
|
|
li0 = element("li");
|
|
button0 = element("button");
|
|
button0.textContent = "Log In";
|
|
t4 = space();
|
|
li1 = element("li");
|
|
a0 = element("a");
|
|
a0.textContent = "Sign Up";
|
|
t6 = space();
|
|
profile = element("profile");
|
|
figure = element("figure");
|
|
img = element("img");
|
|
t7 = space();
|
|
info = element("info");
|
|
p0 = element("p");
|
|
b1 = element("b");
|
|
b1.textContent = "zedshaw";
|
|
t9 = space();
|
|
button1 = element("button");
|
|
button1.textContent = "follow";
|
|
t11 = space();
|
|
p1 = element("p");
|
|
b2 = element("b");
|
|
b2.textContent = "280";
|
|
t13 = text(" posts ");
|
|
b3 = element("b");
|
|
b3.textContent = "4,695 followers";
|
|
t15 = space();
|
|
b4 = element("b");
|
|
b4.textContent = "1,778 following";
|
|
t17 = space();
|
|
p2 = element("p");
|
|
b5 = element("b");
|
|
b5.textContent = "Zed A. Shaw";
|
|
t19 = space();
|
|
p3 = element("p");
|
|
t20 = text("Painter in oil, watercolor, and pastel. I’m doing live streams of little paintings on Twitch:");
|
|
br = element("br");
|
|
t21 = space();
|
|
a1 = element("a");
|
|
a1.textContent = "www.twitch.tv/zedashaw";
|
|
t23 = space();
|
|
pins_1 = element("pins");
|
|
|
|
for (let i = 0; i < each_blocks_1.length; i += 1) {
|
|
each_blocks_1[i].c();
|
|
}
|
|
|
|
t24 = space();
|
|
tabs = element("tabs");
|
|
nav1 = element("nav");
|
|
ul1 = element("ul");
|
|
li2 = element("li");
|
|
create_component(icon1.$$.fragment);
|
|
t25 = text(" POSTS");
|
|
t26 = space();
|
|
li3 = element("li");
|
|
create_component(icon2.$$.fragment);
|
|
t27 = text(" REELS");
|
|
t28 = space();
|
|
li4 = element("li");
|
|
create_component(icon3.$$.fragment);
|
|
t29 = text(" TV");
|
|
t30 = space();
|
|
li5 = element("li");
|
|
create_component(icon4.$$.fragment);
|
|
t31 = text(" TAGGED");
|
|
t32 = space();
|
|
posts_1 = element("posts");
|
|
|
|
for (let i = 0; i < each_blocks.length; i += 1) {
|
|
each_blocks[i].c();
|
|
}
|
|
|
|
add_location(b0, file$g, 86, 6, 1206);
|
|
attr_dev(input, "placeholder", "Search");
|
|
add_location(input, file$g, 87, 6, 1281);
|
|
attr_dev(button0, "class", "svelte-1ri9kvn");
|
|
add_location(button0, file$g, 89, 12, 1333);
|
|
add_location(li0, file$g, 89, 8, 1329);
|
|
attr_dev(a0, "class", "svelte-1ri9kvn");
|
|
add_location(a0, file$g, 90, 12, 1374);
|
|
add_location(li1, file$g, 90, 8, 1370);
|
|
add_location(ul0, file$g, 88, 6, 1316);
|
|
attr_dev(nav0, "class", "svelte-1ri9kvn");
|
|
add_location(nav0, file$g, 85, 4, 1194);
|
|
attr_dev(header, "class", "svelte-1ri9kvn");
|
|
add_location(header, file$g, 84, 2, 1181);
|
|
attr_dev(img, "alt", "Zed's Face");
|
|
if (img.src !== (img_src_value = "https://via.placeholder.com/256x256?text=Zed's Face")) attr_dev(img, "src", img_src_value);
|
|
add_location(img, file$g, 97, 6, 1461);
|
|
attr_dev(figure, "class", "svelte-1ri9kvn");
|
|
add_location(figure, file$g, 96, 4, 1446);
|
|
add_location(b1, file$g, 102, 8, 1586);
|
|
attr_dev(button1, "class", "svelte-1ri9kvn");
|
|
add_location(button1, file$g, 102, 23, 1601);
|
|
attr_dev(p0, "class", "svelte-1ri9kvn");
|
|
add_location(p0, file$g, 101, 6, 1574);
|
|
add_location(b2, file$g, 106, 8, 1655);
|
|
add_location(b3, file$g, 106, 25, 1672);
|
|
add_location(b4, file$g, 106, 48, 1695);
|
|
attr_dev(p1, "class", "svelte-1ri9kvn");
|
|
add_location(p1, file$g, 105, 6, 1643);
|
|
add_location(b5, file$g, 109, 9, 1739);
|
|
attr_dev(p2, "class", "svelte-1ri9kvn");
|
|
add_location(p2, file$g, 109, 6, 1736);
|
|
add_location(br, file$g, 110, 102, 1864);
|
|
attr_dev(a1, "href", "www.twitch.tv/zedashaw");
|
|
attr_dev(a1, "class", "svelte-1ri9kvn");
|
|
add_location(a1, file$g, 111, 8, 1877);
|
|
attr_dev(p3, "class", "svelte-1ri9kvn");
|
|
add_location(p3, file$g, 110, 6, 1768);
|
|
attr_dev(info, "class", "svelte-1ri9kvn");
|
|
add_location(info, file$g, 100, 4, 1561);
|
|
attr_dev(profile, "class", "svelte-1ri9kvn");
|
|
add_location(profile, file$g, 95, 2, 1432);
|
|
attr_dev(pins_1, "class", "svelte-1ri9kvn");
|
|
add_location(pins_1, file$g, 116, 2, 1976);
|
|
add_location(li2, file$g, 127, 8, 2173);
|
|
add_location(li3, file$g, 128, 8, 2243);
|
|
add_location(li4, file$g, 129, 8, 2314);
|
|
add_location(li5, file$g, 130, 8, 2379);
|
|
add_location(ul1, file$g, 126, 6, 2160);
|
|
attr_dev(nav1, "class", "svelte-1ri9kvn");
|
|
add_location(nav1, file$g, 125, 4, 2148);
|
|
attr_dev(tabs, "class", "svelte-1ri9kvn");
|
|
add_location(tabs, file$g, 124, 2, 2137);
|
|
attr_dev(posts_1, "class", "svelte-1ri9kvn");
|
|
add_location(posts_1, file$g, 135, 2, 2478);
|
|
attr_dev(content, "class", "svelte-1ri9kvn");
|
|
add_location(content, file$g, 83, 0, 1169);
|
|
},
|
|
l: function claim(nodes) {
|
|
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, content, anchor);
|
|
append_dev(content, header);
|
|
append_dev(header, nav0);
|
|
append_dev(nav0, b0);
|
|
mount_component(icon0, b0, null);
|
|
append_dev(b0, t0);
|
|
append_dev(nav0, t1);
|
|
append_dev(nav0, input);
|
|
append_dev(nav0, t2);
|
|
append_dev(nav0, ul0);
|
|
append_dev(ul0, li0);
|
|
append_dev(li0, button0);
|
|
append_dev(ul0, t4);
|
|
append_dev(ul0, li1);
|
|
append_dev(li1, a0);
|
|
append_dev(content, t6);
|
|
append_dev(content, profile);
|
|
append_dev(profile, figure);
|
|
append_dev(figure, img);
|
|
append_dev(profile, t7);
|
|
append_dev(profile, info);
|
|
append_dev(info, p0);
|
|
append_dev(p0, b1);
|
|
append_dev(p0, t9);
|
|
append_dev(p0, button1);
|
|
append_dev(info, t11);
|
|
append_dev(info, p1);
|
|
append_dev(p1, b2);
|
|
append_dev(p1, t13);
|
|
append_dev(p1, b3);
|
|
append_dev(p1, t15);
|
|
append_dev(p1, b4);
|
|
append_dev(info, t17);
|
|
append_dev(info, p2);
|
|
append_dev(p2, b5);
|
|
append_dev(info, t19);
|
|
append_dev(info, p3);
|
|
append_dev(p3, t20);
|
|
append_dev(p3, br);
|
|
append_dev(p3, t21);
|
|
append_dev(p3, a1);
|
|
append_dev(content, t23);
|
|
append_dev(content, pins_1);
|
|
|
|
for (let i = 0; i < each_blocks_1.length; i += 1) {
|
|
each_blocks_1[i].m(pins_1, null);
|
|
}
|
|
|
|
append_dev(content, t24);
|
|
append_dev(content, tabs);
|
|
append_dev(tabs, nav1);
|
|
append_dev(nav1, ul1);
|
|
append_dev(ul1, li2);
|
|
mount_component(icon1, li2, null);
|
|
append_dev(li2, t25);
|
|
append_dev(ul1, t26);
|
|
append_dev(ul1, li3);
|
|
mount_component(icon2, li3, null);
|
|
append_dev(li3, t27);
|
|
append_dev(ul1, t28);
|
|
append_dev(ul1, li4);
|
|
mount_component(icon3, li4, null);
|
|
append_dev(li4, t29);
|
|
append_dev(ul1, t30);
|
|
append_dev(ul1, li5);
|
|
mount_component(icon4, li5, null);
|
|
append_dev(li5, t31);
|
|
append_dev(content, t32);
|
|
append_dev(content, posts_1);
|
|
|
|
for (let i = 0; i < each_blocks.length; i += 1) {
|
|
each_blocks[i].m(posts_1, null);
|
|
}
|
|
|
|
current = true;
|
|
},
|
|
p: noop,
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(icon0.$$.fragment, local);
|
|
transition_in(icon1.$$.fragment, local);
|
|
transition_in(icon2.$$.fragment, local);
|
|
transition_in(icon3.$$.fragment, local);
|
|
transition_in(icon4.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(icon0.$$.fragment, local);
|
|
transition_out(icon1.$$.fragment, local);
|
|
transition_out(icon2.$$.fragment, local);
|
|
transition_out(icon3.$$.fragment, local);
|
|
transition_out(icon4.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(content);
|
|
destroy_component(icon0);
|
|
destroy_each(each_blocks_1, detaching);
|
|
destroy_component(icon1);
|
|
destroy_component(icon2);
|
|
destroy_component(icon3);
|
|
destroy_component(icon4);
|
|
destroy_each(each_blocks, detaching);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$h.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function instance$h($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Instagram", slots, []);
|
|
let posts = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
|
|
let pins = [1, 2, 3, 4];
|
|
const writable_props = [];
|
|
|
|
Object.keys($$props).forEach(key => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(`<Instagram> was created with unknown prop '${key}'`);
|
|
});
|
|
|
|
$$self.$capture_state = () => ({ link, Icon, posts, pins });
|
|
|
|
$$self.$inject_state = $$props => {
|
|
if ("posts" in $$props) $$invalidate(0, posts = $$props.posts);
|
|
if ("pins" in $$props) $$invalidate(1, pins = $$props.pins);
|
|
};
|
|
|
|
if ($$props && "$$inject" in $$props) {
|
|
$$self.$inject_state($$props.$$inject);
|
|
}
|
|
|
|
return [posts, pins];
|
|
}
|
|
|
|
class Instagram$1 extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$h, create_fragment$h, safe_not_equal, {});
|
|
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Instagram",
|
|
options,
|
|
id: create_fragment$h.name
|
|
});
|
|
}
|
|
}
|
|
|
|
/* src/demos/Pinterest.svelte generated by Svelte v3.30.0 */
|
|
const file$h = "src/demos/Pinterest.svelte";
|
|
|
|
function get_each_context$4(ctx, list, i) {
|
|
const child_ctx = ctx.slice();
|
|
child_ctx[6] = list[i];
|
|
return child_ctx;
|
|
}
|
|
|
|
function get_each_context_1$2(ctx, list, i) {
|
|
const child_ctx = ctx.slice();
|
|
child_ctx[9] = list[i];
|
|
return child_ctx;
|
|
}
|
|
|
|
// (154:2) {#if !thumbnail}
|
|
function create_if_block$3(ctx) {
|
|
let profile;
|
|
let info;
|
|
let h1;
|
|
let t1;
|
|
let p0;
|
|
let t3;
|
|
let p1;
|
|
let b0;
|
|
let t5;
|
|
let b1;
|
|
let t7;
|
|
let t8;
|
|
let p2;
|
|
let t10;
|
|
let figure;
|
|
let img;
|
|
let img_src_value;
|
|
let t11;
|
|
let pins;
|
|
let each_value = /*lanes*/ ctx[1];
|
|
validate_each_argument(each_value);
|
|
let each_blocks = [];
|
|
|
|
for (let i = 0; i < each_value.length; i += 1) {
|
|
each_blocks[i] = create_each_block$4(get_each_context$4(ctx, each_value, i));
|
|
}
|
|
|
|
const block = {
|
|
c: function create() {
|
|
profile = element("profile");
|
|
info = element("info");
|
|
h1 = element("h1");
|
|
h1.textContent = "Vincent van Gogh";
|
|
t1 = space();
|
|
p0 = element("p");
|
|
p0.textContent = "Collection by A Person";
|
|
t3 = space();
|
|
p1 = element("p");
|
|
b0 = element("b");
|
|
b0.textContent = "420";
|
|
t5 = text(" Pins • ");
|
|
b1 = element("b");
|
|
b1.textContent = "3.59k";
|
|
t7 = text(" Followers");
|
|
t8 = space();
|
|
p2 = element("p");
|
|
p2.textContent = "\"I dream my painting and I paint my dream.\" ~ Vincent van Gogh";
|
|
t10 = space();
|
|
figure = element("figure");
|
|
img = element("img");
|
|
t11 = space();
|
|
pins = element("pins");
|
|
|
|
for (let i = 0; i < each_blocks.length; i += 1) {
|
|
each_blocks[i].c();
|
|
}
|
|
|
|
attr_dev(h1, "class", "svelte-79nfuj");
|
|
add_location(h1, file$h, 156, 8, 2419);
|
|
attr_dev(p0, "class", "svelte-79nfuj");
|
|
add_location(p0, file$h, 157, 8, 2453);
|
|
attr_dev(b0, "class", "svelte-79nfuj");
|
|
add_location(b0, file$h, 158, 11, 2494);
|
|
attr_dev(b1, "class", "svelte-79nfuj");
|
|
add_location(b1, file$h, 158, 29, 2512);
|
|
attr_dev(p1, "class", "svelte-79nfuj");
|
|
add_location(p1, file$h, 158, 8, 2491);
|
|
attr_dev(p2, "class", "svelte-79nfuj");
|
|
add_location(p2, file$h, 159, 8, 2547);
|
|
attr_dev(info, "class", "svelte-79nfuj");
|
|
add_location(info, file$h, 155, 6, 2404);
|
|
attr_dev(img, "alt", "Zed's Face");
|
|
if (img.src !== (img_src_value = "https://via.placeholder.com/128x128?text=Zed's Face")) attr_dev(img, "src", img_src_value);
|
|
attr_dev(img, "class", "svelte-79nfuj");
|
|
add_location(img, file$h, 163, 8, 2651);
|
|
attr_dev(figure, "class", "svelte-79nfuj");
|
|
add_location(figure, file$h, 162, 6, 2634);
|
|
attr_dev(profile, "class", "svelte-79nfuj");
|
|
add_location(profile, file$h, 154, 4, 2388);
|
|
attr_dev(pins, "class", "svelte-79nfuj");
|
|
add_location(pins, file$h, 167, 4, 2768);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, profile, anchor);
|
|
append_dev(profile, info);
|
|
append_dev(info, h1);
|
|
append_dev(info, t1);
|
|
append_dev(info, p0);
|
|
append_dev(info, t3);
|
|
append_dev(info, p1);
|
|
append_dev(p1, b0);
|
|
append_dev(p1, t5);
|
|
append_dev(p1, b1);
|
|
append_dev(p1, t7);
|
|
append_dev(info, t8);
|
|
append_dev(info, p2);
|
|
append_dev(profile, t10);
|
|
append_dev(profile, figure);
|
|
append_dev(figure, img);
|
|
insert_dev(target, t11, anchor);
|
|
insert_dev(target, pins, anchor);
|
|
|
|
for (let i = 0; i < each_blocks.length; i += 1) {
|
|
each_blocks[i].m(pins, null);
|
|
}
|
|
},
|
|
p: function update(ctx, dirty) {
|
|
if (dirty & /*random_sample, pin_sizes*/ 12) {
|
|
each_value = /*lanes*/ ctx[1];
|
|
validate_each_argument(each_value);
|
|
let i;
|
|
|
|
for (i = 0; i < each_value.length; i += 1) {
|
|
const child_ctx = get_each_context$4(ctx, each_value, i);
|
|
|
|
if (each_blocks[i]) {
|
|
each_blocks[i].p(child_ctx, dirty);
|
|
} else {
|
|
each_blocks[i] = create_each_block$4(child_ctx);
|
|
each_blocks[i].c();
|
|
each_blocks[i].m(pins, null);
|
|
}
|
|
}
|
|
|
|
for (; i < each_blocks.length; i += 1) {
|
|
each_blocks[i].d(1);
|
|
}
|
|
|
|
each_blocks.length = each_value.length;
|
|
}
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(profile);
|
|
if (detaching) detach_dev(t11);
|
|
if (detaching) detach_dev(pins);
|
|
destroy_each(each_blocks, detaching);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_if_block$3.name,
|
|
type: "if",
|
|
source: "(154:2) {#if !thumbnail}",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
// (171:8) {#each random_sample(pin_sizes, 10) as height}
|
|
function create_each_block_1$2(ctx) {
|
|
let figure;
|
|
let img;
|
|
let img_src_value;
|
|
let t0;
|
|
let figcaption;
|
|
let t1;
|
|
let t2_value = /*height*/ ctx[9] + "";
|
|
let t2;
|
|
let t3;
|
|
|
|
const block = {
|
|
c: function create() {
|
|
figure = element("figure");
|
|
img = element("img");
|
|
t0 = space();
|
|
figcaption = element("figcaption");
|
|
t1 = text("Something about Van Gogh ");
|
|
t2 = text(t2_value);
|
|
t3 = text(" high.");
|
|
attr_dev(img, "alt", "Zed's Face");
|
|
if (img.src !== (img_src_value = "https://via.placeholder.com/240x" + /*height*/ ctx[9] + "?text=Art240x" + /*height*/ ctx[9])) attr_dev(img, "src", img_src_value);
|
|
attr_dev(img, "class", "svelte-79nfuj");
|
|
add_location(img, file$h, 172, 12, 2900);
|
|
attr_dev(figcaption, "class", "svelte-79nfuj");
|
|
add_location(figcaption, file$h, 173, 12, 3003);
|
|
attr_dev(figure, "class", "svelte-79nfuj");
|
|
add_location(figure, file$h, 171, 10, 2879);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, figure, anchor);
|
|
append_dev(figure, img);
|
|
append_dev(figure, t0);
|
|
append_dev(figure, figcaption);
|
|
append_dev(figcaption, t1);
|
|
append_dev(figcaption, t2);
|
|
append_dev(figcaption, t3);
|
|
},
|
|
p: noop,
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(figure);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_each_block_1$2.name,
|
|
type: "each",
|
|
source: "(171:8) {#each random_sample(pin_sizes, 10) as height}",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
// (169:4) {#each lanes as lane}
|
|
function create_each_block$4(ctx) {
|
|
let lane;
|
|
let t;
|
|
let each_value_1 = /*random_sample*/ ctx[3](/*pin_sizes*/ ctx[2], 10);
|
|
validate_each_argument(each_value_1);
|
|
let each_blocks = [];
|
|
|
|
for (let i = 0; i < each_value_1.length; i += 1) {
|
|
each_blocks[i] = create_each_block_1$2(get_each_context_1$2(ctx, each_value_1, i));
|
|
}
|
|
|
|
const block = {
|
|
c: function create() {
|
|
lane = element("lane");
|
|
|
|
for (let i = 0; i < each_blocks.length; i += 1) {
|
|
each_blocks[i].c();
|
|
}
|
|
|
|
t = space();
|
|
attr_dev(lane, "class", "svelte-79nfuj");
|
|
add_location(lane, file$h, 169, 6, 2807);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, lane, anchor);
|
|
|
|
for (let i = 0; i < each_blocks.length; i += 1) {
|
|
each_blocks[i].m(lane, null);
|
|
}
|
|
|
|
append_dev(lane, t);
|
|
},
|
|
p: function update(ctx, dirty) {
|
|
if (dirty & /*random_sample, pin_sizes*/ 12) {
|
|
each_value_1 = /*random_sample*/ ctx[3](/*pin_sizes*/ ctx[2], 10);
|
|
validate_each_argument(each_value_1);
|
|
let i;
|
|
|
|
for (i = 0; i < each_value_1.length; i += 1) {
|
|
const child_ctx = get_each_context_1$2(ctx, each_value_1, i);
|
|
|
|
if (each_blocks[i]) {
|
|
each_blocks[i].p(child_ctx, dirty);
|
|
} else {
|
|
each_blocks[i] = create_each_block_1$2(child_ctx);
|
|
each_blocks[i].c();
|
|
each_blocks[i].m(lane, t);
|
|
}
|
|
}
|
|
|
|
for (; i < each_blocks.length; i += 1) {
|
|
each_blocks[i].d(1);
|
|
}
|
|
|
|
each_blocks.length = each_value_1.length;
|
|
}
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(lane);
|
|
destroy_each(each_blocks, detaching);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_each_block$4.name,
|
|
type: "each",
|
|
source: "(169:4) {#each lanes as lane}",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function create_fragment$i(ctx) {
|
|
let content;
|
|
let header;
|
|
let nav;
|
|
let left;
|
|
let logo;
|
|
let icon;
|
|
let t0;
|
|
let t1;
|
|
let a0;
|
|
let t3;
|
|
let a1;
|
|
let t5;
|
|
let input;
|
|
let t6;
|
|
let ul;
|
|
let li0;
|
|
let button0;
|
|
let t8;
|
|
let li1;
|
|
let button1;
|
|
let t10;
|
|
let current;
|
|
|
|
icon = new Icon({
|
|
props: { name: "pinterest", color: "var(--color)" },
|
|
$$inline: true
|
|
});
|
|
|
|
let if_block = !/*thumbnail*/ ctx[0] && create_if_block$3(ctx);
|
|
|
|
const block = {
|
|
c: function create() {
|
|
content = element("content");
|
|
header = element("header");
|
|
nav = element("nav");
|
|
left = element("left");
|
|
logo = element("logo");
|
|
create_component(icon.$$.fragment);
|
|
t0 = text(" Pinterest");
|
|
t1 = space();
|
|
a0 = element("a");
|
|
a0.textContent = "Today";
|
|
t3 = space();
|
|
a1 = element("a");
|
|
a1.textContent = "Explore";
|
|
t5 = space();
|
|
input = element("input");
|
|
t6 = space();
|
|
ul = element("ul");
|
|
li0 = element("li");
|
|
button0 = element("button");
|
|
button0.textContent = "Log In";
|
|
t8 = space();
|
|
li1 = element("li");
|
|
button1 = element("button");
|
|
button1.textContent = "Sign Up";
|
|
t10 = space();
|
|
if (if_block) if_block.c();
|
|
attr_dev(logo, "class", "svelte-79nfuj");
|
|
add_location(logo, file$h, 139, 8, 2058);
|
|
attr_dev(a0, "class", "svelte-79nfuj");
|
|
add_location(a0, file$h, 140, 8, 2136);
|
|
attr_dev(a1, "class", "svelte-79nfuj");
|
|
add_location(a1, file$h, 141, 8, 2157);
|
|
attr_dev(left, "class", "svelte-79nfuj");
|
|
add_location(left, file$h, 138, 6, 2043);
|
|
attr_dev(input, "placeholder", "Search");
|
|
attr_dev(input, "class", "svelte-79nfuj");
|
|
add_location(input, file$h, 144, 6, 2193);
|
|
attr_dev(button0, "class", "svelte-79nfuj");
|
|
add_location(button0, file$h, 147, 12, 2246);
|
|
attr_dev(li0, "class", "svelte-79nfuj");
|
|
add_location(li0, file$h, 147, 8, 2242);
|
|
attr_dev(button1, "id", "signup");
|
|
attr_dev(button1, "class", "svelte-79nfuj");
|
|
add_location(button1, file$h, 148, 12, 2287);
|
|
attr_dev(li1, "class", "svelte-79nfuj");
|
|
add_location(li1, file$h, 148, 8, 2283);
|
|
attr_dev(ul, "class", "svelte-79nfuj");
|
|
add_location(ul, file$h, 146, 6, 2229);
|
|
attr_dev(nav, "class", "svelte-79nfuj");
|
|
add_location(nav, file$h, 137, 4, 2031);
|
|
attr_dev(header, "class", "svelte-79nfuj");
|
|
add_location(header, file$h, 136, 2, 2018);
|
|
attr_dev(content, "class", "svelte-79nfuj");
|
|
add_location(content, file$h, 135, 0, 2006);
|
|
},
|
|
l: function claim(nodes) {
|
|
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, content, anchor);
|
|
append_dev(content, header);
|
|
append_dev(header, nav);
|
|
append_dev(nav, left);
|
|
append_dev(left, logo);
|
|
mount_component(icon, logo, null);
|
|
append_dev(logo, t0);
|
|
append_dev(left, t1);
|
|
append_dev(left, a0);
|
|
append_dev(left, t3);
|
|
append_dev(left, a1);
|
|
append_dev(nav, t5);
|
|
append_dev(nav, input);
|
|
append_dev(nav, t6);
|
|
append_dev(nav, ul);
|
|
append_dev(ul, li0);
|
|
append_dev(li0, button0);
|
|
append_dev(ul, t8);
|
|
append_dev(ul, li1);
|
|
append_dev(li1, button1);
|
|
append_dev(content, t10);
|
|
if (if_block) if_block.m(content, null);
|
|
current = true;
|
|
},
|
|
p: function update(ctx, [dirty]) {
|
|
if (!/*thumbnail*/ ctx[0]) {
|
|
if (if_block) {
|
|
if_block.p(ctx, dirty);
|
|
} else {
|
|
if_block = create_if_block$3(ctx);
|
|
if_block.c();
|
|
if_block.m(content, null);
|
|
}
|
|
} else if (if_block) {
|
|
if_block.d(1);
|
|
if_block = null;
|
|
}
|
|
},
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(icon.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(icon.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(content);
|
|
destroy_component(icon);
|
|
if (if_block) if_block.d();
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$i.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function instance$i($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Pinterest", slots, []);
|
|
let samples = [1, 2, 3];
|
|
let lanes = [1, 2, 3, 4, 5];
|
|
let pin_sizes = [240, 180, 250, 580];
|
|
let { thumbnail = false } = $$props;
|
|
|
|
const random_select = from_array => {
|
|
let min = Math.ceil(0);
|
|
let max = Math.floor(from_array.length);
|
|
let index = Math.floor(Math.random() * (max - min) + min);
|
|
return from_array[index];
|
|
};
|
|
|
|
const random_sample = (from_array, count) => {
|
|
let result = [];
|
|
|
|
for (let i = 0; i < count; i++) {
|
|
result.push(random_select(from_array));
|
|
}
|
|
|
|
return result;
|
|
};
|
|
|
|
const writable_props = ["thumbnail"];
|
|
|
|
Object.keys($$props).forEach(key => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(`<Pinterest> was created with unknown prop '${key}'`);
|
|
});
|
|
|
|
$$self.$$set = $$props => {
|
|
if ("thumbnail" in $$props) $$invalidate(0, thumbnail = $$props.thumbnail);
|
|
};
|
|
|
|
$$self.$capture_state = () => ({
|
|
link,
|
|
Icon,
|
|
samples,
|
|
lanes,
|
|
pin_sizes,
|
|
thumbnail,
|
|
random_select,
|
|
random_sample
|
|
});
|
|
|
|
$$self.$inject_state = $$props => {
|
|
if ("samples" in $$props) samples = $$props.samples;
|
|
if ("lanes" in $$props) $$invalidate(1, lanes = $$props.lanes);
|
|
if ("pin_sizes" in $$props) $$invalidate(2, pin_sizes = $$props.pin_sizes);
|
|
if ("thumbnail" in $$props) $$invalidate(0, thumbnail = $$props.thumbnail);
|
|
};
|
|
|
|
if ($$props && "$$inject" in $$props) {
|
|
$$self.$inject_state($$props.$$inject);
|
|
}
|
|
|
|
return [thumbnail, lanes, pin_sizes, random_sample];
|
|
}
|
|
|
|
class Pinterest$1 extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$i, create_fragment$i, safe_not_equal, { thumbnail: 0 });
|
|
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Pinterest",
|
|
options,
|
|
id: create_fragment$i.name
|
|
});
|
|
}
|
|
|
|
get thumbnail() {
|
|
throw new Error("<Pinterest>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
set thumbnail(value) {
|
|
throw new Error("<Pinterest>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
}
|
|
|
|
/* src/demos/XorAcademy.svelte generated by Svelte v3.30.0 */
|
|
const file$i = "src/demos/XorAcademy.svelte";
|
|
|
|
function get_each_context$5(ctx, list, i) {
|
|
const child_ctx = ctx.slice();
|
|
child_ctx[2] = list[i];
|
|
return child_ctx;
|
|
}
|
|
|
|
function get_each_context_1$3(ctx, list, i) {
|
|
const child_ctx = ctx.slice();
|
|
child_ctx[5] = list[i];
|
|
return child_ctx;
|
|
}
|
|
|
|
// (139:2) {#each related as pin}
|
|
function create_each_block_1$3(ctx) {
|
|
let figure;
|
|
let img;
|
|
let img_src_value;
|
|
let t;
|
|
|
|
const block = {
|
|
c: function create() {
|
|
figure = element("figure");
|
|
img = element("img");
|
|
t = space();
|
|
attr_dev(img, "alt", "Stock photo");
|
|
if (img.src !== (img_src_value = "https://via.placeholder.com/82x82?text=Related")) attr_dev(img, "src", img_src_value);
|
|
add_location(img, file$i, 140, 6, 2409);
|
|
add_location(figure, file$i, 139, 4, 2394);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, figure, anchor);
|
|
append_dev(figure, img);
|
|
append_dev(figure, t);
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(figure);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_each_block_1$3.name,
|
|
type: "each",
|
|
source: "(139:2) {#each related as pin}",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
// (147:2) {#each posts as post}
|
|
function create_each_block$5(ctx) {
|
|
let figure;
|
|
let a;
|
|
let img;
|
|
let img_src_value;
|
|
let link_action;
|
|
let t;
|
|
let mounted;
|
|
let dispose;
|
|
|
|
const block = {
|
|
c: function create() {
|
|
figure = element("figure");
|
|
a = element("a");
|
|
img = element("img");
|
|
t = space();
|
|
attr_dev(img, "alt", "Placeholder");
|
|
if (img.src !== (img_src_value = "https://via.placeholder.com/300x300?text=Video Thumb")) attr_dev(img, "src", img_src_value);
|
|
add_location(img, file$i, 149, 8, 2630);
|
|
attr_dev(a, "href", "/demos/xoracademy/watch");
|
|
attr_dev(a, "class", "svelte-i1di9h");
|
|
add_location(a, file$i, 148, 6, 2578);
|
|
attr_dev(figure, "class", "svelte-i1di9h");
|
|
add_location(figure, file$i, 147, 4, 2563);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, figure, anchor);
|
|
append_dev(figure, a);
|
|
append_dev(a, img);
|
|
append_dev(figure, t);
|
|
|
|
if (!mounted) {
|
|
dispose = action_destroyer(link_action = link.call(null, a));
|
|
mounted = true;
|
|
}
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(figure);
|
|
mounted = false;
|
|
dispose();
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_each_block$5.name,
|
|
type: "each",
|
|
source: "(147:2) {#each posts as post}",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function create_fragment$j(ctx) {
|
|
let content;
|
|
let header;
|
|
let nav;
|
|
let b0;
|
|
let a0;
|
|
let icon;
|
|
let t0;
|
|
let link_action;
|
|
let t1;
|
|
let input;
|
|
let t2;
|
|
let ul;
|
|
let li0;
|
|
let a1;
|
|
let button0;
|
|
let link_action_1;
|
|
let t4;
|
|
let li1;
|
|
let a2;
|
|
let t6;
|
|
let profile;
|
|
let figure;
|
|
let img;
|
|
let img_src_value;
|
|
let t7;
|
|
let info;
|
|
let p0;
|
|
let button1;
|
|
let t9;
|
|
let p1;
|
|
let b1;
|
|
let t11;
|
|
let b2;
|
|
let t13;
|
|
let h3;
|
|
let t15;
|
|
let p2;
|
|
let t17;
|
|
let related_1;
|
|
let t18;
|
|
let posts_1;
|
|
let current;
|
|
let mounted;
|
|
let dispose;
|
|
|
|
icon = new Icon({
|
|
props: {
|
|
name: "edit-3",
|
|
color: "var(--color-text)"
|
|
},
|
|
$$inline: true
|
|
});
|
|
|
|
let each_value_1 = /*related*/ ctx[1];
|
|
validate_each_argument(each_value_1);
|
|
let each_blocks_1 = [];
|
|
|
|
for (let i = 0; i < each_value_1.length; i += 1) {
|
|
each_blocks_1[i] = create_each_block_1$3(get_each_context_1$3(ctx, each_value_1, i));
|
|
}
|
|
|
|
let each_value = /*posts*/ ctx[0];
|
|
validate_each_argument(each_value);
|
|
let each_blocks = [];
|
|
|
|
for (let i = 0; i < each_value.length; i += 1) {
|
|
each_blocks[i] = create_each_block$5(get_each_context$5(ctx, each_value, i));
|
|
}
|
|
|
|
const block = {
|
|
c: function create() {
|
|
content = element("content");
|
|
header = element("header");
|
|
nav = element("nav");
|
|
b0 = element("b");
|
|
a0 = element("a");
|
|
create_component(icon.$$.fragment);
|
|
t0 = text(" Xor.Academy");
|
|
t1 = space();
|
|
input = element("input");
|
|
t2 = space();
|
|
ul = element("ul");
|
|
li0 = element("li");
|
|
a1 = element("a");
|
|
button0 = element("button");
|
|
button0.textContent = "Log In";
|
|
t4 = space();
|
|
li1 = element("li");
|
|
a2 = element("a");
|
|
a2.textContent = "Sign Up";
|
|
t6 = space();
|
|
profile = element("profile");
|
|
figure = element("figure");
|
|
img = element("img");
|
|
t7 = space();
|
|
info = element("info");
|
|
p0 = element("p");
|
|
button1 = element("button");
|
|
button1.textContent = "Follow";
|
|
t9 = space();
|
|
p1 = element("p");
|
|
b1 = element("b");
|
|
b1.textContent = "10";
|
|
t11 = text(" videos ");
|
|
b2 = element("b");
|
|
b2.textContent = "4,695 followers";
|
|
t13 = space();
|
|
h3 = element("h3");
|
|
h3.textContent = "Drawing Level 1";
|
|
t15 = space();
|
|
p2 = element("p");
|
|
p2.textContent = "The first module you should take. It covers the basics of drawing and how to get started\n making drawing a habit.";
|
|
t17 = space();
|
|
related_1 = element("related");
|
|
|
|
for (let i = 0; i < each_blocks_1.length; i += 1) {
|
|
each_blocks_1[i].c();
|
|
}
|
|
|
|
t18 = space();
|
|
posts_1 = element("posts");
|
|
|
|
for (let i = 0; i < each_blocks.length; i += 1) {
|
|
each_blocks[i].c();
|
|
}
|
|
|
|
attr_dev(a0, "id", "logo-link");
|
|
attr_dev(a0, "href", "/demos/xoracademy");
|
|
attr_dev(a0, "class", "svelte-i1di9h");
|
|
add_location(a0, file$i, 107, 9, 1576);
|
|
add_location(b0, file$i, 107, 6, 1573);
|
|
attr_dev(input, "placeholder", "Search");
|
|
attr_dev(input, "class", "svelte-i1di9h");
|
|
add_location(input, file$i, 108, 6, 1703);
|
|
attr_dev(button0, "class", "svelte-i1di9h");
|
|
add_location(button0, file$i, 110, 44, 1787);
|
|
attr_dev(a1, "href", "/demos/login");
|
|
attr_dev(a1, "class", "svelte-i1di9h");
|
|
add_location(a1, file$i, 110, 12, 1755);
|
|
add_location(li0, file$i, 110, 8, 1751);
|
|
attr_dev(a2, "class", "svelte-i1di9h");
|
|
add_location(a2, file$i, 111, 12, 1832);
|
|
add_location(li1, file$i, 111, 8, 1828);
|
|
add_location(ul, file$i, 109, 6, 1738);
|
|
attr_dev(nav, "class", "svelte-i1di9h");
|
|
add_location(nav, file$i, 106, 4, 1561);
|
|
attr_dev(header, "class", "svelte-i1di9h");
|
|
add_location(header, file$i, 105, 2, 1548);
|
|
attr_dev(img, "alt", "Module Thumb");
|
|
if (img.src !== (img_src_value = "https://via.placeholder.com/256x256?text=Module+Thumb")) attr_dev(img, "src", img_src_value);
|
|
add_location(img, file$i, 118, 6, 1919);
|
|
attr_dev(figure, "class", "svelte-i1di9h");
|
|
add_location(figure, file$i, 117, 4, 1904);
|
|
add_location(button1, file$i, 123, 8, 2048);
|
|
attr_dev(p0, "class", "svelte-i1di9h");
|
|
add_location(p0, file$i, 122, 6, 2036);
|
|
add_location(b1, file$i, 127, 8, 2102);
|
|
add_location(b2, file$i, 127, 25, 2119);
|
|
attr_dev(p1, "class", "svelte-i1di9h");
|
|
add_location(p1, file$i, 126, 6, 2090);
|
|
add_location(h3, file$i, 130, 6, 2160);
|
|
attr_dev(p2, "class", "svelte-i1di9h");
|
|
add_location(p2, file$i, 131, 6, 2191);
|
|
attr_dev(info, "class", "svelte-i1di9h");
|
|
add_location(info, file$i, 121, 4, 2023);
|
|
attr_dev(profile, "class", "svelte-i1di9h");
|
|
add_location(profile, file$i, 116, 2, 1890);
|
|
attr_dev(related_1, "class", "svelte-i1di9h");
|
|
add_location(related_1, file$i, 137, 2, 2355);
|
|
attr_dev(posts_1, "class", "svelte-i1di9h");
|
|
add_location(posts_1, file$i, 145, 2, 2527);
|
|
attr_dev(content, "class", "svelte-i1di9h");
|
|
add_location(content, file$i, 104, 0, 1536);
|
|
},
|
|
l: function claim(nodes) {
|
|
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, content, anchor);
|
|
append_dev(content, header);
|
|
append_dev(header, nav);
|
|
append_dev(nav, b0);
|
|
append_dev(b0, a0);
|
|
mount_component(icon, a0, null);
|
|
append_dev(a0, t0);
|
|
append_dev(nav, t1);
|
|
append_dev(nav, input);
|
|
append_dev(nav, t2);
|
|
append_dev(nav, ul);
|
|
append_dev(ul, li0);
|
|
append_dev(li0, a1);
|
|
append_dev(a1, button0);
|
|
append_dev(ul, t4);
|
|
append_dev(ul, li1);
|
|
append_dev(li1, a2);
|
|
append_dev(content, t6);
|
|
append_dev(content, profile);
|
|
append_dev(profile, figure);
|
|
append_dev(figure, img);
|
|
append_dev(profile, t7);
|
|
append_dev(profile, info);
|
|
append_dev(info, p0);
|
|
append_dev(p0, button1);
|
|
append_dev(info, t9);
|
|
append_dev(info, p1);
|
|
append_dev(p1, b1);
|
|
append_dev(p1, t11);
|
|
append_dev(p1, b2);
|
|
append_dev(info, t13);
|
|
append_dev(info, h3);
|
|
append_dev(info, t15);
|
|
append_dev(info, p2);
|
|
append_dev(content, t17);
|
|
append_dev(content, related_1);
|
|
|
|
for (let i = 0; i < each_blocks_1.length; i += 1) {
|
|
each_blocks_1[i].m(related_1, null);
|
|
}
|
|
|
|
append_dev(content, t18);
|
|
append_dev(content, posts_1);
|
|
|
|
for (let i = 0; i < each_blocks.length; i += 1) {
|
|
each_blocks[i].m(posts_1, null);
|
|
}
|
|
|
|
current = true;
|
|
|
|
if (!mounted) {
|
|
dispose = [
|
|
action_destroyer(link_action = link.call(null, a0)),
|
|
action_destroyer(link_action_1 = link.call(null, a1))
|
|
];
|
|
|
|
mounted = true;
|
|
}
|
|
},
|
|
p: noop,
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(icon.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(icon.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(content);
|
|
destroy_component(icon);
|
|
destroy_each(each_blocks_1, detaching);
|
|
destroy_each(each_blocks, detaching);
|
|
mounted = false;
|
|
run_all(dispose);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$j.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function instance$j($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("XorAcademy", slots, []);
|
|
let posts = [1, 2, 3, 4, 5, 6, 7, 8, 9];
|
|
let related = [1, 2, 3, 4];
|
|
const writable_props = [];
|
|
|
|
Object.keys($$props).forEach(key => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(`<XorAcademy> was created with unknown prop '${key}'`);
|
|
});
|
|
|
|
$$self.$capture_state = () => ({ link, Icon, posts, related });
|
|
|
|
$$self.$inject_state = $$props => {
|
|
if ("posts" in $$props) $$invalidate(0, posts = $$props.posts);
|
|
if ("related" in $$props) $$invalidate(1, related = $$props.related);
|
|
};
|
|
|
|
if ($$props && "$$inject" in $$props) {
|
|
$$self.$inject_state($$props.$$inject);
|
|
}
|
|
|
|
return [posts, related];
|
|
}
|
|
|
|
class XorAcademy extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$j, create_fragment$j, safe_not_equal, {});
|
|
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "XorAcademy",
|
|
options,
|
|
id: create_fragment$j.name
|
|
});
|
|
}
|
|
}
|
|
|
|
/* src/demos/XorAcademyWatch.svelte generated by Svelte v3.30.0 */
|
|
const file$j = "src/demos/XorAcademyWatch.svelte";
|
|
|
|
function get_each_context$6(ctx, list, i) {
|
|
const child_ctx = ctx.slice();
|
|
child_ctx[1] = list[i];
|
|
return child_ctx;
|
|
}
|
|
|
|
// (225:6) {#each cards as card}
|
|
function create_each_block$6(ctx) {
|
|
let card;
|
|
let img;
|
|
let img_src_value;
|
|
let t0;
|
|
let info;
|
|
let h4;
|
|
let t2;
|
|
let p;
|
|
let t4;
|
|
let nav;
|
|
let icon0;
|
|
let t5;
|
|
let t6;
|
|
let reply;
|
|
let icon1;
|
|
let t7;
|
|
let t8;
|
|
let current;
|
|
|
|
icon0 = new Icon({
|
|
props: {
|
|
name: "thumbs-up",
|
|
color: "var(--sub-color)"
|
|
},
|
|
$$inline: true
|
|
});
|
|
|
|
icon1 = new Icon({
|
|
props: { name: "chevron-down" },
|
|
$$inline: true
|
|
});
|
|
|
|
const block = {
|
|
c: function create() {
|
|
card = element("card");
|
|
img = element("img");
|
|
t0 = space();
|
|
info = element("info");
|
|
h4 = element("h4");
|
|
h4.textContent = "Guys";
|
|
t2 = space();
|
|
p = element("p");
|
|
p.textContent = "Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque";
|
|
t4 = space();
|
|
nav = element("nav");
|
|
create_component(icon0.$$.fragment);
|
|
t5 = text(" 233");
|
|
t6 = space();
|
|
reply = element("reply");
|
|
create_component(icon1.$$.fragment);
|
|
t7 = text(" View replies");
|
|
t8 = space();
|
|
if (img.src !== (img_src_value = "https://via.placeholder.com/64x64?text=Person")) attr_dev(img, "src", img_src_value);
|
|
attr_dev(img, "class", "svelte-9c6eed");
|
|
add_location(img, file$j, 226, 8, 4946);
|
|
attr_dev(h4, "class", "svelte-9c6eed");
|
|
add_location(h4, file$j, 228, 8, 5027);
|
|
attr_dev(p, "class", "svelte-9c6eed");
|
|
add_location(p, file$j, 229, 8, 5049);
|
|
attr_dev(nav, "id", "vote-nav");
|
|
attr_dev(nav, "class", "svelte-9c6eed");
|
|
add_location(nav, file$j, 230, 8, 5187);
|
|
attr_dev(reply, "class", "svelte-9c6eed");
|
|
add_location(reply, file$j, 233, 8, 5295);
|
|
attr_dev(info, "class", "svelte-9c6eed");
|
|
add_location(info, file$j, 227, 8, 5012);
|
|
attr_dev(card, "class", "svelte-9c6eed");
|
|
add_location(card, file$j, 225, 8, 4931);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, card, anchor);
|
|
append_dev(card, img);
|
|
append_dev(card, t0);
|
|
append_dev(card, info);
|
|
append_dev(info, h4);
|
|
append_dev(info, t2);
|
|
append_dev(info, p);
|
|
append_dev(info, t4);
|
|
append_dev(info, nav);
|
|
mount_component(icon0, nav, null);
|
|
append_dev(nav, t5);
|
|
append_dev(info, t6);
|
|
append_dev(info, reply);
|
|
mount_component(icon1, reply, null);
|
|
append_dev(reply, t7);
|
|
append_dev(card, t8);
|
|
current = true;
|
|
},
|
|
p: noop,
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(icon0.$$.fragment, local);
|
|
transition_in(icon1.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(icon0.$$.fragment, local);
|
|
transition_out(icon1.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(card);
|
|
destroy_component(icon0);
|
|
destroy_component(icon1);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_each_block$6.name,
|
|
type: "each",
|
|
source: "(225:6) {#each cards as card}",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function create_fragment$k(ctx) {
|
|
let content1;
|
|
let header;
|
|
let nav0;
|
|
let b;
|
|
let a0;
|
|
let icon0;
|
|
let t0;
|
|
let link_action;
|
|
let t1;
|
|
let input;
|
|
let t2;
|
|
let ul;
|
|
let li0;
|
|
let a1;
|
|
let button0;
|
|
let link_action_1;
|
|
let t4;
|
|
let li1;
|
|
let a2;
|
|
let t6;
|
|
let main;
|
|
let figure;
|
|
let img0;
|
|
let img0_src_value;
|
|
let t7;
|
|
let figcaption;
|
|
let a3;
|
|
let t9;
|
|
let a4;
|
|
let t11;
|
|
let p;
|
|
let t13;
|
|
let video_actions;
|
|
let likes;
|
|
let t15;
|
|
let video_buttons;
|
|
let icon1;
|
|
let t16;
|
|
let icon2;
|
|
let t17;
|
|
let icon3;
|
|
let t18;
|
|
let icon4;
|
|
let t19;
|
|
let icon5;
|
|
let t20;
|
|
let lower;
|
|
let promotion;
|
|
let nav1;
|
|
let card;
|
|
let img1;
|
|
let img1_src_value;
|
|
let t21;
|
|
let info;
|
|
let h4;
|
|
let t23;
|
|
let subs;
|
|
let t25;
|
|
let button1;
|
|
let t27;
|
|
let content0;
|
|
let t29;
|
|
let hr;
|
|
let t30;
|
|
let comments;
|
|
let nav2;
|
|
let span;
|
|
let t32;
|
|
let sort;
|
|
let icon6;
|
|
let t33;
|
|
let t34;
|
|
let current;
|
|
let mounted;
|
|
let dispose;
|
|
|
|
icon0 = new Icon({
|
|
props: {
|
|
name: "edit-3",
|
|
color: "var(--color-text)"
|
|
},
|
|
$$inline: true
|
|
});
|
|
|
|
icon1 = new Icon({
|
|
props: { name: "thumbs-up", color: "#999" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon2 = new Icon({
|
|
props: { name: "thumbs-down", color: "#999" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon3 = new Icon({
|
|
props: { name: "corner-up-right", color: "#999" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon4 = new Icon({
|
|
props: { name: "menu", color: "#999" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon5 = new Icon({
|
|
props: { name: "vertical-more" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon6 = new Icon({
|
|
props: {
|
|
name: "bar-chart",
|
|
color: "var(--sub-color)"
|
|
},
|
|
$$inline: true
|
|
});
|
|
|
|
let each_value = /*cards*/ ctx[0];
|
|
validate_each_argument(each_value);
|
|
let each_blocks = [];
|
|
|
|
for (let i = 0; i < each_value.length; i += 1) {
|
|
each_blocks[i] = create_each_block$6(get_each_context$6(ctx, each_value, i));
|
|
}
|
|
|
|
const block = {
|
|
c: function create() {
|
|
content1 = element("content");
|
|
header = element("header");
|
|
nav0 = element("nav");
|
|
b = element("b");
|
|
a0 = element("a");
|
|
create_component(icon0.$$.fragment);
|
|
t0 = text(" Xor.Academy");
|
|
t1 = space();
|
|
input = element("input");
|
|
t2 = space();
|
|
ul = element("ul");
|
|
li0 = element("li");
|
|
a1 = element("a");
|
|
button0 = element("button");
|
|
button0.textContent = "Log In";
|
|
t4 = space();
|
|
li1 = element("li");
|
|
a2 = element("a");
|
|
a2.textContent = "Sign Up";
|
|
t6 = space();
|
|
main = element("main");
|
|
figure = element("figure");
|
|
img0 = element("img");
|
|
t7 = space();
|
|
figcaption = element("figcaption");
|
|
a3 = element("a");
|
|
a3.textContent = "#tag";
|
|
t9 = space();
|
|
a4 = element("a");
|
|
a4.textContent = "#anothertag";
|
|
t11 = space();
|
|
p = element("p");
|
|
p.textContent = "Title And Stuff";
|
|
t13 = space();
|
|
video_actions = element("video-actions");
|
|
likes = element("likes");
|
|
likes.textContent = "Likes Other Stats";
|
|
t15 = space();
|
|
video_buttons = element("video-buttons");
|
|
create_component(icon1.$$.fragment);
|
|
t16 = text(" 1.1K\n ");
|
|
create_component(icon2.$$.fragment);
|
|
t17 = text(" 22\n ");
|
|
create_component(icon3.$$.fragment);
|
|
t18 = text(" SHARE\n ");
|
|
create_component(icon4.$$.fragment);
|
|
t19 = text(" SAVE\n ");
|
|
create_component(icon5.$$.fragment);
|
|
t20 = space();
|
|
lower = element("lower");
|
|
promotion = element("promotion");
|
|
nav1 = element("nav");
|
|
card = element("card");
|
|
img1 = element("img");
|
|
t21 = space();
|
|
info = element("info");
|
|
h4 = element("h4");
|
|
h4.textContent = "Zed A. Shaw";
|
|
t23 = space();
|
|
subs = element("subs");
|
|
subs.textContent = "1 subscriber";
|
|
t25 = space();
|
|
button1 = element("button");
|
|
button1.textContent = "SUBSCRIBE";
|
|
t27 = space();
|
|
content0 = element("content");
|
|
content0.textContent = "Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur";
|
|
t29 = space();
|
|
hr = element("hr");
|
|
t30 = space();
|
|
comments = element("comments");
|
|
nav2 = element("nav");
|
|
span = element("span");
|
|
span.textContent = "125 Comments";
|
|
t32 = space();
|
|
sort = element("sort");
|
|
create_component(icon6.$$.fragment);
|
|
t33 = text(" SORT BY");
|
|
t34 = space();
|
|
|
|
for (let i = 0; i < each_blocks.length; i += 1) {
|
|
each_blocks[i].c();
|
|
}
|
|
|
|
attr_dev(a0, "href", "/demos/xoracademy");
|
|
attr_dev(a0, "class", "svelte-9c6eed");
|
|
add_location(a0, file$j, 175, 9, 2596);
|
|
add_location(b, file$j, 175, 6, 2593);
|
|
attr_dev(input, "placeholder", "Search");
|
|
attr_dev(input, "class", "svelte-9c6eed");
|
|
add_location(input, file$j, 176, 6, 2708);
|
|
attr_dev(button0, "class", "svelte-9c6eed");
|
|
add_location(button0, file$j, 178, 44, 2792);
|
|
attr_dev(a1, "href", "/demos/login");
|
|
attr_dev(a1, "class", "svelte-9c6eed");
|
|
add_location(a1, file$j, 178, 12, 2760);
|
|
add_location(li0, file$j, 178, 8, 2756);
|
|
attr_dev(a2, "class", "svelte-9c6eed");
|
|
add_location(a2, file$j, 179, 12, 2837);
|
|
add_location(li1, file$j, 179, 8, 2833);
|
|
add_location(ul, file$j, 177, 6, 2743);
|
|
attr_dev(nav0, "class", "svelte-9c6eed");
|
|
add_location(nav0, file$j, 174, 4, 2581);
|
|
attr_dev(header, "class", "svelte-9c6eed");
|
|
add_location(header, file$j, 173, 2, 2568);
|
|
if (img0.src !== (img0_src_value = "https://via.placeholder.com/1280x720?text=Video")) attr_dev(img0, "src", img0_src_value);
|
|
add_location(img0, file$j, 185, 6, 2920);
|
|
attr_dev(a3, "class", "svelte-9c6eed");
|
|
add_location(a3, file$j, 187, 8, 3007);
|
|
attr_dev(a4, "class", "svelte-9c6eed");
|
|
add_location(a4, file$j, 187, 20, 3019);
|
|
attr_dev(p, "class", "svelte-9c6eed");
|
|
add_location(p, file$j, 188, 8, 3046);
|
|
add_location(likes, file$j, 190, 10, 3103);
|
|
add_location(video_buttons, file$j, 191, 10, 3146);
|
|
set_custom_element_data(video_actions, "class", "svelte-9c6eed");
|
|
add_location(video_actions, file$j, 189, 8, 3077);
|
|
attr_dev(figcaption, "class", "svelte-9c6eed");
|
|
add_location(figcaption, file$j, 186, 6, 2986);
|
|
add_location(figure, file$j, 184, 4, 2905);
|
|
if (img1.src !== (img1_src_value = "https://via.placeholder.com/64x64?text=ME")) attr_dev(img1, "src", img1_src_value);
|
|
attr_dev(img1, "class", "svelte-9c6eed");
|
|
add_location(img1, file$j, 205, 8, 3597);
|
|
attr_dev(h4, "class", "svelte-9c6eed");
|
|
add_location(h4, file$j, 207, 8, 3674);
|
|
add_location(subs, file$j, 208, 8, 3703);
|
|
attr_dev(info, "class", "svelte-9c6eed");
|
|
add_location(info, file$j, 206, 8, 3659);
|
|
attr_dev(card, "class", "svelte-9c6eed");
|
|
add_location(card, file$j, 204, 8, 3582);
|
|
attr_dev(button1, "id", "subscribe");
|
|
attr_dev(button1, "class", "svelte-9c6eed");
|
|
add_location(button1, file$j, 210, 8, 3753);
|
|
attr_dev(nav1, "class", "svelte-9c6eed");
|
|
add_location(nav1, file$j, 203, 6, 3568);
|
|
attr_dev(content0, "class", "svelte-9c6eed");
|
|
add_location(content0, file$j, 213, 6, 3815);
|
|
attr_dev(promotion, "class", "svelte-9c6eed");
|
|
add_location(promotion, file$j, 202, 6, 3550);
|
|
attr_dev(hr, "class", "svelte-9c6eed");
|
|
add_location(hr, file$j, 217, 6, 4740);
|
|
add_location(span, file$j, 221, 8, 4783);
|
|
attr_dev(sort, "class", "svelte-9c6eed");
|
|
add_location(sort, file$j, 221, 34, 4809);
|
|
attr_dev(nav2, "class", "svelte-9c6eed");
|
|
add_location(nav2, file$j, 220, 6, 4769);
|
|
attr_dev(comments, "class", "svelte-9c6eed");
|
|
add_location(comments, file$j, 219, 6, 4752);
|
|
attr_dev(lower, "class", "svelte-9c6eed");
|
|
add_location(lower, file$j, 201, 4, 3536);
|
|
attr_dev(main, "class", "svelte-9c6eed");
|
|
add_location(main, file$j, 183, 2, 2894);
|
|
attr_dev(content1, "class", "svelte-9c6eed");
|
|
add_location(content1, file$j, 172, 0, 2556);
|
|
},
|
|
l: function claim(nodes) {
|
|
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, content1, anchor);
|
|
append_dev(content1, header);
|
|
append_dev(header, nav0);
|
|
append_dev(nav0, b);
|
|
append_dev(b, a0);
|
|
mount_component(icon0, a0, null);
|
|
append_dev(a0, t0);
|
|
append_dev(nav0, t1);
|
|
append_dev(nav0, input);
|
|
append_dev(nav0, t2);
|
|
append_dev(nav0, ul);
|
|
append_dev(ul, li0);
|
|
append_dev(li0, a1);
|
|
append_dev(a1, button0);
|
|
append_dev(ul, t4);
|
|
append_dev(ul, li1);
|
|
append_dev(li1, a2);
|
|
append_dev(content1, t6);
|
|
append_dev(content1, main);
|
|
append_dev(main, figure);
|
|
append_dev(figure, img0);
|
|
append_dev(figure, t7);
|
|
append_dev(figure, figcaption);
|
|
append_dev(figcaption, a3);
|
|
append_dev(figcaption, t9);
|
|
append_dev(figcaption, a4);
|
|
append_dev(figcaption, t11);
|
|
append_dev(figcaption, p);
|
|
append_dev(figcaption, t13);
|
|
append_dev(figcaption, video_actions);
|
|
append_dev(video_actions, likes);
|
|
append_dev(video_actions, t15);
|
|
append_dev(video_actions, video_buttons);
|
|
mount_component(icon1, video_buttons, null);
|
|
append_dev(video_buttons, t16);
|
|
mount_component(icon2, video_buttons, null);
|
|
append_dev(video_buttons, t17);
|
|
mount_component(icon3, video_buttons, null);
|
|
append_dev(video_buttons, t18);
|
|
mount_component(icon4, video_buttons, null);
|
|
append_dev(video_buttons, t19);
|
|
mount_component(icon5, video_buttons, null);
|
|
append_dev(main, t20);
|
|
append_dev(main, lower);
|
|
append_dev(lower, promotion);
|
|
append_dev(promotion, nav1);
|
|
append_dev(nav1, card);
|
|
append_dev(card, img1);
|
|
append_dev(card, t21);
|
|
append_dev(card, info);
|
|
append_dev(info, h4);
|
|
append_dev(info, t23);
|
|
append_dev(info, subs);
|
|
append_dev(nav1, t25);
|
|
append_dev(nav1, button1);
|
|
append_dev(promotion, t27);
|
|
append_dev(promotion, content0);
|
|
append_dev(lower, t29);
|
|
append_dev(lower, hr);
|
|
append_dev(lower, t30);
|
|
append_dev(lower, comments);
|
|
append_dev(comments, nav2);
|
|
append_dev(nav2, span);
|
|
append_dev(nav2, t32);
|
|
append_dev(nav2, sort);
|
|
mount_component(icon6, sort, null);
|
|
append_dev(sort, t33);
|
|
append_dev(comments, t34);
|
|
|
|
for (let i = 0; i < each_blocks.length; i += 1) {
|
|
each_blocks[i].m(comments, null);
|
|
}
|
|
|
|
current = true;
|
|
|
|
if (!mounted) {
|
|
dispose = [
|
|
action_destroyer(link_action = link.call(null, a0)),
|
|
action_destroyer(link_action_1 = link.call(null, a1))
|
|
];
|
|
|
|
mounted = true;
|
|
}
|
|
},
|
|
p: noop,
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(icon0.$$.fragment, local);
|
|
transition_in(icon1.$$.fragment, local);
|
|
transition_in(icon2.$$.fragment, local);
|
|
transition_in(icon3.$$.fragment, local);
|
|
transition_in(icon4.$$.fragment, local);
|
|
transition_in(icon5.$$.fragment, local);
|
|
transition_in(icon6.$$.fragment, local);
|
|
|
|
for (let i = 0; i < each_value.length; i += 1) {
|
|
transition_in(each_blocks[i]);
|
|
}
|
|
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(icon0.$$.fragment, local);
|
|
transition_out(icon1.$$.fragment, local);
|
|
transition_out(icon2.$$.fragment, local);
|
|
transition_out(icon3.$$.fragment, local);
|
|
transition_out(icon4.$$.fragment, local);
|
|
transition_out(icon5.$$.fragment, local);
|
|
transition_out(icon6.$$.fragment, local);
|
|
each_blocks = each_blocks.filter(Boolean);
|
|
|
|
for (let i = 0; i < each_blocks.length; i += 1) {
|
|
transition_out(each_blocks[i]);
|
|
}
|
|
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(content1);
|
|
destroy_component(icon0);
|
|
destroy_component(icon1);
|
|
destroy_component(icon2);
|
|
destroy_component(icon3);
|
|
destroy_component(icon4);
|
|
destroy_component(icon5);
|
|
destroy_component(icon6);
|
|
destroy_each(each_blocks, detaching);
|
|
mounted = false;
|
|
run_all(dispose);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$k.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function instance$k($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("XorAcademyWatch", slots, []);
|
|
let cards = [1, 2, 3, 4];
|
|
const writable_props = [];
|
|
|
|
Object.keys($$props).forEach(key => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(`<XorAcademyWatch> was created with unknown prop '${key}'`);
|
|
});
|
|
|
|
$$self.$capture_state = () => ({ link, Icon, cards });
|
|
|
|
$$self.$inject_state = $$props => {
|
|
if ("cards" in $$props) $$invalidate(0, cards = $$props.cards);
|
|
};
|
|
|
|
if ($$props && "$$inject" in $$props) {
|
|
$$self.$inject_state($$props.$$inject);
|
|
}
|
|
|
|
return [cards];
|
|
}
|
|
|
|
class XorAcademyWatch extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$k, create_fragment$k, safe_not_equal, {});
|
|
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "XorAcademyWatch",
|
|
options,
|
|
id: create_fragment$k.name
|
|
});
|
|
}
|
|
}
|
|
|
|
/* src/demos/Login.svelte generated by Svelte v3.30.0 */
|
|
|
|
const file$k = "src/demos/Login.svelte";
|
|
|
|
function create_fragment$l(ctx) {
|
|
let content;
|
|
let spacer0;
|
|
let t0;
|
|
let form;
|
|
let header;
|
|
let t2;
|
|
let label0;
|
|
let t4;
|
|
let input0;
|
|
let t5;
|
|
let label1;
|
|
let t7;
|
|
let input1;
|
|
let t8;
|
|
let br;
|
|
let t9;
|
|
let button;
|
|
let t11;
|
|
let spacer1;
|
|
|
|
const block = {
|
|
c: function create() {
|
|
content = element("content");
|
|
spacer0 = element("spacer");
|
|
t0 = space();
|
|
form = element("form");
|
|
header = element("header");
|
|
header.textContent = "Login";
|
|
t2 = space();
|
|
label0 = element("label");
|
|
label0.textContent = "Username";
|
|
t4 = space();
|
|
input0 = element("input");
|
|
t5 = space();
|
|
label1 = element("label");
|
|
label1.textContent = "Password";
|
|
t7 = space();
|
|
input1 = element("input");
|
|
t8 = space();
|
|
br = element("br");
|
|
t9 = space();
|
|
button = element("button");
|
|
button.textContent = "Login";
|
|
t11 = space();
|
|
spacer1 = element("spacer");
|
|
add_location(spacer0, file$k, 10, 2, 135);
|
|
add_location(header, file$k, 12, 4, 166);
|
|
attr_dev(label0, "for", "username");
|
|
add_location(label0, file$k, 13, 4, 193);
|
|
attr_dev(input0, "type", "text");
|
|
attr_dev(input0, "id", "username");
|
|
attr_dev(input0, "name", "username");
|
|
attr_dev(input0, "size", "32");
|
|
attr_dev(input0, "placeholder", "Username");
|
|
add_location(input0, file$k, 14, 4, 236);
|
|
attr_dev(label1, "for", "password");
|
|
add_location(label1, file$k, 15, 4, 323);
|
|
attr_dev(input1, "type", "password");
|
|
attr_dev(input1, "id", "password");
|
|
attr_dev(input1, "name", "password");
|
|
attr_dev(input1, "size", "32");
|
|
attr_dev(input1, "placeholder", "Password");
|
|
add_location(input1, file$k, 16, 4, 366);
|
|
add_location(br, file$k, 17, 4, 457);
|
|
attr_dev(button, "type", "submit");
|
|
add_location(button, file$k, 18, 4, 466);
|
|
add_location(form, file$k, 11, 2, 155);
|
|
add_location(spacer1, file$k, 20, 2, 515);
|
|
attr_dev(content, "class", "svelte-t7gl8c");
|
|
add_location(content, file$k, 9, 0, 123);
|
|
},
|
|
l: function claim(nodes) {
|
|
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, content, anchor);
|
|
append_dev(content, spacer0);
|
|
append_dev(content, t0);
|
|
append_dev(content, form);
|
|
append_dev(form, header);
|
|
append_dev(form, t2);
|
|
append_dev(form, label0);
|
|
append_dev(form, t4);
|
|
append_dev(form, input0);
|
|
append_dev(form, t5);
|
|
append_dev(form, label1);
|
|
append_dev(form, t7);
|
|
append_dev(form, input1);
|
|
append_dev(form, t8);
|
|
append_dev(form, br);
|
|
append_dev(form, t9);
|
|
append_dev(form, button);
|
|
append_dev(content, t11);
|
|
append_dev(content, spacer1);
|
|
},
|
|
p: noop,
|
|
i: noop,
|
|
o: noop,
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(content);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$l.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function instance$l($$self, $$props) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Login", slots, []);
|
|
const writable_props = [];
|
|
|
|
Object.keys($$props).forEach(key => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(`<Login> was created with unknown prop '${key}'`);
|
|
});
|
|
|
|
return [];
|
|
}
|
|
|
|
class Login$1 extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$l, create_fragment$l, safe_not_equal, {});
|
|
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Login",
|
|
options,
|
|
id: create_fragment$l.name
|
|
});
|
|
}
|
|
}
|
|
|
|
var routes = {
|
|
"/": Home,
|
|
"/about": About,
|
|
"/demos": Demos,
|
|
"/demos/login": Login$1,
|
|
"/demos/google": Google$1,
|
|
"/demos/twitter": Twitter$1,
|
|
"/demos/youtube": Youtube$1,
|
|
"/demos/instagram": Instagram$1,
|
|
"/demos/pinterest": Pinterest$1,
|
|
"/demos/xoracademy": XorAcademy,
|
|
"/demos/xoracademy/watch": XorAcademyWatch,
|
|
"*": NotFound,
|
|
};
|
|
|
|
/* src/components/Darkmode.svelte generated by Svelte v3.30.0 */
|
|
const file$l = "src/components/Darkmode.svelte";
|
|
|
|
// (26:0) {:else}
|
|
function create_else_block$1(ctx) {
|
|
let span;
|
|
let icon;
|
|
let current;
|
|
let mounted;
|
|
let dispose;
|
|
|
|
icon = new Icon({
|
|
props: { name: "sunset", size: "32" },
|
|
$$inline: true
|
|
});
|
|
|
|
const block = {
|
|
c: function create() {
|
|
span = element("span");
|
|
create_component(icon.$$.fragment);
|
|
add_location(span, file$l, 26, 2, 578);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, span, anchor);
|
|
mount_component(icon, span, null);
|
|
current = true;
|
|
|
|
if (!mounted) {
|
|
dispose = listen_dev(span, "click", /*click_handler_1*/ ctx[3], false, false, false);
|
|
mounted = true;
|
|
}
|
|
},
|
|
p: noop,
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(icon.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(icon.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(span);
|
|
destroy_component(icon);
|
|
mounted = false;
|
|
dispose();
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_else_block$1.name,
|
|
type: "else",
|
|
source: "(26:0) {:else}",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
// (22:0) {#if theme == 'dark'}
|
|
function create_if_block$4(ctx) {
|
|
let span;
|
|
let icon;
|
|
let current;
|
|
let mounted;
|
|
let dispose;
|
|
|
|
icon = new Icon({
|
|
props: { name: "sunrise", size: "32" },
|
|
$$inline: true
|
|
});
|
|
|
|
const block = {
|
|
c: function create() {
|
|
span = element("span");
|
|
create_component(icon.$$.fragment);
|
|
add_location(span, file$l, 22, 2, 485);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, span, anchor);
|
|
mount_component(icon, span, null);
|
|
current = true;
|
|
|
|
if (!mounted) {
|
|
dispose = listen_dev(span, "click", /*click_handler*/ ctx[2], false, false, false);
|
|
mounted = true;
|
|
}
|
|
},
|
|
p: noop,
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(icon.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(icon.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(span);
|
|
destroy_component(icon);
|
|
mounted = false;
|
|
dispose();
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_if_block$4.name,
|
|
type: "if",
|
|
source: "(22:0) {#if theme == 'dark'}",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function create_fragment$m(ctx) {
|
|
let current_block_type_index;
|
|
let if_block;
|
|
let if_block_anchor;
|
|
let current;
|
|
const if_block_creators = [create_if_block$4, create_else_block$1];
|
|
const if_blocks = [];
|
|
|
|
function select_block_type(ctx, dirty) {
|
|
if (/*theme*/ ctx[0] == "dark") return 0;
|
|
return 1;
|
|
}
|
|
|
|
current_block_type_index = select_block_type(ctx);
|
|
if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx);
|
|
|
|
const block = {
|
|
c: function create() {
|
|
if_block.c();
|
|
if_block_anchor = empty();
|
|
},
|
|
l: function claim(nodes) {
|
|
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
|
|
},
|
|
m: function mount(target, anchor) {
|
|
if_blocks[current_block_type_index].m(target, anchor);
|
|
insert_dev(target, if_block_anchor, anchor);
|
|
current = true;
|
|
},
|
|
p: function update(ctx, [dirty]) {
|
|
let previous_block_index = current_block_type_index;
|
|
current_block_type_index = select_block_type(ctx);
|
|
|
|
if (current_block_type_index === previous_block_index) {
|
|
if_blocks[current_block_type_index].p(ctx, dirty);
|
|
} else {
|
|
group_outros();
|
|
|
|
transition_out(if_blocks[previous_block_index], 1, 1, () => {
|
|
if_blocks[previous_block_index] = null;
|
|
});
|
|
|
|
check_outros();
|
|
if_block = if_blocks[current_block_type_index];
|
|
|
|
if (!if_block) {
|
|
if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx);
|
|
if_block.c();
|
|
} else {
|
|
if_block.p(ctx, dirty);
|
|
}
|
|
|
|
transition_in(if_block, 1);
|
|
if_block.m(if_block_anchor.parentNode, if_block_anchor);
|
|
}
|
|
},
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(if_block);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(if_block);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if_blocks[current_block_type_index].d(detaching);
|
|
if (detaching) detach_dev(if_block_anchor);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$m.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function instance$m($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Darkmode", slots, []);
|
|
|
|
let { theme = localStorage.getItem("theme")
|
|
? localStorage.getItem("theme")
|
|
: "light" } = $$props;
|
|
|
|
const set_theme = () => {
|
|
document.documentElement.setAttribute("data-theme", theme);
|
|
localStorage.setItem("theme", theme);
|
|
};
|
|
|
|
const toggle = () => {
|
|
$$invalidate(0, theme = theme == "light" ? "dark" : "light");
|
|
set_theme();
|
|
};
|
|
|
|
onMount(() => {
|
|
set_theme();
|
|
});
|
|
|
|
const writable_props = ["theme"];
|
|
|
|
Object.keys($$props).forEach(key => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(`<Darkmode> was created with unknown prop '${key}'`);
|
|
});
|
|
|
|
const click_handler = () => toggle();
|
|
const click_handler_1 = () => toggle();
|
|
|
|
$$self.$$set = $$props => {
|
|
if ("theme" in $$props) $$invalidate(0, theme = $$props.theme);
|
|
};
|
|
|
|
$$self.$capture_state = () => ({ Icon, onMount, theme, set_theme, toggle });
|
|
|
|
$$self.$inject_state = $$props => {
|
|
if ("theme" in $$props) $$invalidate(0, theme = $$props.theme);
|
|
};
|
|
|
|
if ($$props && "$$inject" in $$props) {
|
|
$$self.$inject_state($$props.$$inject);
|
|
}
|
|
|
|
return [theme, toggle, click_handler, click_handler_1];
|
|
}
|
|
|
|
class Darkmode extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$m, create_fragment$m, safe_not_equal, { theme: 0 });
|
|
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Darkmode",
|
|
options,
|
|
id: create_fragment$m.name
|
|
});
|
|
}
|
|
|
|
get theme() {
|
|
throw new Error("<Darkmode>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
|
|
set theme(value) {
|
|
throw new Error("<Darkmode>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
}
|
|
|
|
/* src/App.svelte generated by Svelte v3.30.0 */
|
|
const file$m = "src/App.svelte";
|
|
|
|
function create_fragment$n(ctx) {
|
|
let t0;
|
|
let header;
|
|
let nav0;
|
|
let a0;
|
|
let icon0;
|
|
let link_action;
|
|
let t1;
|
|
let ul0;
|
|
let li0;
|
|
let a1;
|
|
let link_action_1;
|
|
let t3;
|
|
let li1;
|
|
let a2;
|
|
let link_action_2;
|
|
let t5;
|
|
let main;
|
|
let router;
|
|
let t6;
|
|
let hr;
|
|
let t7;
|
|
let footer;
|
|
let nav1;
|
|
let a3;
|
|
let p;
|
|
let link_action_3;
|
|
let t9;
|
|
let ul1;
|
|
let li2;
|
|
let icon1;
|
|
let t10;
|
|
let li3;
|
|
let icon2;
|
|
let t11;
|
|
let li4;
|
|
let darkmode;
|
|
let current;
|
|
let mounted;
|
|
let dispose;
|
|
|
|
icon0 = new Icon({
|
|
props: { name: "trash-2", size: "64" },
|
|
$$inline: true
|
|
});
|
|
|
|
router = new Router({
|
|
props: { routes, restoreScrollState: true },
|
|
$$inline: true
|
|
});
|
|
|
|
icon1 = new Icon({
|
|
props: { name: "twitter", size: "32" },
|
|
$$inline: true
|
|
});
|
|
|
|
icon2 = new Icon({
|
|
props: { name: "instagram", size: "32" },
|
|
$$inline: true
|
|
});
|
|
|
|
darkmode = new Darkmode({ $$inline: true });
|
|
|
|
const block = {
|
|
c: function create() {
|
|
t0 = space();
|
|
header = element("header");
|
|
nav0 = element("nav");
|
|
a0 = element("a");
|
|
create_component(icon0.$$.fragment);
|
|
t1 = space();
|
|
ul0 = element("ul");
|
|
li0 = element("li");
|
|
a1 = element("a");
|
|
a1.textContent = "Demos";
|
|
t3 = space();
|
|
li1 = element("li");
|
|
a2 = element("a");
|
|
a2.textContent = "About";
|
|
t5 = space();
|
|
main = element("main");
|
|
create_component(router.$$.fragment);
|
|
t6 = space();
|
|
hr = element("hr");
|
|
t7 = space();
|
|
footer = element("footer");
|
|
nav1 = element("nav");
|
|
a3 = element("a");
|
|
p = element("p");
|
|
p.textContent = "Copyright (C) Big Corp.";
|
|
t9 = space();
|
|
ul1 = element("ul");
|
|
li2 = element("li");
|
|
create_component(icon1.$$.fragment);
|
|
t10 = space();
|
|
li3 = element("li");
|
|
create_component(icon2.$$.fragment);
|
|
t11 = space();
|
|
li4 = element("li");
|
|
create_component(darkmode.$$.fragment);
|
|
document.title = "LJSTHW Starter Template";
|
|
attr_dev(a0, "href", "/");
|
|
add_location(a0, file$m, 32, 4, 494);
|
|
attr_dev(a1, "href", "/demos");
|
|
add_location(a1, file$m, 36, 10, 584);
|
|
add_location(li0, file$m, 36, 6, 580);
|
|
attr_dev(a2, "href", "/about");
|
|
add_location(a2, file$m, 37, 10, 635);
|
|
add_location(li1, file$m, 37, 6, 631);
|
|
add_location(ul0, file$m, 35, 4, 569);
|
|
add_location(nav0, file$m, 31, 2, 484);
|
|
attr_dev(header, "class", "svelte-khlxmc");
|
|
add_location(header, file$m, 30, 0, 473);
|
|
attr_dev(main, "class", "svelte-khlxmc");
|
|
add_location(main, file$m, 42, 0, 706);
|
|
add_location(hr, file$m, 46, 0, 773);
|
|
add_location(p, file$m, 50, 6, 827);
|
|
attr_dev(a3, "href", "/");
|
|
add_location(a3, file$m, 49, 4, 799);
|
|
add_location(li2, file$m, 53, 6, 882);
|
|
add_location(li3, file$m, 54, 6, 931);
|
|
add_location(li4, file$m, 55, 6, 982);
|
|
add_location(ul1, file$m, 52, 4, 871);
|
|
attr_dev(nav1, "class", "svelte-khlxmc");
|
|
add_location(nav1, file$m, 48, 2, 789);
|
|
attr_dev(footer, "class", "svelte-khlxmc");
|
|
add_location(footer, file$m, 47, 0, 778);
|
|
},
|
|
l: function claim(nodes) {
|
|
throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_dev(target, t0, anchor);
|
|
insert_dev(target, header, anchor);
|
|
append_dev(header, nav0);
|
|
append_dev(nav0, a0);
|
|
mount_component(icon0, a0, null);
|
|
append_dev(nav0, t1);
|
|
append_dev(nav0, ul0);
|
|
append_dev(ul0, li0);
|
|
append_dev(li0, a1);
|
|
append_dev(ul0, t3);
|
|
append_dev(ul0, li1);
|
|
append_dev(li1, a2);
|
|
insert_dev(target, t5, anchor);
|
|
insert_dev(target, main, anchor);
|
|
mount_component(router, main, null);
|
|
insert_dev(target, t6, anchor);
|
|
insert_dev(target, hr, anchor);
|
|
insert_dev(target, t7, anchor);
|
|
insert_dev(target, footer, anchor);
|
|
append_dev(footer, nav1);
|
|
append_dev(nav1, a3);
|
|
append_dev(a3, p);
|
|
append_dev(nav1, t9);
|
|
append_dev(nav1, ul1);
|
|
append_dev(ul1, li2);
|
|
mount_component(icon1, li2, null);
|
|
append_dev(ul1, t10);
|
|
append_dev(ul1, li3);
|
|
mount_component(icon2, li3, null);
|
|
append_dev(ul1, t11);
|
|
append_dev(ul1, li4);
|
|
mount_component(darkmode, li4, null);
|
|
current = true;
|
|
|
|
if (!mounted) {
|
|
dispose = [
|
|
action_destroyer(link_action = link.call(null, a0)),
|
|
action_destroyer(link_action_1 = link.call(null, a1)),
|
|
action_destroyer(link_action_2 = link.call(null, a2)),
|
|
action_destroyer(link_action_3 = link.call(null, a3))
|
|
];
|
|
|
|
mounted = true;
|
|
}
|
|
},
|
|
p: noop,
|
|
i: function intro(local) {
|
|
if (current) return;
|
|
transition_in(icon0.$$.fragment, local);
|
|
transition_in(router.$$.fragment, local);
|
|
transition_in(icon1.$$.fragment, local);
|
|
transition_in(icon2.$$.fragment, local);
|
|
transition_in(darkmode.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(icon0.$$.fragment, local);
|
|
transition_out(router.$$.fragment, local);
|
|
transition_out(icon1.$$.fragment, local);
|
|
transition_out(icon2.$$.fragment, local);
|
|
transition_out(darkmode.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) detach_dev(t0);
|
|
if (detaching) detach_dev(header);
|
|
destroy_component(icon0);
|
|
if (detaching) detach_dev(t5);
|
|
if (detaching) detach_dev(main);
|
|
destroy_component(router);
|
|
if (detaching) detach_dev(t6);
|
|
if (detaching) detach_dev(hr);
|
|
if (detaching) detach_dev(t7);
|
|
if (detaching) detach_dev(footer);
|
|
destroy_component(icon1);
|
|
destroy_component(icon2);
|
|
destroy_component(darkmode);
|
|
mounted = false;
|
|
run_all(dispose);
|
|
}
|
|
};
|
|
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$n.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
|
|
return block;
|
|
}
|
|
|
|
function instance$n($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("App", slots, []);
|
|
const writable_props = [];
|
|
|
|
Object.keys($$props).forEach(key => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(`<App> was created with unknown prop '${key}'`);
|
|
});
|
|
|
|
$$self.$capture_state = () => ({ Router, routes, link, Icon, Darkmode });
|
|
return [];
|
|
}
|
|
|
|
class App extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$n, create_fragment$n, safe_not_equal, {});
|
|
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "App",
|
|
options,
|
|
id: create_fragment$n.name
|
|
});
|
|
}
|
|
}
|
|
|
|
const app = new App({
|
|
target: document.body,
|
|
props: {
|
|
name: 'world'
|
|
}
|
|
});
|
|
|
|
return app;
|
|
|
|
}());
|
|
//# sourceMappingURL=bundle.js.map
|
|
|