( 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 ( ) { }
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 action _destroyer ( action _result ) {
return action _result && is _function ( action _result . destroy ) ? action _result . destroy : noop ;
}
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 ;
}
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 ) ;
}
}
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 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 set _data _dev ( text , data ) {
data = '' + data ;
if ( text . wholeText === data )
return ;
dispatch _dev ( 'SvelteDOMSetData' , { node : text , data } ) ;
text . data = data ;
}
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 a2 ;
let t23 ;
let t24 ;
let aside2 ;
let h32 ;
let t26 ;
let icon2 ;
let t27 ;
let p3 ;
let t29 ;
let rationale ;
let section1 ;
let h11 ;
let t31 ;
let p4 ;
let t32 ;
let b2 ;
let t34 ;
let t35 ;
let p5 ;
let t37 ;
let section2 ;
let aside3 ;
let pre0 ;
let t39 ;
let p6 ;
let t41 ;
let section3 ;
let aside4 ;
let pre1 ;
let t43 ;
let hr1 ;
let t44 ;
let section4 ;
let p7 ;
let t45 ;
let a3 ;
let t47 ;
let t48 ;
let a4 ;
let button ;
let link _action ;
let t50 ;
let hr2 ;
let t51 ;
let h12 ;
let t53 ;
let p8 ;
let t54 ;
let b3 ;
let t56 ;
let b4 ;
let t58 ;
let b5 ;
let t60 ;
let b6 ;
let t62 ;
let b7 ;
let t64 ;
let b8 ;
let t66 ;
let t67 ;
let p9 ;
let t68 ;
let b9 ;
let t70 ;
let b10 ;
let t72 ;
let b11 ;
let t74 ;
let b12 ;
let t76 ;
let b13 ;
let t78 ;
let t79 ;
let p10 ;
let t80 ;
let b14 ;
let t82 ;
let b15 ;
let t84 ;
let b16 ;
let t86 ;
let b17 ;
let t88 ;
let b18 ;
let t90 ;
let t91 ;
let h13 ;
let t93 ;
let p11 ;
let t94 ;
let b19 ;
let t96 ;
let b20 ;
let t98 ;
let t99 ;
let p12 ;
let t100 ;
let b21 ;
let t102 ;
let b22 ;
let t104 ;
let b23 ;
let t106 ;
let t107 ;
let h14 ;
let t109 ;
let p13 ;
let t110 ;
let b24 ;
let t112 ;
let b25 ;
let t114 ;
let t115 ;
let p14 ;
let t116 ;
let b26 ;
let t118 ;
let b27 ;
let t120 ;
let b28 ;
let t122 ;
let b29 ;
let t124 ;
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 + Grids" ;
t17 = space ( ) ;
create _component ( icon1 . $$ . fragment ) ;
t18 = space ( ) ;
p2 = element ( "p" ) ;
t19 = text ( "Using " ) ;
a1 = element ( "a" ) ;
a1 . textContent = "flexbox" ;
t21 = text ( " and " ) ;
a2 = element ( "a" ) ;
a2 . textContent = "CSS grids" ;
t23 = text ( " you can layout anything you want without tons of divs." ) ;
t24 = space ( ) ;
aside2 = element ( "aside" ) ;
h32 = element ( "h3" ) ;
h32 . textContent = "Modify with Variables" ;
t26 = space ( ) ;
create _component ( icon2 . $$ . fragment ) ;
t27 = 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." ;
t29 = space ( ) ;
rationale = element ( "rationale" ) ;
section1 = element ( "section" ) ;
h11 = element ( "h1" ) ;
h11 . textContent = "Cleaner CSS" ;
t31 = space ( ) ;
p4 = element ( "p" ) ;
t32 = 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" ;
t34 = text ( " heavy, class heavy, not-semantic-at-all layout\n systems cluttering the real information available through simple HTML\n tags." ) ;
t35 = space ( ) ;
p5 = element ( "p" ) ;
p5 . textContent = "In short, if you're writing this:" ;
t37 = 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>" ;
t39 = space ( ) ;
p6 = element ( "p" ) ;
p6 . textContent = "You could write this if you use flexbox, grids, and variables:" ;
t41 = space ( ) ;
section3 = element ( "section" ) ;
aside4 = element ( "aside" ) ;
pre1 = element ( "pre" ) ;
pre1 . textContent = "<card>\n ...\n</card>" ;
t43 = space ( ) ;
hr1 = element ( "hr" ) ;
t44 = space ( ) ;
section4 = element ( "section" ) ;
p7 = element ( "p" ) ;
t45 = 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 " ) ;
a3 = element ( "a" ) ;
a3 . textContent = "@lzsthw" ;
t47 = text ( " and I'll give it a shot." ) ;
t48 = space ( ) ;
a4 = element ( "a" ) ;
button = element ( "button" ) ;
button . textContent = "View The Demos" ;
t50 = space ( ) ;
hr2 = element ( "hr" ) ;
t51 = space ( ) ;
h12 = element ( "h1" ) ;
h12 . textContent = "What's wrong with classes?" ;
t53 = space ( ) ;
p8 = element ( "p" ) ;
t54 = 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" ;
t56 = text ( " can be used to modify and extend the design, and an " ) ;
b4 = element ( "b" ) ;
b4 . textContent = "id" ;
t58 = text ( " can make this even more specific. In today's use of " ) ;
b5 = element ( "b" ) ;
b5 . textContent = "div.class" ;
t60 = 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" ;
t62 = text ( " and specificity hacking to change how something looks, or add more " ) ;
b7 = element ( "b" ) ;
b7 . textContent = "div" ;
t64 = text ( " with more " ) ;
b8 = element ( "b" ) ;
b8 . textContent = "class" ;
t66 = text ( "." ) ;
t67 = space ( ) ;
p9 = element ( "p" ) ;
t68 = text ( "The other problem with " ) ;
b9 = element ( "b" ) ;
b9 . textContent = "div.class" ;
t70 = 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" ;
t72 = 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" ;
t74 = text ( " and " ) ;
b12 = element ( "b" ) ;
b12 . textContent = "id" ;
t76 = 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" ;
t78 = text ( " even further." ) ;
t79 = space ( ) ;
p10 = element ( "p" ) ;
t80 = text ( "Finally, using " ) ;
b14 = element ( "b" ) ;
b14 . textContent = "div.class" ;
t82 = 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" ;
t84 = 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" ;
t86 = 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" ;
t88 = text ( " and " ) ;
b18 = element ( "b" ) ;
b18 . textContent = "CSS grids" ;
t90 = 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." ) ;
t91 = space ( ) ;
h13 = element ( "h1" ) ;
h13 . textContent = "Should we ban div.class?" ;
t93 = space ( ) ;
p11 = element ( "p" ) ;
t94 = text ( "Hell no. The current problem of " ) ;
b19 = element ( "b" ) ;
b19 . textContent = "too much" ;
t96 = 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" ;
t98 = 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." ) ;
t99 = space ( ) ;
p12 = element ( "p" ) ;
t100 = text ( "All this website does is demonstrate that you don't need " ) ;
b21 = element ( "b" ) ;
b21 . textContent = "so much div.class" ;
t102 = 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" ;
t104 = text ( ". Treat " ) ;
b23 = element ( "b" ) ;
b23 . textContent = "div.class" ;
t106 = text ( " like salt. Right now you're pouring a whole box of it on your HTML when a little bit makes it taste better." ) ;
t107 = space ( ) ;
h14 = element ( "h1" ) ;
h14 . textContent = "How did it get like this?" ;
t109 = space ( ) ;
p13 = element ( "p" ) ;
t110 = text ( "Before flexbox and CSS grids there really was no choice but to use " ) ;
b24 = element ( "b" ) ;
b24 . textContent = "div.class" ;
t112 = 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" ;
t114 = text ( "." ) ;
t115 = space ( ) ;
p14 = element ( "p" ) ;
t116 = 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" ;
t118 = text ( " with 5 " ) ;
b27 = element ( "b" ) ;
b27 . textContent = "div" ;
t120 = text ( " tags just to overlay it on a background. You can write the " ) ;
b28 = element ( "b" ) ;
b28 . textContent = "img" ;
t122 = text ( ", maybe a " ) ;
b29 = element ( "b" ) ;
b29 . textContent = "figure" ;
t124 = 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 , 944 ) ;
attr _dev ( a2 , "href" , "https://css-tricks.com/snippets/css/complete-guide-grid/" ) ;
attr _dev ( a2 , "class" , "svelte-rf35ix" ) ;
add _location ( a2 , file$1 , 47 , 95 , 1026 ) ;
add _location ( p2 , file$1 , 47 , 4 , 935 ) ;
attr _dev ( aside1 , "class" , "svelte-rf35ix" ) ;
add _location ( aside1 , file$1 , 44 , 2 , 856 ) ;
add _location ( h32 , file$1 , 51 , 4 , 1192 ) ;
add _location ( p3 , file$1 , 53 , 4 , 1265 ) ;
add _location ( aside2 , file$1 , 50 , 2 , 1180 ) ;
add _location ( section0 , file$1 , 36 , 0 , 603 ) ;
add _location ( h11 , file$1 , 62 , 4 , 1467 ) ;
add _location ( section1 , file$1 , 61 , 2 , 1453 ) ;
add _location ( b2 , file$1 , 69 , 15 , 1823 ) ;
add _location ( p4 , file$1 , 65 , 2 , 1504 ) ;
add _location ( p5 , file$1 , 73 , 2 , 1972 ) ;
add _location ( pre0 , file$1 , 77 , 2 , 2038 ) ;
add _location ( aside3 , file$1 , 76 , 2 , 2028 ) ;
add _location ( section2 , file$1 , 75 , 2 , 2016 ) ;
add _location ( p6 , file$1 , 87 , 2 , 2160 ) ;
add _location ( pre1 , file$1 , 91 , 2 , 2255 ) ;
add _location ( aside4 , file$1 , 90 , 2 , 2245 ) ;
add _location ( section3 , file$1 , 89 , 2 , 2233 ) ;
add _location ( hr1 , file$1 , 99 , 2 , 2324 ) ;
attr _dev ( a3 , "href" , "https://twitter.com/lzsthw" ) ;
add _location ( a3 , file$1 , 102 , 109 , 2552 ) ;
add _location ( p7 , file$1 , 101 , 4 , 2345 ) ;
add _location ( button , file$1 , 104 , 30 , 2665 ) ;
attr _dev ( a4 , "href" , "/demos" ) ;
add _location ( a4 , file$1 , 104 , 4 , 2639 ) ;
add _location ( section4 , file$1 , 100 , 2 , 2331 ) ;
add _location ( hr2 , file$1 , 107 , 2 , 2717 ) ;
add _location ( h12 , file$1 , 108 , 2 , 2724 ) ;
add _location ( b3 , file$1 , 110 , 244 , 3005 ) ;
add _location ( b4 , file$1 , 110 , 309 , 3070 ) ;
add _location ( b5 , file$1 , 110 , 372 , 3133 ) ;
add _location ( b6 , file$1 , 110 , 504 , 3265 ) ;
add _location ( b7 , file$1 , 110 , 589 , 3350 ) ;
add _location ( b8 , file$1 , 110 , 610 , 3371 ) ;
add _location ( p8 , file$1 , 110 , 2 , 2763 ) ;
add _location ( b9 , file$1 , 112 , 28 , 3418 ) ;
add _location ( b10 , file$1 , 112 , 226 , 3616 ) ;
add _location ( b11 , file$1 , 112 , 483 , 3873 ) ;
add _location ( b12 , file$1 , 112 , 500 , 3890 ) ;
add _location ( b13 , file$1 , 112 , 652 , 4042 ) ;
add _location ( p9 , file$1 , 112 , 2 , 3392 ) ;
add _location ( b14 , file$1 , 114 , 20 , 4098 ) ;
add _location ( b15 , file$1 , 114 , 169 , 4247 ) ;
add _location ( b16 , file$1 , 114 , 313 , 4391 ) ;
add _location ( b17 , file$1 , 114 , 455 , 4533 ) ;
add _location ( b18 , file$1 , 114 , 474 , 4552 ) ;
add _location ( p10 , file$1 , 114 , 2 , 4080 ) ;
add _location ( h13 , file$1 , 116 , 2 , 4764 ) ;
add _location ( b19 , file$1 , 118 , 38 , 4837 ) ;
add _location ( b20 , file$1 , 118 , 243 , 5042 ) ;
add _location ( p11 , file$1 , 118 , 2 , 4801 ) ;
add _location ( b21 , file$1 , 120 , 62 , 5298 ) ;
add _location ( b22 , file$1 , 120 , 304 , 5540 ) ;
add _location ( b23 , file$1 , 120 , 329 , 5565 ) ;
add _location ( p12 , file$1 , 120 , 2 , 5238 ) ;
add _location ( h14 , file$1 , 122 , 2 , 5697 ) ;
add _location ( b24 , file$1 , 123 , 72 , 5804 ) ;
add _location ( b25 , file$1 , 123 , 261 , 5993 ) ;
add _location ( p13 , file$1 , 123 , 2 , 5734 ) ;
add _location ( b26 , file$1 , 125 , 248 , 6269 ) ;
add _location ( b27 , file$1 , 125 , 266 , 6287 ) ;
add _location ( b28 , file$1 , 125 , 336 , 6357 ) ;
add _location ( b29 , file$1 , 125 , 356 , 6377 ) ;
add _location ( p14 , file$1 , 125 , 2 , 6023 ) ;
attr _dev ( rationale , "class" , "svelte-rf35ix" ) ;
add _location ( rationale , file$1 , 60 , 0 , 1439 ) ;
} ,
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 ( p2 , a2 ) ;
append _dev ( p2 , t23 ) ;
append _dev ( section0 , t24 ) ;
append _dev ( section0 , aside2 ) ;
append _dev ( aside2 , h32 ) ;
append _dev ( aside2 , t26 ) ;
mount _component ( icon2 , aside2 , null ) ;
append _dev ( aside2 , t27 ) ;
append _dev ( aside2 , p3 ) ;
insert _dev ( target , t29 , anchor ) ;
insert _dev ( target , rationale , anchor ) ;
append _dev ( rationale , section1 ) ;
append _dev ( section1 , h11 ) ;
append _dev ( rationale , t31 ) ;
append _dev ( rationale , p4 ) ;
append _dev ( p4 , t32 ) ;
append _dev ( p4 , b2 ) ;
append _dev ( p4 , t34 ) ;
append _dev ( rationale , t35 ) ;
append _dev ( rationale , p5 ) ;
append _dev ( rationale , t37 ) ;
append _dev ( rationale , section2 ) ;
append _dev ( section2 , aside3 ) ;
append _dev ( aside3 , pre0 ) ;
append _dev ( rationale , t39 ) ;
append _dev ( rationale , p6 ) ;
append _dev ( rationale , t41 ) ;
append _dev ( rationale , section3 ) ;
append _dev ( section3 , aside4 ) ;
append _dev ( aside4 , pre1 ) ;
append _dev ( rationale , t43 ) ;
append _dev ( rationale , hr1 ) ;
append _dev ( rationale , t44 ) ;
append _dev ( rationale , section4 ) ;
append _dev ( section4 , p7 ) ;
append _dev ( p7 , t45 ) ;
append _dev ( p7 , a3 ) ;
append _dev ( p7 , t47 ) ;
append _dev ( section4 , t48 ) ;
append _dev ( section4 , a4 ) ;
append _dev ( a4 , button ) ;
append _dev ( rationale , t50 ) ;
append _dev ( rationale , hr2 ) ;
append _dev ( rationale , t51 ) ;
append _dev ( rationale , h12 ) ;
append _dev ( rationale , t53 ) ;
append _dev ( rationale , p8 ) ;
append _dev ( p8 , t54 ) ;
append _dev ( p8 , b3 ) ;
append _dev ( p8 , t56 ) ;
append _dev ( p8 , b4 ) ;
append _dev ( p8 , t58 ) ;
append _dev ( p8 , b5 ) ;
append _dev ( p8 , t60 ) ;
append _dev ( p8 , b6 ) ;
append _dev ( p8 , t62 ) ;
append _dev ( p8 , b7 ) ;
append _dev ( p8 , t64 ) ;
append _dev ( p8 , b8 ) ;
append _dev ( p8 , t66 ) ;
append _dev ( rationale , t67 ) ;
append _dev ( rationale , p9 ) ;
append _dev ( p9 , t68 ) ;
append _dev ( p9 , b9 ) ;
append _dev ( p9 , t70 ) ;
append _dev ( p9 , b10 ) ;
append _dev ( p9 , t72 ) ;
append _dev ( p9 , b11 ) ;
append _dev ( p9 , t74 ) ;
append _dev ( p9 , b12 ) ;
append _dev ( p9 , t76 ) ;
append _dev ( p9 , b13 ) ;
append _dev ( p9 , t78 ) ;
append _dev ( rationale , t79 ) ;
append _dev ( rationale , p10 ) ;
append _dev ( p10 , t80 ) ;
append _dev ( p10 , b14 ) ;
append _dev ( p10 , t82 ) ;
append _dev ( p10 , b15 ) ;
append _dev ( p10 , t84 ) ;
append _dev ( p10 , b16 ) ;
append _dev ( p10 , t86 ) ;
append _dev ( p10 , b17 ) ;
append _dev ( p10 , t88 ) ;
append _dev ( p10 , b18 ) ;
append _dev ( p10 , t90 ) ;
append _dev ( rationale , t91 ) ;
append _dev ( rationale , h13 ) ;
append _dev ( rationale , t93 ) ;
append _dev ( rationale , p11 ) ;
append _dev ( p11 , t94 ) ;
append _dev ( p11 , b19 ) ;
append _dev ( p11 , t96 ) ;
append _dev ( p11 , b20 ) ;
append _dev ( p11 , t98 ) ;
append _dev ( rationale , t99 ) ;
append _dev ( rationale , p12 ) ;
append _dev ( p12 , t100 ) ;
append _dev ( p12 , b21 ) ;
append _dev ( p12 , t102 ) ;
append _dev ( p12 , b22 ) ;
append _dev ( p12 , t104 ) ;
append _dev ( p12 , b23 ) ;
append _dev ( p12 , t106 ) ;
append _dev ( rationale , t107 ) ;
append _dev ( rationale , h14 ) ;
append _dev ( rationale , t109 ) ;
append _dev ( rationale , p13 ) ;
append _dev ( p13 , t110 ) ;
append _dev ( p13 , b24 ) ;
append _dev ( p13 , t112 ) ;
append _dev ( p13 , b25 ) ;
append _dev ( p13 , t114 ) ;
append _dev ( rationale , t115 ) ;
append _dev ( rationale , p14 ) ;
append _dev ( p14 , t116 ) ;
append _dev ( p14 , b26 ) ;
append _dev ( p14 , t118 ) ;
append _dev ( p14 , b27 ) ;
append _dev ( p14 , t120 ) ;
append _dev ( p14 , b28 ) ;
append _dev ( p14 , t122 ) ;
append _dev ( p14 , b29 ) ;
append _dev ( p14 , t124 ) ;
current = true ;
if ( ! mounted ) {
dispose = action _destroyer ( link _action = 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 ) ;
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 ( t29 ) ;
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 = "http://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 , 1450 ) ;
attr _dev ( button1 , "class" , "svelte-1xw0xeo" ) ;
add _location ( button1 , file$2 , 95 , 6 , 1490 ) ;
attr _dev ( button2 , "class" , "svelte-1xw0xeo" ) ;
add _location ( button2 , file$2 , 96 , 6 , 1527 ) ;
attr _dev ( buttons , "class" , "svelte-1xw0xeo" ) ;
add _location ( buttons , file$2 , 94 , 4 , 1474 ) ;
attr _dev ( search , "class" , "svelte-1xw0xeo" ) ;
add _location ( search , file$2 , 92 , 2 , 1439 ) ;
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 = "http://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 , 1693 ) ;
attr _dev ( a2 , "class" , "svelte-oxwxiv" ) ;
add _location ( a2 , file$4 , 94 , 22 , 1705 ) ;
attr _dev ( p , "class" , "svelte-oxwxiv" ) ;
add _location ( p , file$4 , 95 , 10 , 1734 ) ;
add _location ( likes , file$4 , 97 , 12 , 1795 ) ;
add _location ( video _buttons , file$4 , 98 , 12 , 1834 ) ;
set _custom _element _data ( video _actions , "class" , "svelte-oxwxiv" ) ;
add _location ( video _actions , file$4 , 96 , 10 , 1767 ) ;
attr _dev ( figcaption , "class" , "svelte-oxwxiv" ) ;
add _location ( figcaption , file$4 , 93 , 8 , 1670 ) ;
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 = "http://via.placeholder.com/82x82?text=Story" ) ) attr _dev ( img , "src" , img _src _value ) ;
add _location ( img , file$5 , 109 , 6 , 1888 ) ;
add _location ( figure , file$5 , 108 , 4 , 1873 ) ;
} ,
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 = "http://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 , 1450 ) ;
attr _dev ( button1 , "class" , "svelte-oov5yx" ) ;
add _location ( button1 , file$5 , 92 , 23 , 1465 ) ;
attr _dev ( p0 , "class" , "svelte-oov5yx" ) ;
add _location ( p0 , file$5 , 91 , 6 , 1438 ) ;
add _location ( b2 , file$5 , 96 , 8 , 1519 ) ;
add _location ( b3 , file$5 , 96 , 25 , 1536 ) ;
add _location ( b4 , file$5 , 96 , 48 , 1559 ) ;
attr _dev ( p1 , "class" , "svelte-oov5yx" ) ;
add _location ( p1 , file$5 , 95 , 6 , 1507 ) ;
add _location ( b5 , file$5 , 99 , 9 , 1603 ) ;
attr _dev ( p2 , "class" , "svelte-oov5yx" ) ;
add _location ( p2 , file$5 , 99 , 6 , 1600 ) ;
add _location ( br , file$5 , 100 , 102 , 1728 ) ;
attr _dev ( a1 , "href" , "www.twitch.tv/zedashaw" ) ;
attr _dev ( a1 , "class" , "svelte-oov5yx" ) ;
add _location ( a1 , file$5 , 101 , 8 , 1741 ) ;
attr _dev ( p3 , "class" , "svelte-oov5yx" ) ;
add _location ( p3 , file$5 , 100 , 6 , 1632 ) ;
attr _dev ( info , "class" , "svelte-oov5yx" ) ;
add _location ( info , file$5 , 90 , 4 , 1425 ) ;
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 , 1840 ) ;
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 = "http://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
} ) ;
}
}
function simpleSvgPlaceholder ( {
width = 300 ,
height = 150 ,
text = ` ${ width } × ${ height } ` ,
fontFamily = 'sans-serif' ,
fontWeight = 'bold' ,
fontSize = Math . floor ( Math . min ( width , height ) * 0.2 ) ,
dy = fontSize * 0.35 ,
bgColor = '#ddd' ,
textColor = 'rgba(0,0,0,0.5)' ,
dataUri = true ,
charset = 'UTF-8'
} = { } ) {
const str = ` <svg xmlns="http://www.w3.org/2000/svg" width=" ${ width } " height=" ${ height } " viewBox="0 0 ${ width } ${ height } ">
< rect fill = "${bgColor}" width = "${width}" height = "${height}" / >
< text fill = "${textColor}" font - family = "${fontFamily}" font - size = "${fontSize}" dy = "${dy}" font - weight = "${fontWeight}" x = "50%" y = "50%" text - anchor = "middle" > $ { text } < / t e x t >
< / s v g > ` ;
// Thanks to: filamentgroup/directory-encoder
const cleaned = str
. replace ( /[\t\n\r]/gim , '' ) // Strip newlines and tabs
. replace ( /\s\s+/g , ' ' ) // Condense multiple spaces
. replace ( /'/gim , '\\i' ) ; // Normalize quotes
if ( dataUri ) {
const encoded = encodeURIComponent ( cleaned )
. replace ( /\(/g , '%28' ) // Encode brackets
. replace ( /\)/g , '%29' ) ;
return ` data:image/svg+xml;charset= ${ charset } , ${ encoded } ` ;
}
return cleaned ;
}
var simpleSvgPlaceholder _1 = simpleSvgPlaceholder ;
const defaults = {
bgColor : '#ccc' ,
textColor : '#888' ,
} ;
const holder = ( x , y ) => simpleSvgPlaceholder _1 ( { ... defaults , width : x , height : y } ) ;
/* src/thumbs/Tiles.svelte generated by Svelte v3.30.0 */
const file$8 = "src/thumbs/Tiles.svelte" ;
function create _fragment$9 ( ctx ) {
let content ;
let tile ;
let left ;
let img ;
let img _src _value ;
let t0 ;
let middle ;
let h4 ;
let t2 ;
let p ;
let t4 ;
let right ;
let button0 ;
let icon0 ;
let t5 ;
let button1 ;
let icon1 ;
let current ;
icon0 = new Icon ( {
props : {
name : "check-circle" ,
color : "var(--color-bg)" ,
size : "24"
} ,
$$inline : true
} ) ;
icon1 = new Icon ( {
props : {
name : "x-circle" ,
color : "var(--color-bg)" ,
size : "24"
} ,
$$inline : true
} ) ;
const block = {
c : function create ( ) {
content = element ( "content" ) ;
tile = element ( "tile" ) ;
left = element ( "left" ) ;
img = element ( "img" ) ;
t0 = space ( ) ;
middle = element ( "middle" ) ;
h4 = element ( "h4" ) ;
h4 . textContent = "Tile Example" ;
t2 = space ( ) ;
p = element ( "p" ) ;
p . textContent = "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua." ;
t4 = space ( ) ;
right = element ( "right" ) ;
button0 = element ( "button" ) ;
create _component ( icon0 . $$ . fragment ) ;
t5 = space ( ) ;
button1 = element ( "button" ) ;
create _component ( icon1 . $$ . fragment ) ;
if ( img . src !== ( img _src _value = holder ( 48 , 48 ) ) ) attr _dev ( img , "src" , img _src _value ) ;
add _location ( img , file$8 , 46 , 6 , 779 ) ;
add _location ( left , file$8 , 45 , 4 , 766 ) ;
attr _dev ( h4 , "class" , "svelte-fwzpwr" ) ;
add _location ( h4 , file$8 , 50 , 6 , 841 ) ;
add _location ( p , file$8 , 53 , 6 , 885 ) ;
attr _dev ( middle , "class" , "svelte-fwzpwr" ) ;
add _location ( middle , file$8 , 49 , 4 , 826 ) ;
attr _dev ( button0 , "class" , "svelte-fwzpwr" ) ;
add _location ( button0 , file$8 , 57 , 4 , 1047 ) ;
attr _dev ( button1 , "class" , "svelte-fwzpwr" ) ;
add _location ( button1 , file$8 , 58 , 4 , 1131 ) ;
attr _dev ( right , "class" , "svelte-fwzpwr" ) ;
add _location ( right , file$8 , 56 , 4 , 1035 ) ;
attr _dev ( tile , "class" , "svelte-fwzpwr" ) ;
add _location ( tile , file$8 , 44 , 2 , 755 ) ;
attr _dev ( content , "class" , "svelte-fwzpwr" ) ;
add _location ( content , file$8 , 43 , 0 , 743 ) ;
} ,
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 , tile ) ;
append _dev ( tile , left ) ;
append _dev ( left , img ) ;
append _dev ( tile , t0 ) ;
append _dev ( tile , middle ) ;
append _dev ( middle , h4 ) ;
append _dev ( middle , t2 ) ;
append _dev ( middle , p ) ;
append _dev ( tile , t4 ) ;
append _dev ( tile , right ) ;
append _dev ( right , button0 ) ;
mount _component ( icon0 , button0 , null ) ;
append _dev ( right , t5 ) ;
append _dev ( right , button1 ) ;
mount _component ( icon1 , button1 , null ) ;
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 ( content ) ;
destroy _component ( icon0 ) ;
destroy _component ( icon1 ) ;
}
} ;
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 ( "Tiles" , slots , [ ] ) ;
const writable _props = [ ] ;
Object . keys ( $$props ) . forEach ( key => {
if ( ! ~ writable _props . indexOf ( key ) && key . slice ( 0 , 2 ) !== "$$" ) console . warn ( ` <Tiles> was created with unknown prop ' ${ key } ' ` ) ;
} ) ;
$$self . $capture _state = ( ) => ( { Icon , holder } ) ;
return [ ] ;
}
class Tiles extends SvelteComponentDev {
constructor ( options ) {
super ( options ) ;
init ( this , options , instance$9 , create _fragment$9 , safe _not _equal , { } ) ;
dispatch _dev ( "SvelteRegisterComponent" , {
component : this ,
tagName : "Tiles" ,
options ,
id : create _fragment$9 . name
} ) ;
}
}
/* src/demos/index.svelte generated by Svelte v3.30.0 */
const file$9 = "src/demos/index.svelte" ;
function create _fragment$a ( ctx ) {
let h10 ;
let t1 ;
let images0 ;
let figure0 ;
let google ;
let t2 ;
let figcaption0 ;
let t4 ;
let figure1 ;
let twitter ;
let t5 ;
let figcaption1 ;
let t7 ;
let figure2 ;
let youtube ;
let t8 ;
let figcaption2 ;
let t10 ;
let figure3 ;
let instagram ;
let t11 ;
let figcaption3 ;
let t13 ;
let figure4 ;
let pinterest ;
let t14 ;
let figcaption4 ;
let t16 ;
let hr ;
let t17 ;
let h11 ;
let t19 ;
let images1 ;
let figure5 ;
let login ;
let t20 ;
let figcaption5 ;
let t22 ;
let figure6 ;
let tiles ;
let t23 ;
let figcaption6 ;
let current ;
let mounted ;
let dispose ;
google = new Google ( { $$inline : true } ) ;
twitter = new Twitter ( { $$inline : true } ) ;
youtube = new Youtube ( { $$inline : true } ) ;
instagram = new Instagram ( { $$inline : true } ) ;
pinterest = new Pinterest ( { $$inline : true } ) ;
login = new Login ( { $$inline : true } ) ;
tiles = new Tiles ( { $$inline : true } ) ;
const block = {
c : function create ( ) {
h10 = element ( "h1" ) ;
h10 . textContent = "Full Websites" ;
t1 = space ( ) ;
images0 = 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 ( youtube . $$ . fragment ) ;
t8 = space ( ) ;
figcaption2 = element ( "figcaption" ) ;
figcaption2 . textContent = "Youtube" ;
t10 = space ( ) ;
figure3 = element ( "figure" ) ;
create _component ( instagram . $$ . fragment ) ;
t11 = space ( ) ;
figcaption3 = element ( "figcaption" ) ;
figcaption3 . textContent = "Instagram" ;
t13 = space ( ) ;
figure4 = element ( "figure" ) ;
create _component ( pinterest . $$ . fragment ) ;
t14 = space ( ) ;
figcaption4 = element ( "figcaption" ) ;
figcaption4 . textContent = "Pinterest" ;
t16 = space ( ) ;
hr = element ( "hr" ) ;
t17 = space ( ) ;
h11 = element ( "h1" ) ;
h11 . textContent = "Common UI Patterns" ;
t19 = space ( ) ;
images1 = element ( "images" ) ;
figure5 = element ( "figure" ) ;
create _component ( login . $$ . fragment ) ;
t20 = space ( ) ;
figcaption5 = element ( "figcaption" ) ;
figcaption5 . textContent = "Basic Login" ;
t22 = space ( ) ;
figure6 = element ( "figure" ) ;
create _component ( tiles . $$ . fragment ) ;
t23 = space ( ) ;
figcaption6 = element ( "figcaption" ) ;
figcaption6 . textContent = "Tiles" ;
add _location ( h10 , file$9 , 49 , 0 , 1110 ) ;
attr _dev ( figcaption0 , "class" , "svelte-1bny7ze" ) ;
add _location ( figcaption0 , file$9 , 55 , 2 , 1211 ) ;
attr _dev ( figure0 , "class" , "svelte-1bny7ze" ) ;
add _location ( figure0 , file$9 , 53 , 0 , 1144 ) ;
attr _dev ( figcaption1 , "class" , "svelte-1bny7ze" ) ;
add _location ( figcaption1 , file$9 , 60 , 2 , 1321 ) ;
attr _dev ( figure1 , "class" , "svelte-1bny7ze" ) ;
add _location ( figure1 , file$9 , 58 , 0 , 1254 ) ;
attr _dev ( figcaption2 , "class" , "svelte-1bny7ze" ) ;
add _location ( figcaption2 , file$9 , 65 , 2 , 1432 ) ;
attr _dev ( figure2 , "class" , "svelte-1bny7ze" ) ;
add _location ( figure2 , file$9 , 63 , 0 , 1365 ) ;
attr _dev ( figcaption3 , "class" , "svelte-1bny7ze" ) ;
add _location ( figcaption3 , file$9 , 70 , 2 , 1547 ) ;
attr _dev ( figure3 , "class" , "svelte-1bny7ze" ) ;
add _location ( figure3 , file$9 , 68 , 0 , 1476 ) ;
attr _dev ( figcaption4 , "class" , "svelte-1bny7ze" ) ;
add _location ( figcaption4 , file$9 , 75 , 2 , 1665 ) ;
attr _dev ( figure4 , "class" , "svelte-1bny7ze" ) ;
add _location ( figure4 , file$9 , 73 , 0 , 1594 ) ;
attr _dev ( images0 , "class" , "svelte-1bny7ze" ) ;
add _location ( images0 , file$9 , 51 , 0 , 1134 ) ;
add _location ( hr , file$9 , 79 , 0 , 1722 ) ;
add _location ( h11 , file$9 , 80 , 0 , 1727 ) ;
attr _dev ( figcaption5 , "class" , "svelte-1bny7ze" ) ;
add _location ( figcaption5 , file$9 , 85 , 2 , 1828 ) ;
attr _dev ( figure5 , "class" , "svelte-1bny7ze" ) ;
add _location ( figure5 , file$9 , 83 , 0 , 1765 ) ;
attr _dev ( figcaption6 , "class" , "svelte-1bny7ze" ) ;
add _location ( figcaption6 , file$9 , 91 , 2 , 1940 ) ;
attr _dev ( figure6 , "class" , "svelte-1bny7ze" ) ;
add _location ( figure6 , file$9 , 89 , 0 , 1877 ) ;
attr _dev ( images1 , "class" , "svelte-1bny7ze" ) ;
add _location ( images1 , file$9 , 82 , 0 , 1756 ) ;
} ,
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 , h10 , anchor ) ;
insert _dev ( target , t1 , anchor ) ;
insert _dev ( target , images0 , anchor ) ;
append _dev ( images0 , figure0 ) ;
mount _component ( google , figure0 , null ) ;
append _dev ( figure0 , t2 ) ;
append _dev ( figure0 , figcaption0 ) ;
append _dev ( images0 , t4 ) ;
append _dev ( images0 , figure1 ) ;
mount _component ( twitter , figure1 , null ) ;
append _dev ( figure1 , t5 ) ;
append _dev ( figure1 , figcaption1 ) ;
append _dev ( images0 , t7 ) ;
append _dev ( images0 , figure2 ) ;
mount _component ( youtube , figure2 , null ) ;
append _dev ( figure2 , t8 ) ;
append _dev ( figure2 , figcaption2 ) ;
append _dev ( images0 , t10 ) ;
append _dev ( images0 , figure3 ) ;
mount _component ( instagram , figure3 , null ) ;
append _dev ( figure3 , t11 ) ;
append _dev ( figure3 , figcaption3 ) ;
append _dev ( images0 , t13 ) ;
append _dev ( images0 , figure4 ) ;
mount _component ( pinterest , figure4 , null ) ;
append _dev ( figure4 , t14 ) ;
append _dev ( figure4 , figcaption4 ) ;
insert _dev ( target , t16 , anchor ) ;
insert _dev ( target , hr , anchor ) ;
insert _dev ( target , t17 , anchor ) ;
insert _dev ( target , h11 , anchor ) ;
insert _dev ( target , t19 , anchor ) ;
insert _dev ( target , images1 , anchor ) ;
append _dev ( images1 , figure5 ) ;
mount _component ( login , figure5 , null ) ;
append _dev ( figure5 , t20 ) ;
append _dev ( figure5 , figcaption5 ) ;
append _dev ( images1 , t22 ) ;
append _dev ( images1 , figure6 ) ;
mount _component ( tiles , figure6 , null ) ;
append _dev ( figure6 , t23 ) ;
append _dev ( figure6 , figcaption6 ) ;
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 ) ,
listen _dev ( figure6 , "click" , /*click_handler_6*/ ctx [ 6 ] , 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 ( youtube . $$ . fragment , local ) ;
transition _in ( instagram . $$ . fragment , local ) ;
transition _in ( pinterest . $$ . fragment , local ) ;
transition _in ( login . $$ . fragment , local ) ;
transition _in ( tiles . $$ . fragment , local ) ;
current = true ;
} ,
o : function outro ( local ) {
transition _out ( google . $$ . fragment , local ) ;
transition _out ( twitter . $$ . fragment , local ) ;
transition _out ( youtube . $$ . fragment , local ) ;
transition _out ( instagram . $$ . fragment , local ) ;
transition _out ( pinterest . $$ . fragment , local ) ;
transition _out ( login . $$ . fragment , local ) ;
transition _out ( tiles . $$ . fragment , local ) ;
current = false ;
} ,
d : function destroy ( detaching ) {
if ( detaching ) detach _dev ( h10 ) ;
if ( detaching ) detach _dev ( t1 ) ;
if ( detaching ) detach _dev ( images0 ) ;
destroy _component ( google ) ;
destroy _component ( twitter ) ;
destroy _component ( youtube ) ;
destroy _component ( instagram ) ;
destroy _component ( pinterest ) ;
if ( detaching ) detach _dev ( t16 ) ;
if ( detaching ) detach _dev ( hr ) ;
if ( detaching ) detach _dev ( t17 ) ;
if ( detaching ) detach _dev ( h11 ) ;
if ( detaching ) detach _dev ( t19 ) ;
if ( detaching ) detach _dev ( images1 ) ;
destroy _component ( login ) ;
destroy _component ( tiles ) ;
mounted = false ;
run _all ( dispose ) ;
}
} ;
dispatch _dev ( "SvelteRegisterBlock" , {
block ,
id : create _fragment$a . name ,
type : "component" ,
source : "" ,
ctx
} ) ;
return block ;
}
function instance$a ( $$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/youtube" ) ;
const click _handler _3 = ( ) => push ( "/demos/instagram" ) ;
const click _handler _4 = ( ) => push ( "/demos/pinterest" ) ;
const click _handler _5 = ( ) => push ( "/demos/login" ) ;
const click _handler _6 = ( ) => push ( "/demos/tiles" ) ;
$$self . $capture _state = ( ) => ( {
Google ,
Twitter ,
Youtube ,
Instagram ,
Pinterest ,
Login ,
Tiles ,
push ,
holder
} ) ;
return [
click _handler ,
click _handler _1 ,
click _handler _2 ,
click _handler _3 ,
click _handler _4 ,
click _handler _5 ,
click _handler _6
] ;
}
class Demos extends SvelteComponentDev {
constructor ( options ) {
super ( options ) ;
init ( this , options , instance$a , create _fragment$a , safe _not _equal , { } ) ;
dispatch _dev ( "SvelteRegisterComponent" , {
component : this ,
tagName : "Demos" ,
options ,
id : create _fragment$a . name
} ) ;
}
}
/* src/About.svelte generated by Svelte v3.30.0 */
const file$a = "src/About.svelte" ;
function create _fragment$b ( ctx ) {
let h1 ;
const block = {
c : function create ( ) {
h1 = element ( "h1" ) ;
h1 . textContent = "About Page" ;
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 ( "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$b , create _fragment$b , safe _not _equal , { } ) ;
dispatch _dev ( "SvelteRegisterComponent" , {
component : this ,
tagName : "About" ,
options ,
id : create _fragment$b . name
} ) ;
}
}
/* src/NotFound.svelte generated by Svelte v3.30.0 */
const file$b = "src/NotFound.svelte" ;
function create _fragment$c ( ctx ) {
let h1 ;
const block = {
c : function create ( ) {
h1 = element ( "h1" ) ;
h1 . textContent = "Not found" ;
add _location ( h1 , file$b , 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$c . name ,
type : "component" ,
source : "" ,
ctx
} ) ;
return block ;
}
function instance$c ( $$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$c , create _fragment$c , safe _not _equal , { } ) ;
dispatch _dev ( "SvelteRegisterComponent" , {
component : this ,
tagName : "NotFound" ,
options ,
id : create _fragment$c . name
} ) ;
}
}
var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : { } ;
function createCommonjsModule ( fn , basedir , module ) {
return module = {
path : basedir ,
exports : { } ,
require : function ( path , base ) {
return commonjsRequire ( path , ( base === undefined || base === null ) ? module . path : base ) ;
}
} , fn ( module , module . exports ) , module . exports ;
}
function commonjsRequire ( ) {
throw new Error ( 'Dynamic requires are not currently supported by @rollup/plugin-commonjs' ) ;
}
var prism = createCommonjsModule ( function ( module ) {
/ * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
Begin prism - core . js
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * /
/// <reference lib="WebWorker"/>
var _self = ( typeof window !== 'undefined' )
? window // if in browser
: (
( typeof WorkerGlobalScope !== 'undefined' && self instanceof WorkerGlobalScope )
? self // if in worker
: { } // if in node js
) ;
/ * *
* Prism : Lightweight , robust , elegant syntax highlighting
*
* @ license MIT < https : //opensource.org/licenses/MIT>
* @ author Lea Verou < https : //lea.verou.me>
* @ namespace
* @ public
* /
var Prism = ( function ( _self ) {
// Private helper vars
var lang = /\blang(?:uage)?-([\w-]+)\b/i ;
var uniqueId = 0 ;
var _ = {
/ * *
* By default , Prism will attempt to highlight all code elements ( by calling { @ link Prism . highlightAll } ) on the
* current page after the page finished loading . This might be a problem if e . g . you wanted to asynchronously load
* additional languages or plugins yourself .
*
* By setting this value to ` true ` , Prism will not automatically highlight all code elements on the page .
*
* You obviously have to change this value before the automatic highlighting started . To do this , you can add an
* empty Prism object into the global scope before loading the Prism script like this :
*
* ` ` ` js
* window . Prism = window . Prism || { } ;
* Prism . manual = true ;
* // add a new <script> to load Prism's script
* ` ` `
*
* @ default false
* @ type { boolean }
* @ memberof Prism
* @ public
* /
manual : _self . Prism && _self . Prism . manual ,
disableWorkerMessageHandler : _self . Prism && _self . Prism . disableWorkerMessageHandler ,
/ * *
* A namespace for utility methods .
*
* All function in this namespace that are not explicitly marked as _public _ are for _ _internal use only _ _ and may
* change or disappear at any time .
*
* @ namespace
* @ memberof Prism
* /
util : {
encode : function encode ( tokens ) {
if ( tokens instanceof Token ) {
return new Token ( tokens . type , encode ( tokens . content ) , tokens . alias ) ;
} else if ( Array . isArray ( tokens ) ) {
return tokens . map ( encode ) ;
} else {
return tokens . replace ( /&/g , '&' ) . replace ( /</g , '<' ) . replace ( /\u00a0/g , ' ' ) ;
}
} ,
/ * *
* Returns the name of the type of the given value .
*
* @ param { any } o
* @ returns { string }
* @ example
* type ( null ) === 'Null'
* type ( undefined ) === 'Undefined'
* type ( 123 ) === 'Number'
* type ( 'foo' ) === 'String'
* type ( true ) === 'Boolean'
* type ( [ 1 , 2 ] ) === 'Array'
* type ( { } ) === 'Object'
* type ( String ) === 'Function'
* type ( /abc+/ ) === 'RegExp'
* /
type : function ( o ) {
return Object . prototype . toString . call ( o ) . slice ( 8 , - 1 ) ;
} ,
/ * *
* Returns a unique number for the given object . Later calls will still return the same number .
*
* @ param { Object } obj
* @ returns { number }
* /
objId : function ( obj ) {
if ( ! obj [ '__id' ] ) {
Object . defineProperty ( obj , '__id' , { value : ++ uniqueId } ) ;
}
return obj [ '__id' ] ;
} ,
/ * *
* Creates a deep clone of the given object .
*
* The main intended use of this function is to clone language definitions .
*
* @ param { T } o
* @ param { Record < number , any > } [ visited ]
* @ returns { T }
* @ template T
* /
clone : function deepClone ( o , visited ) {
visited = visited || { } ;
var clone , id ;
switch ( _ . util . type ( o ) ) {
case 'Object' :
id = _ . util . objId ( o ) ;
if ( visited [ id ] ) {
return visited [ id ] ;
}
clone = /** @type {Record<string, any>} */ ( { } ) ;
visited [ id ] = clone ;
for ( var key in o ) {
if ( o . hasOwnProperty ( key ) ) {
clone [ key ] = deepClone ( o [ key ] , visited ) ;
}
}
return /** @type {any} */ ( clone ) ;
case 'Array' :
id = _ . util . objId ( o ) ;
if ( visited [ id ] ) {
return visited [ id ] ;
}
clone = [ ] ;
visited [ id ] = clone ;
( /** @type {Array} */ ( /** @type {any} */ ( o ) ) ) . forEach ( function ( v , i ) {
clone [ i ] = deepClone ( v , visited ) ;
} ) ;
return /** @type {any} */ ( clone ) ;
default :
return o ;
}
} ,
/ * *
* Returns the Prism language of the given element set by a ` language-xxxx ` or ` lang-xxxx ` class .
*
* If no language is set for the element or the element is ` null ` or ` undefined ` , ` none ` will be returned .
*
* @ param { Element } element
* @ returns { string }
* /
getLanguage : function ( element ) {
while ( element && ! lang . test ( element . className ) ) {
element = element . parentElement ;
}
if ( element ) {
return ( element . className . match ( lang ) || [ , 'none' ] ) [ 1 ] . toLowerCase ( ) ;
}
return 'none' ;
} ,
/ * *
* Returns the script element that is currently executing .
*
* This does _ _not _ _ work for line script element .
*
* @ returns { HTMLScriptElement | null }
* /
currentScript : function ( ) {
if ( typeof document === 'undefined' ) {
return null ;
}
if ( 'currentScript' in document && 1 < 2 /* hack to trip TS' flow analysis */ ) {
return /** @type {any} */ ( document . currentScript ) ;
}
// IE11 workaround
// we'll get the src of the current script by parsing IE11's error stack trace
// this will not work for inline scripts
try {
throw new Error ( ) ;
} catch ( err ) {
// Get file src url from stack. Specifically works with the format of stack traces in IE.
// A stack will look like this:
//
// Error
// at _.util.currentScript (http://localhost/components/prism-core.js:119:5)
// at Global code (http://localhost/components/prism-core.js:606:1)
var src = ( /at [^(\r\n]*\((.*):.+:.+\)$/i . exec ( err . stack ) || [ ] ) [ 1 ] ;
if ( src ) {
var scripts = document . getElementsByTagName ( 'script' ) ;
for ( var i in scripts ) {
if ( scripts [ i ] . src == src ) {
return scripts [ i ] ;
}
}
}
return null ;
}
} ,
/ * *
* Returns whether a given class is active for ` element ` .
*
* The class can be activated if ` element ` or one of its ancestors has the given class and it can be deactivated
* if ` element ` or one of its ancestors has the negated version of the given class . The _negated version _ of the
* given class is just the given class with a ` no- ` prefix .
*
* Whether the class is active is determined by the closest ancestor of ` element ` ( where ` element ` itself is
* closest ancestor ) that has the given class or the negated version of it . If neither ` element ` nor any of its
* ancestors have the given class or the negated version of it , then the default activation will be returned .
*
* In the paradoxical situation where the closest ancestor contains _ _both _ _ the given class and the negated
* version of it , the class is considered active .
*
* @ param { Element } element
* @ param { string } className
* @ param { boolean } [ defaultActivation = false ]
* @ returns { boolean }
* /
isActive : function ( element , className , defaultActivation ) {
var no = 'no-' + className ;
while ( element ) {
var classList = element . classList ;
if ( classList . contains ( className ) ) {
return true ;
}
if ( classList . contains ( no ) ) {
return false ;
}
element = element . parentElement ;
}
return ! ! defaultActivation ;
}
} ,
/ * *
* This namespace contains all currently loaded languages and the some helper functions to create and modify languages .
*
* @ namespace
* @ memberof Prism
* @ public
* /
languages : {
/ * *
* Creates a deep copy of the language with the given id and appends the given tokens .
*
* If a token in ` redef ` also appears in the copied language , then the existing token in the copied language
* will be overwritten at its original position .
*
* # # Best practices
*
* Since the position of overwriting tokens ( token in ` redef ` that overwrite tokens in the copied language )
* doesn ' t matter , they can technically be in any order . However , this can be confusing to others that trying to
* understand the language definition because , normally , the order of tokens matters in Prism grammars .
*
* Therefore , it is encouraged to order overwriting tokens according to the positions of the overwritten tokens .
* Furthermore , all non - overwriting tokens should be placed after the overwriting ones .
*
* @ param { string } id The id of the language to extend . This has to be a key in ` Prism.languages ` .
* @ param { Grammar } redef The new tokens to append .
* @ returns { Grammar } The new language created .
* @ public
* @ example
* Prism . languages [ 'css-with-colors' ] = Prism . languages . extend ( 'css' , {
* // Prism.languages.css already has a 'comment' token, so this token will overwrite CSS' 'comment' token
* // at its original position
* 'comment' : { ... } ,
* // CSS doesn't have a 'color' token, so this token will be appended
* 'color' : /\b(?:red|green|blue)\b/
* } ) ;
* /
extend : function ( id , redef ) {
var lang = _ . util . clone ( _ . languages [ id ] ) ;
for ( var key in redef ) {
lang [ key ] = redef [ key ] ;
}
return lang ;
} ,
/ * *
* Inserts tokens _before _ another token in a language definition or any other grammar .
*
* # # Usage
*
* This helper method makes it easy to modify existing languages . For example , the CSS language definition
* not only defines CSS highlighting for CSS documents , but also needs to define highlighting for CSS embedded
* in HTML through ` <style> ` elements . To do this , it needs to modify ` Prism.languages.markup ` and add the
* appropriate tokens . However , ` Prism.languages.markup ` is a regular JavaScript object literal , so if you do
* this :
*
* ` ` ` js
* Prism . languages . markup . style = {
* // token
* } ;
* ` ` `
*
* then the ` style ` token will be added ( and processed ) at the end . ` insertBefore ` allows you to insert tokens
* before existing tokens . For the CSS example above , you would use it like this :
*
* ` ` ` js
* Prism . languages . insertBefore ( 'markup' , 'cdata' , {
* 'style' : {
* // token
* }
* } ) ;
* ` ` `
*
* # # Special cases
*
* If the grammars of ` inside ` and ` insert ` have tokens with the same name , the tokens in ` inside ` ' s grammar
* will be ignored .
*
* This behavior can be used to insert tokens after ` before ` :
*
* ` ` ` js
* Prism . languages . insertBefore ( 'markup' , 'comment' , {
* 'comment' : Prism . languages . markup . comment ,
* // tokens after 'comment'
* } ) ;
* ` ` `
*
* # # Limitations
*
* The main problem ` insertBefore ` has to solve is iteration order . Since ES2015 , the iteration order for object
* properties is guaranteed to be the insertion order ( except for integer keys ) but some browsers behave
* differently when keys are deleted and re - inserted . So ` insertBefore ` can ' t be implemented by temporarily
* deleting properties which is necessary to insert at arbitrary positions .
*
* To solve this problem , ` insertBefore ` doesn ' t actually insert the given tokens into the target object .
* Instead , it will create a new object and replace all references to the target object with the new one . This
* can be done without temporarily deleting properties , so the iteration order is well - defined .
*
* However , only references that can be reached from ` Prism.languages ` or ` insert ` will be replaced . I . e . if
* you hold the target object in a variable , then the value of the variable will not change .
*
* ` ` ` js
* var oldMarkup = Prism . languages . markup ;
* var newMarkup = Prism . languages . insertBefore ( 'markup' , 'comment' , { ... } ) ;
*
* assert ( oldMarkup !== Prism . languages . markup ) ;
* assert ( newMarkup === Prism . languages . markup ) ;
* ` ` `
*
* @ param { string } inside The property of ` root ` ( e . g . a language id in ` Prism.languages ` ) that contains the
* object to be modified .
* @ param { string } before The key to insert before .
* @ param { Grammar } insert An object containing the key - value pairs to be inserted .
* @ param { Object < string , any > } [ root ] The object containing ` inside ` , i . e . the object that contains the
* object to be modified .
*
* Defaults to ` Prism.languages ` .
* @ returns { Grammar } The new grammar object .
* @ public
* /
insertBefore : function ( inside , before , insert , root ) {
root = root || /** @type {any} */ ( _ . languages ) ;
var grammar = root [ inside ] ;
/** @type {Grammar} */
var ret = { } ;
for ( var token in grammar ) {
if ( grammar . hasOwnProperty ( token ) ) {
if ( token == before ) {
for ( var newToken in insert ) {
if ( insert . hasOwnProperty ( newToken ) ) {
ret [ newToken ] = insert [ newToken ] ;
}
}
}
// Do not insert token which also occur in insert. See #1525
if ( ! insert . hasOwnProperty ( token ) ) {
ret [ token ] = grammar [ token ] ;
}
}
}
var old = root [ inside ] ;
root [ inside ] = ret ;
// Update references in other language definitions
_ . languages . DFS ( _ . languages , function ( key , value ) {
if ( value === old && key != inside ) {
this [ key ] = ret ;
}
} ) ;
return ret ;
} ,
// Traverse a language definition with Depth First Search
DFS : function DFS ( o , callback , type , visited ) {
visited = visited || { } ;
var objId = _ . util . objId ;
for ( var i in o ) {
if ( o . hasOwnProperty ( i ) ) {
callback . call ( o , i , o [ i ] , type || i ) ;
var property = o [ i ] ,
propertyType = _ . util . type ( property ) ;
if ( propertyType === 'Object' && ! visited [ objId ( property ) ] ) {
visited [ objId ( property ) ] = true ;
DFS ( property , callback , null , visited ) ;
}
else if ( propertyType === 'Array' && ! visited [ objId ( property ) ] ) {
visited [ objId ( property ) ] = true ;
DFS ( property , callback , i , visited ) ;
}
}
}
}
} ,
plugins : { } ,
/ * *
* This is the most high - level function in Prism ’ s API .
* It fetches all the elements that have a ` .language-xxxx ` class and then calls { @ link Prism . highlightElement } on
* each one of them .
*
* This is equivalent to ` Prism.highlightAllUnder(document, async, callback) ` .
*
* @ param { boolean } [ async = false ] Same as in { @ link Prism . highlightAllUnder } .
* @ param { HighlightCallback } [ callback ] Same as in { @ link Prism . highlightAllUnder } .
* @ memberof Prism
* @ public
* /
highlightAll : function ( async , callback ) {
_ . highlightAllUnder ( document , async , callback ) ;
} ,
/ * *
* Fetches all the descendants of ` container ` that have a ` .language-xxxx ` class and then calls
* { @ link Prism . highlightElement } on each one of them .
*
* The following hooks will be run :
* 1. ` before-highlightall `
* 2. ` before-all-elements-highlight `
* 3. All hooks of { @ link Prism . highlightElement } for each element .
*
* @ param { ParentNode } container The root element , whose descendants that have a ` .language-xxxx ` class will be highlighted .
* @ param { boolean } [ async = false ] Whether each element is to be highlighted asynchronously using Web Workers .
* @ param { HighlightCallback } [ callback ] An optional callback to be invoked on each element after its highlighting is done .
* @ memberof Prism
* @ public
* /
highlightAllUnder : function ( container , async , callback ) {
var env = {
callback : callback ,
container : container ,
selector : 'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'
} ;
_ . hooks . run ( 'before-highlightall' , env ) ;
env . elements = Array . prototype . slice . apply ( env . container . querySelectorAll ( env . selector ) ) ;
_ . hooks . run ( 'before-all-elements-highlight' , env ) ;
for ( var i = 0 , element ; element = env . elements [ i ++ ] ; ) {
_ . highlightElement ( element , async === true , env . callback ) ;
}
} ,
/ * *
* Highlights the code inside a single element .
*
* The following hooks will be run :
* 1. ` before-sanity-check `
* 2. ` before-highlight `
* 3. All hooks of { @ link Prism . highlight } . These hooks will be run by an asynchronous worker if ` async ` is ` true ` .
* 4. ` before-insert `
* 5. ` after-highlight `
* 6. ` complete `
*
* Some the above hooks will be skipped if the element doesn ' t contain any text or there is no grammar loaded for
* the element ' s language .
*
* @ param { Element } element The element containing the code .
* It must have a class of ` language-xxxx ` to be processed , where ` xxxx ` is a valid language identifier .
* @ param { boolean } [ async = false ] Whether the element is to be highlighted asynchronously using Web Workers
* to improve performance and avoid blocking the UI when highlighting very large chunks of code . This option is
* [ disabled by default ] ( https : //prismjs.com/faq.html#why-is-asynchronous-highlighting-disabled-by-default).
*
* Note : All language definitions required to highlight the code must be included in the main ` prism.js ` file for
* asynchronous highlighting to work . You can build your own bundle on the
* [ Download page ] ( https : //prismjs.com/download.html).
* @ param { HighlightCallback } [ callback ] An optional callback to be invoked after the highlighting is done .
* Mostly useful when ` async ` is ` true ` , since in that case , the highlighting is done asynchronously .
* @ memberof Prism
* @ public
* /
highlightElement : function ( element , async , callback ) {
// Find language
var language = _ . util . getLanguage ( element ) ;
var grammar = _ . languages [ language ] ;
// Set language on the element, if not present
element . className = element . className . replace ( lang , '' ) . replace ( /\s+/g , ' ' ) + ' language-' + language ;
// Set language on the parent, for styling
var parent = element . parentElement ;
if ( parent && parent . nodeName . toLowerCase ( ) === 'pre' ) {
parent . className = parent . className . replace ( lang , '' ) . replace ( /\s+/g , ' ' ) + ' language-' + language ;
}
var code = element . textContent ;
var env = {
element : element ,
language : language ,
grammar : grammar ,
code : code
} ;
function insertHighlightedCode ( highlightedCode ) {
env . highlightedCode = highlightedCode ;
_ . hooks . run ( 'before-insert' , env ) ;
env . element . innerHTML = env . highlightedCode ;
_ . hooks . run ( 'after-highlight' , env ) ;
_ . hooks . run ( 'complete' , env ) ;
callback && callback . call ( env . element ) ;
}
_ . hooks . run ( 'before-sanity-check' , env ) ;
if ( ! env . code ) {
_ . hooks . run ( 'complete' , env ) ;
callback && callback . call ( env . element ) ;
return ;
}
_ . hooks . run ( 'before-highlight' , env ) ;
if ( ! env . grammar ) {
insertHighlightedCode ( _ . util . encode ( env . code ) ) ;
return ;
}
if ( async && _self . Worker ) {
var worker = new Worker ( _ . filename ) ;
worker . onmessage = function ( evt ) {
insertHighlightedCode ( evt . data ) ;
} ;
worker . postMessage ( JSON . stringify ( {
language : env . language ,
code : env . code ,
immediateClose : true
} ) ) ;
}
else {
insertHighlightedCode ( _ . highlight ( env . code , env . grammar , env . language ) ) ;
}
} ,
/ * *
* Low - level function , only use if you know what you ’ re doing . It accepts a string of text as input
* and the language definitions to use , and returns a string with the HTML produced .
*
* The following hooks will be run :
* 1. ` before-tokenize `
* 2. ` after-tokenize `
* 3. ` wrap ` : On each { @ link Token } .
*
* @ param { string } text A string with the code to be highlighted .
* @ param { Grammar } grammar An object containing the tokens to use .
*
* Usually a language definition like ` Prism.languages.markup ` .
* @ param { string } language The name of the language definition passed to ` grammar ` .
* @ returns { string } The highlighted HTML .
* @ memberof Prism
* @ public
* @ example
* Prism . highlight ( 'var foo = true;' , Prism . languages . javascript , 'javascript' ) ;
* /
highlight : function ( text , grammar , language ) {
var env = {
code : text ,
grammar : grammar ,
language : language
} ;
_ . hooks . run ( 'before-tokenize' , env ) ;
env . tokens = _ . tokenize ( env . code , env . grammar ) ;
_ . hooks . run ( 'after-tokenize' , env ) ;
return Token . stringify ( _ . util . encode ( env . tokens ) , env . language ) ;
} ,
/ * *
* This is the heart of Prism , and the most low - level function you can use . It accepts a string of text as input
* and the language definitions to use , and returns an array with the tokenized code .
*
* When the language definition includes nested tokens , the function is called recursively on each of these tokens .
*
* This method could be useful in other contexts as well , as a very crude parser .
*
* @ param { string } text A string with the code to be highlighted .
* @ param { Grammar } grammar An object containing the tokens to use .
*
* Usually a language definition like ` Prism.languages.markup ` .
* @ returns { TokenStream } An array of strings and tokens , a token stream .
* @ memberof Prism
* @ public
* @ example
* let code = ` var foo = 0; ` ;
* let tokens = Prism . tokenize ( code , Prism . languages . javascript ) ;
* tokens . forEach ( token => {
* if ( token instanceof Prism . Token && token . type === 'number' ) {
* console . log ( ` Found numeric literal: ${ token . content } ` ) ;
* }
* } ) ;
* /
tokenize : function ( text , grammar ) {
var rest = grammar . rest ;
if ( rest ) {
for ( var token in rest ) {
grammar [ token ] = rest [ token ] ;
}
delete grammar . rest ;
}
var tokenList = new LinkedList ( ) ;
addAfter ( tokenList , tokenList . head , text ) ;
matchGrammar ( text , tokenList , grammar , tokenList . head , 0 ) ;
return toArray ( tokenList ) ;
} ,
/ * *
* @ namespace
* @ memberof Prism
* @ public
* /
hooks : {
all : { } ,
/ * *
* Adds the given callback to the list of callbacks for the given hook .
*
* The callback will be invoked when the hook it is registered for is run .
* Hooks are usually directly run by a highlight function but you can also run hooks yourself .
*
* One callback function can be registered to multiple hooks and the same hook multiple times .
*
* @ param { string } name The name of the hook .
* @ param { HookCallback } callback The callback function which is given environment variables .
* @ public
* /
add : function ( name , callback ) {
var hooks = _ . hooks . all ;
hooks [ name ] = hooks [ name ] || [ ] ;
hooks [ name ] . push ( callback ) ;
} ,
/ * *
* Runs a hook invoking all registered callbacks with the given environment variables .
*
* Callbacks will be invoked synchronously and in the order in which they were registered .
*
* @ param { string } name The name of the hook .
* @ param { Object < string , any > } env The environment variables of the hook passed to all callbacks registered .
* @ public
* /
run : function ( name , env ) {
var callbacks = _ . hooks . all [ name ] ;
if ( ! callbacks || ! callbacks . length ) {
return ;
}
for ( var i = 0 , callback ; callback = callbacks [ i ++ ] ; ) {
callback ( env ) ;
}
}
} ,
Token : Token
} ;
_self . Prism = _ ;
// Typescript note:
// The following can be used to import the Token type in JSDoc:
//
// @typedef {InstanceType<import("./prism-core")["Token"]>} Token
/ * *
* Creates a new token .
*
* @ param { string } type See { @ link Token # type type }
* @ param { string | TokenStream } content See { @ link Token # content content }
* @ param { string | string [ ] } [ alias ] The alias ( es ) of the token .
* @ param { string } [ matchedStr = "" ] A copy of the full string this token was created from .
* @ class
* @ global
* @ public
* /
function Token ( type , content , alias , matchedStr ) {
/ * *
* The type of the token .
*
* This is usually the key of a pattern in a { @ link Grammar } .
*
* @ type { string }
* @ see GrammarToken
* @ public
* /
this . type = type ;
/ * *
* The strings or tokens contained by this token .
*
* This will be a token stream if the pattern matched also defined an ` inside ` grammar .
*
* @ type { string | TokenStream }
* @ public
* /
this . content = content ;
/ * *
* The alias ( es ) of the token .
*
* @ type { string | string [ ] }
* @ see GrammarToken
* @ public
* /
this . alias = alias ;
// Copy of the full string this token was created from
this . length = ( matchedStr || '' ) . length | 0 ;
}
/ * *
* A token stream is an array of strings and { @ link Token Token } objects .
*
* Token streams have to fulfill a few properties that are assumed by most functions ( mostly internal ones ) that process
* them .
*
* 1. No adjacent strings .
* 2. No empty strings .
*
* The only exception here is the token stream that only contains the empty string and nothing else .
*
* @ typedef { Array < string | Token > } TokenStream
* @ global
* @ public
* /
/ * *
* Converts the given token or token stream to an HTML representation .
*
* The following hooks will be run :
* 1. ` wrap ` : On each { @ link Token } .
*
* @ param { string | Token | TokenStream } o The token or token stream to be converted .
* @ param { string } language The name of current language .
* @ returns { string } The HTML representation of the token or token stream .
* @ memberof Token
* @ static
* /
Token . stringify = function stringify ( o , language ) {
if ( typeof o == 'string' ) {
return o ;
}
if ( Array . isArray ( o ) ) {
var s = '' ;
o . forEach ( function ( e ) {
s += stringify ( e , language ) ;
} ) ;
return s ;
}
var env = {
type : o . type ,
content : stringify ( o . content , language ) ,
tag : 'span' ,
classes : [ 'token' , o . type ] ,
attributes : { } ,
language : language
} ;
var aliases = o . alias ;
if ( aliases ) {
if ( Array . isArray ( aliases ) ) {
Array . prototype . push . apply ( env . classes , aliases ) ;
} else {
env . classes . push ( aliases ) ;
}
}
_ . hooks . run ( 'wrap' , env ) ;
var attributes = '' ;
for ( var name in env . attributes ) {
attributes += ' ' + name + '="' + ( env . attributes [ name ] || '' ) . replace ( /"/g , '"' ) + '"' ;
}
return '<' + env . tag + ' class="' + env . classes . join ( ' ' ) + '"' + attributes + '>' + env . content + '</' + env . tag + '>' ;
} ;
/ * *
* @ param { string } text
* @ param { LinkedList < string | Token > } tokenList
* @ param { any } grammar
* @ param { LinkedListNode < string | Token > } startNode
* @ param { number } startPos
* @ param { RematchOptions } [ rematch ]
* @ returns { void }
* @ private
*
* @ typedef RematchOptions
* @ property { string } cause
* @ property { number } reach
* /
function matchGrammar ( text , tokenList , grammar , startNode , startPos , rematch ) {
for ( var token in grammar ) {
if ( ! grammar . hasOwnProperty ( token ) || ! grammar [ token ] ) {
continue ;
}
var patterns = grammar [ token ] ;
patterns = Array . isArray ( patterns ) ? patterns : [ patterns ] ;
for ( var j = 0 ; j < patterns . length ; ++ j ) {
if ( rematch && rematch . cause == token + ',' + j ) {
return ;
}
var patternObj = patterns [ j ] ,
inside = patternObj . inside ,
lookbehind = ! ! patternObj . lookbehind ,
greedy = ! ! patternObj . greedy ,
lookbehindLength = 0 ,
alias = patternObj . alias ;
if ( greedy && ! patternObj . pattern . global ) {
// Without the global flag, lastIndex won't work
var flags = patternObj . pattern . toString ( ) . match ( /[imsuy]*$/ ) [ 0 ] ;
patternObj . pattern = RegExp ( patternObj . pattern . source , flags + 'g' ) ;
}
/** @type {RegExp} */
var pattern = patternObj . pattern || patternObj ;
for ( // iterate the token list and keep track of the current token/string position
var currentNode = startNode . next , pos = startPos ;
currentNode !== tokenList . tail ;
pos += currentNode . value . length , currentNode = currentNode . next
) {
if ( rematch && pos >= rematch . reach ) {
break ;
}
var str = currentNode . value ;
if ( tokenList . length > text . length ) {
// Something went terribly wrong, ABORT, ABORT!
return ;
}
if ( str instanceof Token ) {
continue ;
}
var removeCount = 1 ; // this is the to parameter of removeBetween
if ( greedy && currentNode != tokenList . tail . prev ) {
pattern . lastIndex = pos ;
var match = pattern . exec ( text ) ;
if ( ! match ) {
break ;
}
var from = match . index + ( lookbehind && match [ 1 ] ? match [ 1 ] . length : 0 ) ;
var to = match . index + match [ 0 ] . length ;
var p = pos ;
// find the node that contains the match
p += currentNode . value . length ;
while ( from >= p ) {
currentNode = currentNode . next ;
p += currentNode . value . length ;
}
// adjust pos (and p)
p -= currentNode . value . length ;
pos = p ;
// the current node is a Token, then the match starts inside another Token, which is invalid
if ( currentNode . value instanceof Token ) {
continue ;
}
// find the last node which is affected by this match
for (
var k = currentNode ;
k !== tokenList . tail && ( p < to || typeof k . value === 'string' ) ;
k = k . next
) {
removeCount ++ ;
p += k . value . length ;
}
removeCount -- ;
// replace with the new match
str = text . slice ( pos , p ) ;
match . index -= pos ;
} else {
pattern . lastIndex = 0 ;
var match = pattern . exec ( str ) ;
}
if ( ! match ) {
continue ;
}
if ( lookbehind ) {
lookbehindLength = match [ 1 ] ? match [ 1 ] . length : 0 ;
}
var from = match . index + lookbehindLength ,
matchStr = match [ 0 ] . slice ( lookbehindLength ) ,
to = from + matchStr . length ,
before = str . slice ( 0 , from ) ,
after = str . slice ( to ) ;
var reach = pos + str . length ;
if ( rematch && reach > rematch . reach ) {
rematch . reach = reach ;
}
var removeFrom = currentNode . prev ;
if ( before ) {
removeFrom = addAfter ( tokenList , removeFrom , before ) ;
pos += before . length ;
}
removeRange ( tokenList , removeFrom , removeCount ) ;
var wrapped = new Token ( token , inside ? _ . tokenize ( matchStr , inside ) : matchStr , alias , matchStr ) ;
currentNode = addAfter ( tokenList , removeFrom , wrapped ) ;
if ( after ) {
addAfter ( tokenList , currentNode , after ) ;
}
if ( removeCount > 1 ) {
// at least one Token object was removed, so we have to do some rematching
// this can only happen if the current pattern is greedy
matchGrammar ( text , tokenList , grammar , currentNode . prev , pos , {
cause : token + ',' + j ,
reach : reach
} ) ;
}
}
}
}
}
/ * *
* @ typedef LinkedListNode
* @ property { T } value
* @ property { LinkedListNode < T > | null } prev The previous node .
* @ property { LinkedListNode < T > | null } next The next node .
* @ template T
* @ private
* /
/ * *
* @ template T
* @ private
* /
function LinkedList ( ) {
/** @type {LinkedListNode<T>} */
var head = { value : null , prev : null , next : null } ;
/** @type {LinkedListNode<T>} */
var tail = { value : null , prev : head , next : null } ;
head . next = tail ;
/** @type {LinkedListNode<T>} */
this . head = head ;
/** @type {LinkedListNode<T>} */
this . tail = tail ;
this . length = 0 ;
}
/ * *
* Adds a new node with the given value to the list .
* @ param { LinkedList < T > } list
* @ param { LinkedListNode < T > } node
* @ param { T } value
* @ returns { LinkedListNode < T > } The added node .
* @ template T
* /
function addAfter ( list , node , value ) {
// assumes that node != list.tail && values.length >= 0
var next = node . next ;
var newNode = { value : value , prev : node , next : next } ;
node . next = newNode ;
next . prev = newNode ;
list . length ++ ;
return newNode ;
}
/ * *
* Removes ` count ` nodes after the given node . The given node will not be removed .
* @ param { LinkedList < T > } list
* @ param { LinkedListNode < T > } node
* @ param { number } count
* @ template T
* /
function removeRange ( list , node , count ) {
var next = node . next ;
for ( var i = 0 ; i < count && next !== list . tail ; i ++ ) {
next = next . next ;
}
node . next = next ;
next . prev = node ;
list . length -= i ;
}
/ * *
* @ param { LinkedList < T > } list
* @ returns { T [ ] }
* @ template T
* /
function toArray ( list ) {
var array = [ ] ;
var node = list . head . next ;
while ( node !== list . tail ) {
array . push ( node . value ) ;
node = node . next ;
}
return array ;
}
if ( ! _self . document ) {
if ( ! _self . addEventListener ) {
// in Node.js
return _ ;
}
if ( ! _ . disableWorkerMessageHandler ) {
// In worker
_self . addEventListener ( 'message' , function ( evt ) {
var message = JSON . parse ( evt . data ) ,
lang = message . language ,
code = message . code ,
immediateClose = message . immediateClose ;
_self . postMessage ( _ . highlight ( code , _ . languages [ lang ] , lang ) ) ;
if ( immediateClose ) {
_self . close ( ) ;
}
} , false ) ;
}
return _ ;
}
// Get current script and highlight
var script = _ . util . currentScript ( ) ;
if ( script ) {
_ . filename = script . src ;
if ( script . hasAttribute ( 'data-manual' ) ) {
_ . manual = true ;
}
}
function highlightAutomaticallyCallback ( ) {
if ( ! _ . manual ) {
_ . highlightAll ( ) ;
}
}
if ( ! _ . manual ) {
// If the document state is "loading", then we'll use DOMContentLoaded.
// If the document state is "interactive" and the prism.js script is deferred, then we'll also use the
// DOMContentLoaded event because there might be some plugins or languages which have also been deferred and they
// might take longer one animation frame to execute which can create a race condition where only some plugins have
// been loaded when Prism.highlightAll() is executed, depending on how fast resources are loaded.
// See https://github.com/PrismJS/prism/issues/2102
var readyState = document . readyState ;
if ( readyState === 'loading' || readyState === 'interactive' && script && script . defer ) {
document . addEventListener ( 'DOMContentLoaded' , highlightAutomaticallyCallback ) ;
} else {
if ( window . requestAnimationFrame ) {
window . requestAnimationFrame ( highlightAutomaticallyCallback ) ;
} else {
window . setTimeout ( highlightAutomaticallyCallback , 16 ) ;
}
}
}
return _ ;
} ) ( _self ) ;
if ( module . exports ) {
module . exports = Prism ;
}
// hack for components to work correctly in node.js
if ( typeof commonjsGlobal !== 'undefined' ) {
commonjsGlobal . Prism = Prism ;
}
// some additional documentation/types
/ * *
* The expansion of a simple ` RegExp ` literal to support additional properties .
*
* @ typedef GrammarToken
* @ property { RegExp } pattern The regular expression of the token .
* @ property { boolean } [ lookbehind = false ] If ` true ` , then the first capturing group of ` pattern ` will ( effectively )
* behave as a lookbehind group meaning that the captured text will not be part of the matched text of the new token .
* @ property { boolean } [ greedy = false ] Whether the token is greedy .
* @ property { string | string [ ] } [ alias ] An optional alias or list of aliases .
* @ property { Grammar } [ inside ] The nested grammar of this token .
*
* The ` inside ` grammar will be used to tokenize the text value of each token of this kind .
*
* This can be used to make nested and even recursive language definitions .
*
* Note : This can cause infinite recursion . Be careful when you embed different languages or even the same language into
* each another .
* @ global
* @ public
* /
/ * *
* @ typedef Grammar
* @ type { Object < string , RegExp | GrammarToken | Array < RegExp | GrammarToken >> }
* @ property { Grammar } [ rest ] An optional grammar object that will be appended to this grammar .
* @ global
* @ public
* /
/ * *
* A function which will invoked after an element was successfully highlighted .
*
* @ callback HighlightCallback
* @ param { Element } element The element successfully highlighted .
* @ returns { void }
* @ global
* @ public
* /
/ * *
* @ callback HookCallback
* @ param { Object < string , any > } env The environment variables of the hook .
* @ returns { void }
* @ global
* @ public
* /
/ * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
Begin prism - markup . js
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * /
Prism . languages . markup = {
'comment' : /<!--[\s\S]*?-->/ ,
'prolog' : /<\?[\s\S]+?\?>/ ,
'doctype' : {
// https://www.w3.org/TR/xml/#NT-doctypedecl
pattern : /<!DOCTYPE(?:[^>"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|<!--(?:[^-]|-(?!->))*-->)*\]\s*)?>/i ,
greedy : true ,
inside : {
'internal-subset' : {
pattern : /(\[)[\s\S]+(?=\]>$)/ ,
lookbehind : true ,
greedy : true ,
inside : null // see below
} ,
'string' : {
pattern : /"[^"]*"|'[^']*'/ ,
greedy : true
} ,
'punctuation' : /^<!|>$|[[\]]/ ,
'doctype-tag' : /^DOCTYPE/ ,
'name' : /[^\s<>'"]+/
}
} ,
'cdata' : /<!\[CDATA\[[\s\S]*?]]>/i ,
'tag' : {
pattern : /<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/ ,
greedy : true ,
inside : {
'tag' : {
pattern : /^<\/?[^\s>\/]+/ ,
inside : {
'punctuation' : /^<\/?/ ,
'namespace' : /^[^\s>\/:]+:/
}
} ,
'attr-value' : {
pattern : /=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/ ,
inside : {
'punctuation' : [
{
pattern : /^=/ ,
alias : 'attr-equals'
} ,
/"|'/
]
}
} ,
'punctuation' : /\/?>/ ,
'attr-name' : {
pattern : /[^\s>\/]+/ ,
inside : {
'namespace' : /^[^\s>\/:]+:/
}
}
}
} ,
'entity' : [
{
pattern : /&[\da-z]{1,8};/i ,
alias : 'named-entity'
} ,
/&#x?[\da-f]{1,8};/i
]
} ;
Prism . languages . markup [ 'tag' ] . inside [ 'attr-value' ] . inside [ 'entity' ] =
Prism . languages . markup [ 'entity' ] ;
Prism . languages . markup [ 'doctype' ] . inside [ 'internal-subset' ] . inside = Prism . languages . markup ;
// Plugin to make entity title show the real entity, idea by Roman Komarov
Prism . hooks . add ( 'wrap' , function ( env ) {
if ( env . type === 'entity' ) {
env . attributes [ 'title' ] = env . content . replace ( /&/ , '&' ) ;
}
} ) ;
Object . defineProperty ( Prism . languages . markup . tag , 'addInlined' , {
/ * *
* Adds an inlined language to markup .
*
* An example of an inlined language is CSS with ` <style> ` tags .
*
* @ param { string } tagName The name of the tag that contains the inlined language . This name will be treated as
* case insensitive .
* @ param { string } lang The language key .
* @ example
* addInlined ( 'style' , 'css' ) ;
* /
value : function addInlined ( tagName , lang ) {
var includedCdataInside = { } ;
includedCdataInside [ 'language-' + lang ] = {
pattern : /(^<!\[CDATA\[)[\s\S]+?(?=\]\]>$)/i ,
lookbehind : true ,
inside : Prism . languages [ lang ]
} ;
includedCdataInside [ 'cdata' ] = /^<!\[CDATA\[|\]\]>$/i ;
var inside = {
'included-cdata' : {
pattern : /<!\[CDATA\[[\s\S]*?\]\]>/i ,
inside : includedCdataInside
}
} ;
inside [ 'language-' + lang ] = {
pattern : /[\s\S]+/ ,
inside : Prism . languages [ lang ]
} ;
var def = { } ;
def [ tagName ] = {
pattern : RegExp ( /(<__[\s\S]*?>)(?:<!\[CDATA\[(?:[^\]]|\](?!\]>))*\]\]>|(?!<!\[CDATA\[)[\s\S])*?(?=<\/__>)/ . source . replace ( /__/g , function ( ) { return tagName ; } ) , 'i' ) ,
lookbehind : true ,
greedy : true ,
inside : inside
} ;
Prism . languages . insertBefore ( 'markup' , 'cdata' , def ) ;
}
} ) ;
Prism . languages . html = Prism . languages . markup ;
Prism . languages . mathml = Prism . languages . markup ;
Prism . languages . svg = Prism . languages . markup ;
Prism . languages . xml = Prism . languages . extend ( 'markup' , { } ) ;
Prism . languages . ssml = Prism . languages . xml ;
Prism . languages . atom = Prism . languages . xml ;
Prism . languages . rss = Prism . languages . xml ;
/ * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
Begin prism - css . js
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * /
( function ( Prism ) {
var string = /("|')(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/ ;
Prism . languages . css = {
'comment' : /\/\*[\s\S]*?\*\// ,
'atrule' : {
pattern : /@[\w-]+[\s\S]*?(?:;|(?=\s*\{))/ ,
inside : {
'rule' : /^@[\w-]+/ ,
'selector-function-argument' : {
pattern : /(\bselector\s*\((?!\s*\))\s*)(?:[^()]|\((?:[^()]|\([^()]*\))*\))+?(?=\s*\))/ ,
lookbehind : true ,
alias : 'selector'
} ,
'keyword' : {
pattern : /(^|[^\w-])(?:and|not|only|or)(?![\w-])/ ,
lookbehind : true
}
// See rest below
}
} ,
'url' : {
// https://drafts.csswg.org/css-values-3/#urls
pattern : RegExp ( '\\burl\\((?:' + string . source + '|' + /(?:[^\\\r\n()"']|\\[\s\S])*/ . source + ')\\)' , 'i' ) ,
greedy : true ,
inside : {
'function' : /^url/i ,
'punctuation' : /^\(|\)$/ ,
'string' : {
pattern : RegExp ( '^' + string . source + '$' ) ,
alias : 'url'
}
}
} ,
'selector' : RegExp ( '[^{}\\s](?:[^{};"\']|' + string . source + ')*?(?=\\s*\\{)' ) ,
'string' : {
pattern : string ,
greedy : true
} ,
'property' : /[-_a-z\xA0-\uFFFF][-\w\xA0-\uFFFF]*(?=\s*:)/i ,
'important' : /!important\b/i ,
'function' : /[-a-z0-9]+(?=\()/i ,
'punctuation' : /[(){};:,]/
} ;
Prism . languages . css [ 'atrule' ] . inside . rest = Prism . languages . css ;
var markup = Prism . languages . markup ;
if ( markup ) {
markup . tag . addInlined ( 'style' , 'css' ) ;
Prism . languages . insertBefore ( 'inside' , 'attr-value' , {
'style-attr' : {
pattern : /\s*style=("|')(?:\\[\s\S]|(?!\1)[^\\])*\1/i ,
inside : {
'attr-name' : {
pattern : /^\s*style/i ,
inside : markup . tag . inside
} ,
'punctuation' : /^\s*=\s*['"]|['"]\s*$/ ,
'attr-value' : {
pattern : /.+/i ,
inside : Prism . languages . css
}
} ,
alias : 'language-css'
}
} , markup . tag ) ;
}
} ( Prism ) ) ;
/ * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
Begin prism - clike . js
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * /
Prism . languages . clike = {
'comment' : [
{
pattern : /(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/ ,
lookbehind : true
} ,
{
pattern : /(^|[^\\:])\/\/.*/ ,
lookbehind : true ,
greedy : true
}
] ,
'string' : {
pattern : /(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/ ,
greedy : true
} ,
'class-name' : {
pattern : /(\b(?:class|interface|extends|implements|trait|instanceof|new)\s+|\bcatch\s+\()[\w.\\]+/i ,
lookbehind : true ,
inside : {
'punctuation' : /[.\\]/
}
} ,
'keyword' : /\b(?:if|else|while|do|for|return|in|instanceof|function|new|try|throw|catch|finally|null|break|continue)\b/ ,
'boolean' : /\b(?:true|false)\b/ ,
'function' : /\w+(?=\()/ ,
'number' : /\b0x[\da-f]+\b|(?:\b\d+\.?\d*|\B\.\d+)(?:e[+-]?\d+)?/i ,
'operator' : /[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/ ,
'punctuation' : /[{}[\];(),.:]/
} ;
/ * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
Begin prism - javascript . js
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * /
Prism . languages . javascript = Prism . languages . extend ( 'clike' , {
'class-name' : [
Prism . languages . clike [ 'class-name' ] ,
{
pattern : /(^|[^$\w\xA0-\uFFFF])[_$A-Z\xA0-\uFFFF][$\w\xA0-\uFFFF]*(?=\.(?:prototype|constructor))/ ,
lookbehind : true
}
] ,
'keyword' : [
{
pattern : /((?:^|})\s*)(?:catch|finally)\b/ ,
lookbehind : true
} ,
{
pattern : /(^|[^.]|\.\.\.\s*)\b(?:as|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|for|from|function|(?:get|set)(?=\s*[\[$\w\xA0-\uFFFF])|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/ ,
lookbehind : true
} ,
] ,
'number' : /\b(?:(?:0[xX](?:[\dA-Fa-f](?:_[\dA-Fa-f])?)+|0[bB](?:[01](?:_[01])?)+|0[oO](?:[0-7](?:_[0-7])?)+)n?|(?:\d(?:_\d)?)+n|NaN|Infinity)\b|(?:\b(?:\d(?:_\d)?)+\.?(?:\d(?:_\d)?)*|\B\.(?:\d(?:_\d)?)+)(?:[Ee][+-]?(?:\d(?:_\d)?)+)?/ ,
// Allow for all non-ASCII characters (See http://stackoverflow.com/a/2008444)
'function' : /#?[_$a-zA-Z\xA0-\uFFFF][$\w\xA0-\uFFFF]*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/ ,
'operator' : /--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/
} ) ;
Prism . languages . javascript [ 'class-name' ] [ 0 ] . pattern = /(\b(?:class|interface|extends|implements|instanceof|new)\s+)[\w.\\]+/ ;
Prism . languages . insertBefore ( 'javascript' , 'keyword' , {
'regex' : {
pattern : /((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)\/(?:\[(?:[^\]\\\r\n]|\\.)*]|\\.|[^/\\\[\r\n])+\/[gimyus]{0,6}(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/ ,
lookbehind : true ,
greedy : true ,
inside : {
'regex-source' : {
pattern : /^(\/)[\s\S]+(?=\/[a-z]*$)/ ,
lookbehind : true ,
alias : 'language-regex' ,
inside : Prism . languages . regex
} ,
'regex-flags' : /[a-z]+$/ ,
'regex-delimiter' : /^\/|\/$/
}
} ,
// This must be declared before keyword because we use "function" inside the look-forward
'function-variable' : {
pattern : /#?[_$a-zA-Z\xA0-\uFFFF][$\w\xA0-\uFFFF]*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|[_$a-zA-Z\xA0-\uFFFF][$\w\xA0-\uFFFF]*)\s*=>))/ ,
alias : 'function'
} ,
'parameter' : [
{
pattern : /(function(?:\s+[_$A-Za-z\xA0-\uFFFF][$\w\xA0-\uFFFF]*)?\s*\(\s*)(?!\s)(?:[^()]|\([^()]*\))+?(?=\s*\))/ ,
lookbehind : true ,
inside : Prism . languages . javascript
} ,
{
pattern : /[_$a-z\xA0-\uFFFF][$\w\xA0-\uFFFF]*(?=\s*=>)/i ,
inside : Prism . languages . javascript
} ,
{
pattern : /(\(\s*)(?!\s)(?:[^()]|\([^()]*\))+?(?=\s*\)\s*=>)/ ,
lookbehind : true ,
inside : Prism . languages . javascript
} ,
{
pattern : /((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:[_$A-Za-z\xA0-\uFFFF][$\w\xA0-\uFFFF]*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()]|\([^()]*\))+?(?=\s*\)\s*\{)/ ,
lookbehind : true ,
inside : Prism . languages . javascript
}
] ,
'constant' : /\b[A-Z](?:[A-Z_]|\dx?)*\b/
} ) ;
Prism . languages . insertBefore ( 'javascript' , 'string' , {
'template-string' : {
pattern : /`(?:\\[\s\S]|\${(?:[^{}]|{(?:[^{}]|{[^}]*})*})+}|(?!\${)[^\\`])*`/ ,
greedy : true ,
inside : {
'template-punctuation' : {
pattern : /^`|`$/ ,
alias : 'string'
} ,
'interpolation' : {
pattern : /((?:^|[^\\])(?:\\{2})*)\${(?:[^{}]|{(?:[^{}]|{[^}]*})*})+}/ ,
lookbehind : true ,
inside : {
'interpolation-punctuation' : {
pattern : /^\${|}$/ ,
alias : 'punctuation'
} ,
rest : Prism . languages . javascript
}
} ,
'string' : /[\s\S]+/
}
}
} ) ;
if ( Prism . languages . markup ) {
Prism . languages . markup . tag . addInlined ( 'script' , 'javascript' ) ;
}
Prism . languages . js = Prism . languages . javascript ;
/ * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
Begin prism - file - highlight . js
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * /
( function ( ) {
if ( typeof self === 'undefined' || ! self . Prism || ! self . document ) {
return ;
}
var Prism = window . Prism ;
var LOADING _MESSAGE = 'Loading…' ;
var FAILURE _MESSAGE = function ( status , message ) {
return '✖ Error ' + status + ' while fetching file: ' + message ;
} ;
var FAILURE _EMPTY _MESSAGE = '✖ Error: File does not exist or is empty' ;
var EXTENSIONS = {
'js' : 'javascript' ,
'py' : 'python' ,
'rb' : 'ruby' ,
'ps1' : 'powershell' ,
'psm1' : 'powershell' ,
'sh' : 'bash' ,
'bat' : 'batch' ,
'h' : 'c' ,
'tex' : 'latex'
} ;
var STATUS _ATTR = 'data-src-status' ;
var STATUS _LOADING = 'loading' ;
var STATUS _LOADED = 'loaded' ;
var STATUS _FAILED = 'failed' ;
var SELECTOR = 'pre[data-src]:not([' + STATUS _ATTR + '="' + STATUS _LOADED + '"])'
+ ':not([' + STATUS _ATTR + '="' + STATUS _LOADING + '"])' ;
var lang = /\blang(?:uage)?-([\w-]+)\b/i ;
/ * *
* Sets the Prism ` language-xxxx ` or ` lang-xxxx ` class to the given language .
*
* @ param { HTMLElement } element
* @ param { string } language
* @ returns { void }
* /
function setLanguageClass ( element , language ) {
var className = element . className ;
className = className . replace ( lang , ' ' ) + ' language-' + language ;
element . className = className . replace ( /\s+/g , ' ' ) . trim ( ) ;
}
Prism . hooks . add ( 'before-highlightall' , function ( env ) {
env . selector += ', ' + SELECTOR ;
} ) ;
Prism . hooks . add ( 'before-sanity-check' , function ( env ) {
var pre = /** @type {HTMLPreElement} */ ( env . element ) ;
if ( pre . matches ( SELECTOR ) ) {
env . code = '' ; // fast-path the whole thing and go to complete
pre . setAttribute ( STATUS _ATTR , STATUS _LOADING ) ; // mark as loading
// add code element with loading message
var code = pre . appendChild ( document . createElement ( 'CODE' ) ) ;
code . textContent = LOADING _MESSAGE ;
var src = pre . getAttribute ( 'data-src' ) ;
var language = env . language ;
if ( language === 'none' ) {
// the language might be 'none' because there is no language set;
// in this case, we want to use the extension as the language
var extension = ( /\.(\w+)$/ . exec ( src ) || [ , 'none' ] ) [ 1 ] ;
language = EXTENSIONS [ extension ] || extension ;
}
// set language classes
setLanguageClass ( code , language ) ;
setLanguageClass ( pre , language ) ;
// preload the language
var autoloader = Prism . plugins . autoloader ;
if ( autoloader ) {
autoloader . loadLanguages ( language ) ;
}
// load file
var xhr = new XMLHttpRequest ( ) ;
xhr . open ( 'GET' , src , true ) ;
xhr . onreadystatechange = function ( ) {
if ( xhr . readyState == 4 ) {
if ( xhr . status < 400 && xhr . responseText ) {
// mark as loaded
pre . setAttribute ( STATUS _ATTR , STATUS _LOADED ) ;
// highlight code
code . textContent = xhr . responseText ;
Prism . highlightElement ( code ) ;
} else {
// mark as failed
pre . setAttribute ( STATUS _ATTR , STATUS _FAILED ) ;
if ( xhr . status >= 400 ) {
code . textContent = FAILURE _MESSAGE ( xhr . status , xhr . statusText ) ;
} else {
code . textContent = FAILURE _EMPTY _MESSAGE ;
}
}
}
} ;
xhr . send ( null ) ;
}
} ) ;
Prism . plugins . fileHighlight = {
/ * *
* Executes the File Highlight plugin for all matching ` pre ` elements under the given container .
*
* Note : Elements which are already loaded or currently loading will not be touched by this method .
*
* @ param { ParentNode } [ container = document ]
* /
highlight : function highlight ( container ) {
var elements = ( container || document ) . querySelectorAll ( SELECTOR ) ;
for ( var i = 0 , element ; element = elements [ i ++ ] ; ) {
Prism . highlightElement ( element ) ;
}
}
} ;
var logged = false ;
/** @deprecated Use `Prism.plugins.fileHighlight.highlight` instead. */
Prism . fileHighlight = function ( ) {
if ( ! logged ) {
console . warn ( 'Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead.' ) ;
logged = true ;
}
Prism . plugins . fileHighlight . highlight . apply ( this , arguments ) ;
} ;
} ) ( ) ;
} ) ;
const blocks = '(if|else if|await|then|catch|each|html|debug)' ;
Prism . languages . svelte = Prism . languages . extend ( 'markup' , {
each : {
pattern : new RegExp (
'{[#/]each' +
'(?:(?:\\{(?:(?:\\{(?:[^{}])*\\})|(?:[^{}]))*\\})|(?:[^{}]))*}'
) ,
inside : {
'language-javascript' : [
{
pattern : /(as[\s\S]*)\([\s\S]*\)(?=\s*\})/ ,
lookbehind : true ,
inside : Prism . languages [ 'javascript' ] ,
} ,
{
pattern : /(as[\s]*)[\s\S]*(?=\s*)/ ,
lookbehind : true ,
inside : Prism . languages [ 'javascript' ] ,
} ,
{
pattern : /(#each[\s]*)[\s\S]*(?=as)/ ,
lookbehind : true ,
inside : Prism . languages [ 'javascript' ] ,
} ,
] ,
keyword : /[#/]each|as/ ,
punctuation : /{|}/ ,
} ,
} ,
block : {
pattern : new RegExp (
'{[#:/@]/s' +
blocks +
'(?:(?:\\{(?:(?:\\{(?:[^{}])*\\})|(?:[^{}]))*\\})|(?:[^{}]))*}'
) ,
inside : {
punctuation : /^{|}$/ ,
keyword : [ new RegExp ( '[#:/@]' + blocks + '( )*' ) , /as/ , /then/ ] ,
'language-javascript' : {
pattern : /[\s\S]*/ ,
inside : Prism . languages [ 'javascript' ] ,
} ,
} ,
} ,
tag : {
pattern : /<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?:"[^"]*"|'[^']*'|{[\s\S]+?}(?=[\s/>])))|(?=[\s/>])))+)?\s*\/?>/i ,
greedy : true ,
inside : {
tag : {
pattern : /^<\/?[^\s>\/]+/i ,
inside : {
punctuation : /^<\/?/ ,
namespace : /^[^\s>\/:]+:/ ,
} ,
} ,
'language-javascript' : {
pattern : /\{(?:(?:\{(?:(?:\{(?:[^{}])*\})|(?:[^{}]))*\})|(?:[^{}]))*\}/ ,
inside : Prism . languages [ 'javascript' ] ,
} ,
'attr-value' : {
pattern : /=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/i ,
inside : {
punctuation : [
/^=/ ,
{
pattern : /^(\s*)["']|["']$/ ,
lookbehind : true ,
} ,
] ,
'language-javascript' : {
pattern : /{[\s\S]+}/ ,
inside : Prism . languages [ 'javascript' ] ,
} ,
} ,
} ,
punctuation : /\/?>/ ,
'attr-name' : {
pattern : /[^\s>\/]+/ ,
inside : {
namespace : /^[^\s>\/:]+:/ ,
} ,
} ,
} ,
} ,
'language-javascript' : {
pattern : /\{(?:(?:\{(?:(?:\{(?:[^{}])*\})|(?:[^{}]))*\})|(?:[^{}]))*\}/ ,
lookbehind : true ,
inside : Prism . languages [ 'javascript' ] ,
} ,
} ) ;
Prism . languages . svelte [ 'tag' ] . inside [ 'attr-value' ] . inside [ 'entity' ] =
Prism . languages . svelte [ 'entity' ] ;
Prism . hooks . add ( 'wrap' , env => {
if ( env . type === 'entity' ) {
env . attributes [ 'title' ] = env . content . replace ( /&/ , '&' ) ;
}
} ) ;
Object . defineProperty ( Prism . languages . svelte . tag , 'addInlined' , {
value : function addInlined ( tagName , lang ) {
const includedCdataInside = { } ;
includedCdataInside [ 'language-' + lang ] = {
pattern : /(^<!\[CDATA\[)[\s\S]+?(?=\]\]>$)/i ,
lookbehind : true ,
inside : Prism . languages [ lang ] ,
} ;
includedCdataInside [ 'cdata' ] = /^<!\[CDATA\[|\]\]>$/i ;
const inside = {
'included-cdata' : {
pattern : /<!\[CDATA\[[\s\S]*?\]\]>/i ,
inside : includedCdataInside ,
} ,
} ;
inside [ 'language-' + lang ] = {
pattern : /[\s\S]+/ ,
inside : Prism . languages [ lang ] ,
} ;
const def = { } ;
def [ tagName ] = {
pattern : RegExp (
/(<__[\s\S]*?>)(?:<!\[CDATA\[[\s\S]*?\]\]>\s*|[\s\S])*?(?=<\/__>)/ . source . replace (
/__/g ,
tagName
) ,
'i'
) ,
lookbehind : true ,
greedy : true ,
inside ,
} ;
Prism . languages . insertBefore ( 'svelte' , 'cdata' , def ) ;
} ,
} ) ;
Prism . languages . svelte . tag . addInlined ( 'style' , 'css' ) ;
Prism . languages . svelte . tag . addInlined ( 'script' , 'javascript' ) ;
/* src/components/CodeView.svelte generated by Svelte v3.30.0 */
const file$c = "src/components/CodeView.svelte" ;
function create _fragment$d ( ctx ) {
let code _view ;
let css _view ;
let h10 ;
let t1 ;
let pre0 ;
let code0 ;
let t2 ;
let t3 ;
let html _view ;
let h11 ;
let t5 ;
let pre1 ;
let code1 ;
let t6 ;
const block = {
c : function create ( ) {
code _view = element ( "code-view" ) ;
css _view = element ( "css-view" ) ;
h10 = element ( "h1" ) ;
h10 . textContent = "CSS" ;
t1 = space ( ) ;
pre0 = element ( "pre" ) ;
code0 = element ( "code" ) ;
t2 = text ( /*css_code*/ ctx [ 0 ] ) ;
t3 = space ( ) ;
html _view = element ( "html-view" ) ;
h11 = element ( "h1" ) ;
h11 . textContent = "HTML" ;
t5 = space ( ) ;
pre1 = element ( "pre" ) ;
code1 = element ( "code" ) ;
t6 = text ( /*html_code*/ ctx [ 1 ] ) ;
add _location ( h10 , file$c , 39 , 4 , 709 ) ;
attr _dev ( code0 , "class" , "language-svelte" ) ;
add _location ( code0 , file$c , 41 , 6 , 738 ) ;
add _location ( pre0 , file$c , 40 , 4 , 726 ) ;
set _custom _element _data ( css _view , "class" , "svelte-1qac1jo" ) ;
add _location ( css _view , file$c , 38 , 2 , 694 ) ;
add _location ( h11 , file$c , 48 , 4 , 842 ) ;
attr _dev ( code1 , "class" , "language-svelte" ) ;
add _location ( code1 , file$c , 50 , 6 , 872 ) ;
add _location ( pre1 , file$c , 49 , 4 , 860 ) ;
set _custom _element _data ( html _view , "class" , "svelte-1qac1jo" ) ;
add _location ( html _view , file$c , 47 , 2 , 826 ) ;
set _custom _element _data ( code _view , "class" , "svelte-1qac1jo" ) ;
add _location ( code _view , file$c , 37 , 0 , 680 ) ;
} ,
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 , code _view , anchor ) ;
append _dev ( code _view , css _view ) ;
append _dev ( css _view , h10 ) ;
append _dev ( css _view , t1 ) ;
append _dev ( css _view , pre0 ) ;
append _dev ( pre0 , code0 ) ;
append _dev ( code0 , t2 ) ;
append _dev ( code _view , t3 ) ;
append _dev ( code _view , html _view ) ;
append _dev ( html _view , h11 ) ;
append _dev ( html _view , t5 ) ;
append _dev ( html _view , pre1 ) ;
append _dev ( pre1 , code1 ) ;
append _dev ( code1 , t6 ) ;
} ,
p : function update ( ctx , [ dirty ] ) {
if ( dirty & /*css_code*/ 1 ) set _data _dev ( t2 , /*css_code*/ ctx [ 0 ] ) ;
if ( dirty & /*html_code*/ 2 ) set _data _dev ( t6 , /*html_code*/ ctx [ 1 ] ) ;
} ,
i : noop ,
o : noop ,
d : function destroy ( detaching ) {
if ( detaching ) detach _dev ( code _view ) ;
}
} ;
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 ( "CodeView" , slots , [ ] ) ;
let { source = "" } = $$props ;
let css _code = "" ;
let html _code = "" ;
onMount ( ( ) => {
fetch ( ` ${ source } .css ` ) . then ( resource => resource . text ( ) ) . then ( data => $$invalidate ( 0 , css _code = data ) ) ;
fetch ( ` ${ source } .html ` ) . then ( resource => resource . text ( ) ) . then ( data => $$invalidate ( 1 , html _code = data ) ) . then ( ( ) => prism . highlightAll ( ) ) ;
} ) ;
const writable _props = [ "source" ] ;
Object . keys ( $$props ) . forEach ( key => {
if ( ! ~ writable _props . indexOf ( key ) && key . slice ( 0 , 2 ) !== "$$" ) console . warn ( ` <CodeView> was created with unknown prop ' ${ key } ' ` ) ;
} ) ;
$$self . $$set = $$props => {
if ( "source" in $$props ) $$invalidate ( 2 , source = $$props . source ) ;
} ;
$$self . $capture _state = ( ) => ( {
onMount ,
Prism : prism ,
source ,
css _code ,
html _code
} ) ;
$$self . $inject _state = $$props => {
if ( "source" in $$props ) $$invalidate ( 2 , source = $$props . source ) ;
if ( "css_code" in $$props ) $$invalidate ( 0 , css _code = $$props . css _code ) ;
if ( "html_code" in $$props ) $$invalidate ( 1 , html _code = $$props . html _code ) ;
} ;
if ( $$props && "$$inject" in $$props ) {
$$self . $inject _state ( $$props . $$inject ) ;
}
return [ css _code , html _code , source ] ;
}
class CodeView extends SvelteComponentDev {
constructor ( options ) {
super ( options ) ;
init ( this , options , instance$d , create _fragment$d , safe _not _equal , { source : 2 } ) ;
dispatch _dev ( "SvelteRegisterComponent" , {
component : this ,
tagName : "CodeView" ,
options ,
id : create _fragment$d . name
} ) ;
}
get source ( ) {
throw new Error ( "<CodeView>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'" ) ;
}
set source ( value ) {
throw new Error ( "<CodeView>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'" ) ;
}
}
/* src/demos/Google.svelte generated by Svelte v3.30.0 */
const file$d = "src/demos/Google.svelte" ;
function create _fragment$e ( 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 t16 ;
let codeview ;
let current ;
let mounted ;
let dispose ;
icon = new Icon ( {
props : { name : "grid" , color : "#000" } ,
$$inline : true
} ) ;
codeview = new CodeView ( {
props : { source : "/code/Google" } ,
$$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" ;
t16 = space ( ) ;
create _component ( codeview . $$ . fragment ) ;
attr _dev ( a0 , "class" , "svelte-1xw0xeo" ) ;
add _location ( a0 , file$d , 77 , 8 , 1172 ) ;
attr _dev ( a1 , "class" , "svelte-1xw0xeo" ) ;
add _location ( a1 , file$d , 78 , 8 , 1193 ) ;
add _location ( nav _left , file$d , 76 , 6 , 1153 ) ;
add _location ( li0 , file$d , 81 , 6 , 1241 ) ;
add _location ( li1 , file$d , 82 , 6 , 1262 ) ;
add _location ( li2 , file$d , 83 , 6 , 1283 ) ;
attr _dev ( button0 , "class" , "svelte-1xw0xeo" ) ;
add _location ( button0 , file$d , 84 , 10 , 1336 ) ;
add _location ( li3 , file$d , 84 , 6 , 1332 ) ;
add _location ( ul , file$d , 80 , 6 , 1230 ) ;
attr _dev ( nav , "class" , "svelte-1xw0xeo" ) ;
add _location ( nav , file$d , 75 , 4 , 1141 ) ;
attr _dev ( header , "class" , "svelte-1xw0xeo" ) ;
add _location ( header , file$d , 74 , 2 , 1128 ) ;
if ( img . src !== ( img _src _value = holder ( 500 , 200 ) ) ) attr _dev ( img , "src" , img _src _value ) ;
add _location ( img , file$d , 91 , 6 , 1457 ) ;
attr _dev ( a2 , "href" , "/demos/google" ) ;
attr _dev ( a2 , "class" , "svelte-1xw0xeo" ) ;
add _location ( a2 , file$d , 90 , 4 , 1417 ) ;
attr _dev ( figure , "class" , "svelte-1xw0xeo" ) ;
add _location ( figure , file$d , 89 , 2 , 1404 ) ;
attr _dev ( input , "type" , "text" ) ;
attr _dev ( input , "class" , "svelte-1xw0xeo" ) ;
add _location ( input , file$d , 96 , 2 , 1524 ) ;
attr _dev ( button1 , "class" , "svelte-1xw0xeo" ) ;
add _location ( button1 , file$d , 98 , 6 , 1564 ) ;
attr _dev ( button2 , "class" , "svelte-1xw0xeo" ) ;
add _location ( button2 , file$d , 99 , 6 , 1601 ) ;
attr _dev ( buttons , "class" , "svelte-1xw0xeo" ) ;
add _location ( buttons , file$d , 97 , 4 , 1548 ) ;
attr _dev ( search , "class" , "svelte-1xw0xeo" ) ;
add _location ( search , file$d , 95 , 2 , 1513 ) ;
attr _dev ( content , "class" , "svelte-1xw0xeo" ) ;
add _location ( content , file$d , 72 , 0 , 1115 ) ;
} ,
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 ) ;
insert _dev ( target , t16 , anchor ) ;
mount _component ( codeview , target , anchor ) ;
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 ) ;
transition _in ( codeview . $$ . fragment , local ) ;
current = true ;
} ,
o : function outro ( local ) {
transition _out ( icon . $$ . fragment , local ) ;
transition _out ( codeview . $$ . fragment , local ) ;
current = false ;
} ,
d : function destroy ( detaching ) {
if ( detaching ) detach _dev ( content ) ;
destroy _component ( icon ) ;
if ( detaching ) detach _dev ( t16 ) ;
destroy _component ( codeview , detaching ) ;
mounted = false ;
dispose ( ) ;
}
} ;
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 ( "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 , CodeView , holder } ) ;
return [ ] ;
}
class Google$1 extends SvelteComponentDev {
constructor ( options ) {
super ( options ) ;
init ( this , options , instance$e , create _fragment$e , safe _not _equal , { } ) ;
dispatch _dev ( "SvelteRegisterComponent" , {
component : this ,
tagName : "Google" ,
options ,
id : create _fragment$e . name
} ) ;
}
}
/* 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 [ 1 ] = list [ i ] ;
return child _ctx ;
}
// (241: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 , 243 , 12 , 4559 ) ;
attr _dev ( figure , "id" , "avatar" ) ;
attr _dev ( figure , "class" , "svelte-bnvc6y" ) ;
add _location ( figure , file$e , 242 , 8 , 4526 ) ;
attr _dev ( h4 , "class" , "svelte-bnvc6y" ) ;
add _location ( h4 , file$e , 246 , 10 , 4649 ) ;
add _location ( br , file$e , 247 , 162 , 4840 ) ;
add _location ( a , file$e , 249 , 12 , 4858 ) ;
attr _dev ( p , "class" , "svelte-bnvc6y" ) ;
add _location ( p , file$e , 247 , 10 , 4688 ) ;
attr _dev ( actions , "class" , "svelte-bnvc6y" ) ;
add _location ( actions , file$e , 250 , 10 , 5176 ) ;
attr _dev ( post , "class" , "svelte-bnvc6y" ) ;
add _location ( post , file$e , 245 , 8 , 4632 ) ;
attr _dev ( tweet , "class" , "svelte-bnvc6y" ) ;
add _location ( tweet , file$e , 241 , 6 , 4510 ) ;
} ,
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 : "(241:4) {#each tweets as tweet}" ,
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 codeview ;
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 [ 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$1 ( get _each _context$1 ( ctx , each _value , i ) ) ;
}
codeview = new CodeView ( {
props : { source : "/code/Twitter" } ,
$$inline : true
} ) ;
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 ( codeview . $$ . fragment ) ;
add _location ( h40 , file$e , 203 , 2 , 3309 ) ;
add _location ( h41 , file$e , 204 , 2 , 3330 ) ;
attr _dev ( left , "class" , "svelte-bnvc6y" ) ;
add _location ( left , file$e , 201 , 2 , 3253 ) ;
attr _dev ( back , "class" , "svelte-bnvc6y" ) ;
add _location ( back , file$e , 210 , 8 , 3454 ) ;
attr _dev ( h42 , "class" , "svelte-bnvc6y" ) ;
add _location ( h42 , file$e , 212 , 10 , 3519 ) ;
attr _dev ( span , "class" , "svelte-bnvc6y" ) ;
add _location ( span , file$e , 213 , 10 , 3558 ) ;
add _location ( name , file$e , 211 , 8 , 3502 ) ;
attr _dev ( nav , "class" , "svelte-bnvc6y" ) ;
add _location ( nav , file$e , 209 , 6 , 3440 ) ;
attr _dev ( header , "class" , "svelte-bnvc6y" ) ;
add _location ( header , file$e , 208 , 4 , 3425 ) ;
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 , 220 , 8 , 3680 ) ;
attr _dev ( figure0 , "id" , "background" ) ;
attr _dev ( figure0 , "class" , "svelte-bnvc6y" ) ;
add _location ( figure0 , file$e , 219 , 6 , 3647 ) ;
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 , 224 , 8 , 3760 ) ;
attr _dev ( button0 , "id" , "follow" ) ;
attr _dev ( button0 , "class" , "svelte-bnvc6y" ) ;
add _location ( button0 , file$e , 225 , 8 , 3797 ) ;
attr _dev ( figure1 , "id" , "avatar" ) ;
attr _dev ( figure1 , "class" , "svelte-bnvc6y" ) ;
add _location ( figure1 , file$e , 223 , 6 , 3731 ) ;
attr _dev ( images , "class" , "svelte-bnvc6y" ) ;
add _location ( images , file$e , 218 , 4 , 3632 ) ;
add _location ( h30 , file$e , 230 , 6 , 3884 ) ;
add _location ( p0 , file$e , 231 , 6 , 3919 ) ;
add _location ( p1 , file$e , 232 , 6 , 3940 ) ;
add _location ( a0 , file$e , 233 , 153 , 4259 ) ;
add _location ( p2 , file$e , 233 , 6 , 4112 ) ;
add _location ( b0 , file$e , 234 , 9 , 4389 ) ;
add _location ( b1 , file$e , 234 , 30 , 4410 ) ;
add _location ( p3 , file$e , 234 , 6 , 4386 ) ;
attr _dev ( profile , "class" , "svelte-bnvc6y" ) ;
add _location ( profile , file$e , 229 , 4 , 3868 ) ;
attr _dev ( hr , "class" , "svelte-bnvc6y" ) ;
add _location ( hr , file$e , 237 , 4 , 4457 ) ;
add _location ( tweets _1 , file$e , 239 , 4 , 4467 ) ;
attr _dev ( middle , "class" , "svelte-bnvc6y" ) ;
add _location ( middle , file$e , 207 , 2 , 3412 ) ;
attr _dev ( input , "placeholder" , "Search Twitter" ) ;
add _location ( input , file$e , 264 , 4 , 5653 ) ;
add _location ( h31 , file$e , 268 , 6 , 5742 ) ;
attr _dev ( p4 , "class" , "svelte-bnvc6y" ) ;
add _location ( p4 , file$e , 269 , 6 , 5773 ) ;
attr _dev ( button1 , "id" , "signup" ) ;
attr _dev ( button1 , "class" , "svelte-bnvc6y" ) ;
add _location ( button1 , file$e , 270 , 6 , 5840 ) ;
attr _dev ( aside0 , "id" , "newperson" ) ;
attr _dev ( aside0 , "class" , "svelte-bnvc6y" ) ;
add _location ( aside0 , file$e , 267 , 6 , 5713 ) ;
attr _dev ( img2 , "alt" , "Stock photo" ) ;
if ( img2 . src !== ( img2 _src _value = holder ( 82 , 82 ) ) ) attr _dev ( img2 , "src" , img2 _src _value ) ;
add _location ( img2 , file$e , 276 , 12 , 5961 ) ;
add _location ( figure2 , file$e , 275 , 10 , 5940 ) ;
attr _dev ( img3 , "alt" , "Stock photo" ) ;
if ( img3 . src !== ( img3 _src _value = holder ( 82 , 82 ) ) ) attr _dev ( img3 , "src" , img3 _src _value ) ;
add _location ( img3 , file$e , 279 , 12 , 6062 ) ;
add _location ( figure3 , file$e , 278 , 10 , 6041 ) ;
attr _dev ( img4 , "alt" , "Stock photo" ) ;
if ( img4 . src !== ( img4 _src _value = holder ( 82 , 82 ) ) ) attr _dev ( img4 , "src" , img4 _src _value ) ;
add _location ( img4 , file$e , 282 , 12 , 6162 ) ;
add _location ( figure4 , file$e , 281 , 10 , 6141 ) ;
attr _dev ( img5 , "alt" , "Stock photo" ) ;
if ( img5 . src !== ( img5 _src _value = holder ( 82 , 82 ) ) ) attr _dev ( img5 , "src" , img5 _src _value ) ;
add _location ( img5 , file$e , 285 , 12 , 6262 ) ;
add _location ( figure5 , file$e , 284 , 10 , 6241 ) ;
attr _dev ( img6 , "alt" , "Stock photo" ) ;
if ( img6 . src !== ( img6 _src _value = holder ( 82 , 82 ) ) ) attr _dev ( img6 , "src" , img6 _src _value ) ;
add _location ( img6 , file$e , 288 , 12 , 6362 ) ;
add _location ( figure6 , file$e , 287 , 10 , 6341 ) ;
attr _dev ( img7 , "alt" , "Stock photo" ) ;
if ( img7 . src !== ( img7 _src _value = holder ( 82 , 82 ) ) ) attr _dev ( img7 , "src" , img7 _src _value ) ;
add _location ( img7 , file$e , 291 , 12 , 6462 ) ;
add _location ( figure7 , file$e , 290 , 10 , 6441 ) ;
set _custom _element _data ( recent _media , "class" , "svelte-bnvc6y" ) ;
add _location ( recent _media , file$e , 274 , 8 , 5915 ) ;
add _location ( aside1 , file$e , 273 , 6 , 5899 ) ;
attr _dev ( h32 , "class" , "svelte-bnvc6y" ) ;
add _location ( h32 , file$e , 297 , 8 , 6607 ) ;
attr _dev ( li0 , "class" , "svelte-bnvc6y" ) ;
add _location ( li0 , file$e , 299 , 10 , 6654 ) ;
attr _dev ( li1 , "class" , "svelte-bnvc6y" ) ;
add _location ( li1 , file$e , 300 , 10 , 6685 ) ;
attr _dev ( li2 , "class" , "svelte-bnvc6y" ) ;
add _location ( li2 , file$e , 301 , 10 , 6716 ) ;
attr _dev ( ul0 , "class" , "svelte-bnvc6y" ) ;
add _location ( ul0 , file$e , 298 , 8 , 6639 ) ;
attr _dev ( a1 , "class" , "svelte-bnvc6y" ) ;
add _location ( a1 , file$e , 303 , 8 , 6759 ) ;
attr _dev ( aside2 , "id" , "trending" ) ;
attr _dev ( aside2 , "class" , "svelte-bnvc6y" ) ;
add _location ( aside2 , file$e , 296 , 6 , 6577 ) ;
attr _dev ( h33 , "class" , "svelte-bnvc6y" ) ;
add _location ( h33 , file$e , 307 , 8 , 6828 ) ;
attr _dev ( li3 , "class" , "svelte-bnvc6y" ) ;
add _location ( li3 , file$e , 309 , 10 , 6877 ) ;
attr _dev ( li4 , "class" , "svelte-bnvc6y" ) ;
add _location ( li4 , file$e , 310 , 10 , 6912 ) ;
attr _dev ( li5 , "class" , "svelte-bnvc6y" ) ;
add _location ( li5 , file$e , 311 , 10 , 6947 ) ;
attr _dev ( li6 , "class" , "svelte-bnvc6y" ) ;
add _location ( li6 , file$e , 312 , 10 , 6982 ) ;
attr _dev ( li7 , "class" , "svelte-bnvc6y" ) ;
add _location ( li7 , file$e , 313 , 10 , 7017 ) ;
attr _dev ( ul1 , "class" , "svelte-bnvc6y" ) ;
add _location ( ul1 , file$e , 308 , 8 , 6862 ) ;
attr _dev ( aside3 , "id" , "trending" ) ;
attr _dev ( aside3 , "class" , "svelte-bnvc6y" ) ;
add _location ( aside3 , file$e , 306 , 6 , 6798 ) ;
add _location ( section , file$e , 266 , 4 , 5697 ) ;
attr _dev ( right , "class" , "svelte-bnvc6y" ) ;
add _location ( right , file$e , 263 , 2 , 5641 ) ;
attr _dev ( content , "class" , "svelte-bnvc6y" ) ;
add _location ( content , file$e , 200 , 0 , 3241 ) ;
} ,
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 ( codeview , target , anchor ) ;
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 ) ;
for ( let i = 0 ; i < each _value . length ; i += 1 ) {
transition _in ( each _blocks [ i ] ) ;
}
transition _in ( codeview . $$ . 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 ( codeview . $$ . 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 ( codeview , 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 ] ;
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 ,
onMount ,
tweets ,
CodeView ,
holder
} ) ;
$$self . $inject _state = $$props => {
if ( "tweets" in $$props ) $$invalidate ( 0 , tweets = $$props . tweets ) ;
} ;
if ( $$props && "$$inject" in $$props ) {
$$self . $inject _state ( $$props . $$inject ) ;
}
return [ tweets ] ;
}
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 ;
}
// (232: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 = holder ( 64 , 64 ) ) ) attr _dev ( img , "src" , img _src _value ) ;
attr _dev ( img , "class" , "svelte-87j0be" ) ;
add _location ( img , file$f , 233 , 10 , 5268 ) ;
attr _dev ( h4 , "class" , "svelte-87j0be" ) ;
add _location ( h4 , file$f , 235 , 12 , 5327 ) ;
attr _dev ( p , "class" , "svelte-87j0be" ) ;
add _location ( p , file$f , 236 , 12 , 5353 ) ;
attr _dev ( nav , "class" , "svelte-87j0be" ) ;
add _location ( nav , file$f , 237 , 12 , 5495 ) ;
attr _dev ( reply , "class" , "svelte-87j0be" ) ;
add _location ( reply , file$f , 241 , 12 , 5670 ) ;
attr _dev ( info , "class" , "svelte-87j0be" ) ;
add _location ( info , file$f , 234 , 10 , 5308 ) ;
attr _dev ( card , "class" , "svelte-87j0be" ) ;
add _location ( card , file$f , 232 , 8 , 5251 ) ;
} ,
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 : "(232:8) {#each cards as card}" ,
ctx
} ) ;
return block ;
}
// (250: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 = holder ( 120 , 80 ) ) ) attr _dev ( img , "src" , img _src _value ) ;
attr _dev ( img , "class" , "svelte-87j0be" ) ;
add _location ( img , file$f , 251 , 8 , 5883 ) ;
attr _dev ( h4 , "class" , "svelte-87j0be" ) ;
add _location ( h4 , file$f , 253 , 10 , 5939 ) ;
add _location ( author , file$f , 254 , 10 , 5976 ) ;
add _location ( views , file$f , 255 , 10 , 6007 ) ;
add _location ( date , file$f , 256 , 10 , 6043 ) ;
attr _dev ( info , "class" , "svelte-87j0be" ) ;
add _location ( info , file$f , 252 , 8 , 5922 ) ;
attr _dev ( card , "class" , "small svelte-87j0be" ) ;
add _location ( card , file$f , 250 , 6 , 5854 ) ;
} ,
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 ) ;
} ,
p : noop ,
d : function destroy ( detaching ) {
if ( detaching ) detach _dev ( card ) ;
}
} ;
dispatch _dev ( "SvelteRegisterBlock" , {
block ,
id : create _each _block _1 . name ,
type : "each" ,
source : "(250:6) {#each cards as card}" ,
ctx
} ) ;
return block ;
}
// (268: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 = holder ( 120 , 80 ) ) ) attr _dev ( img , "src" , img _src _value ) ;
attr _dev ( img , "class" , "svelte-87j0be" ) ;
add _location ( img , file$f , 269 , 8 , 6291 ) ;
attr _dev ( h4 , "class" , "svelte-87j0be" ) ;
add _location ( h4 , file$f , 271 , 10 , 6347 ) ;
add _location ( author , file$f , 272 , 10 , 6384 ) ;
add _location ( views , file$f , 273 , 10 , 6415 ) ;
add _location ( date , file$f , 274 , 10 , 6451 ) ;
attr _dev ( info , "class" , "svelte-87j0be" ) ;
add _location ( info , file$f , 270 , 8 , 6330 ) ;
attr _dev ( card , "class" , "svelte-87j0be" ) ;
add _location ( card , file$f , 268 , 6 , 6276 ) ;
} ,
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 ) ;
} ,
p : noop ,
d : function destroy ( detaching ) {
if ( detaching ) detach _dev ( card ) ;
}
} ;
dispatch _dev ( "SvelteRegisterBlock" , {
block ,
id : create _each _block$2 . name ,
type : "each" ,
source : "(268: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 t42 ;
let codeview ;
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 ) ) ;
}
const out = i => transition _out ( each _blocks _2 [ i ] , 1 , 1 , ( ) => {
each _blocks _2 [ i ] = null ;
} ) ;
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 ) ) ;
}
codeview = new CodeView ( {
props : { source : "/code/Youtube" } ,
$$inline : true
} ) ;
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 ( ) ;
}
t42 = space ( ) ;
create _component ( codeview . $$ . fragment ) ;
attr _dev ( logo , "class" , "svelte-87j0be" ) ;
add _location ( logo , file$f , 176 , 56 , 2768 ) ;
add _location ( a0 , file$f , 176 , 8 , 2720 ) ;
add _location ( nav _left , file$f , 175 , 6 , 2701 ) ;
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 , 178 , 6 , 2817 ) ;
add _location ( li0 , file$f , 180 , 8 , 2891 ) ;
add _location ( li1 , file$f , 181 , 8 , 2944 ) ;
add _location ( li2 , file$f , 182 , 8 , 3004 ) ;
attr _dev ( button0 , "class" , "svelte-87j0be" ) ;
add _location ( button0 , file$f , 183 , 12 , 3059 ) ;
add _location ( li3 , file$f , 183 , 8 , 3055 ) ;
add _location ( ul , file$f , 179 , 6 , 2878 ) ;
attr _dev ( nav0 , "class" , "svelte-87j0be" ) ;
add _location ( nav0 , file$f , 174 , 4 , 2689 ) ;
attr _dev ( header , "class" , "svelte-87j0be" ) ;
add _location ( header , file$f , 173 , 2 , 2676 ) ;
if ( img0 . src !== ( img0 _src _value = holder ( 800 , 450 ) ) ) attr _dev ( img0 , "src" , img0 _src _value ) ;
add _location ( img0 , file$f , 191 , 10 , 3232 ) ;
attr _dev ( a1 , "href" , "/demos/google" ) ;
add _location ( a1 , file$f , 190 , 8 , 3188 ) ;
attr _dev ( a2 , "class" , "svelte-87j0be" ) ;
add _location ( a2 , file$f , 194 , 10 , 3308 ) ;
attr _dev ( a3 , "class" , "svelte-87j0be" ) ;
add _location ( a3 , file$f , 194 , 22 , 3320 ) ;
attr _dev ( p , "class" , "svelte-87j0be" ) ;
add _location ( p , file$f , 195 , 10 , 3349 ) ;
add _location ( likes , file$f , 197 , 12 , 3410 ) ;
add _location ( video _buttons , file$f , 198 , 12 , 3449 ) ;
set _custom _element _data ( video _actions , "class" , "svelte-87j0be" ) ;
add _location ( video _actions , file$f , 196 , 10 , 3382 ) ;
attr _dev ( figcaption , "class" , "svelte-87j0be" ) ;
add _location ( figcaption , file$f , 193 , 8 , 3285 ) ;
add _location ( figure0 , file$f , 189 , 6 , 3171 ) ;
attr _dev ( hr0 , "class" , "svelte-87j0be" ) ;
add _location ( hr0 , file$f , 208 , 6 , 3843 ) ;
if ( img1 . src !== ( img1 _src _value = holder ( 64 , 64 ) ) ) attr _dev ( img1 , "src" , img1 _src _value ) ;
attr _dev ( img1 , "class" , "svelte-87j0be" ) ;
add _location ( img1 , file$f , 212 , 12 , 3909 ) ;
attr _dev ( h4 , "class" , "svelte-87j0be" ) ;
add _location ( h4 , file$f , 214 , 12 , 3970 ) ;
add _location ( subs , file$f , 215 , 12 , 4003 ) ;
attr _dev ( info , "class" , "svelte-87j0be" ) ;
add _location ( info , file$f , 213 , 12 , 3951 ) ;
attr _dev ( card , "class" , "svelte-87j0be" ) ;
add _location ( card , file$f , 211 , 10 , 3890 ) ;
attr _dev ( button1 , "id" , "subscribe" ) ;
attr _dev ( button1 , "class" , "svelte-87j0be" ) ;
add _location ( button1 , file$f , 217 , 10 , 4057 ) ;
attr _dev ( nav1 , "class" , "svelte-87j0be" ) ;
add _location ( nav1 , file$f , 210 , 8 , 3874 ) ;
attr _dev ( content0 , "class" , "svelte-87j0be" ) ;
add _location ( content0 , file$f , 220 , 8 , 4123 ) ;
attr _dev ( promotion , "class" , "svelte-87j0be" ) ;
add _location ( promotion , file$f , 209 , 6 , 3854 ) ;
attr _dev ( hr1 , "class" , "svelte-87j0be" ) ;
add _location ( hr1 , file$f , 224 , 6 , 5052 ) ;
add _location ( span , file$f , 228 , 10 , 5099 ) ;
attr _dev ( sort , "class" , "svelte-87j0be" ) ;
add _location ( sort , file$f , 228 , 36 , 5125 ) ;
attr _dev ( nav2 , "class" , "svelte-87j0be" ) ;
add _location ( nav2 , file$f , 227 , 8 , 5083 ) ;
attr _dev ( comments , "class" , "svelte-87j0be" ) ;
add _location ( comments , file$f , 226 , 6 , 5064 ) ;
attr _dev ( left , "class" , "svelte-87j0be" ) ;
add _location ( left , file$f , 188 , 4 , 3158 ) ;
if ( img2 . src !== ( img2 _src _value = holder ( 300 , 150 ) ) ) attr _dev ( img2 , "src" , img2 _src _value ) ;
add _location ( img2 , file$f , 263 , 10 , 6180 ) ;
attr _dev ( a4 , "href" , "/demos/google" ) ;
add _location ( a4 , file$f , 262 , 8 , 6136 ) ;
add _location ( figure1 , file$f , 261 , 6 , 6119 ) ;
attr _dev ( right , "class" , "svelte-87j0be" ) ;
add _location ( right , file$f , 248 , 4 , 5812 ) ;
attr _dev ( main , "class" , "svelte-87j0be" ) ;
add _location ( main , file$f , 187 , 2 , 3147 ) ;
attr _dev ( content1 , "class" , "svelte-87j0be" ) ;
add _location ( content1 , file$f , 172 , 0 , 2664 ) ;
} ,
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 ) ;
}
insert _dev ( target , t42 , anchor ) ;
mount _component ( codeview , target , anchor ) ;
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 : function update ( ctx , [ dirty ] ) {
if ( dirty & /*holder*/ 0 ) {
each _value _2 = /*cards*/ ctx [ 0 ] ;
validate _each _argument ( each _value _2 ) ;
let i ;
for ( i = 0 ; i < each _value _2 . length ; i += 1 ) {
const child _ctx = get _each _context _2 ( ctx , each _value _2 , i ) ;
if ( each _blocks _2 [ i ] ) {
each _blocks _2 [ i ] . p ( child _ctx , dirty ) ;
transition _in ( each _blocks _2 [ i ] , 1 ) ;
} else {
each _blocks _2 [ i ] = create _each _block _2 ( child _ctx ) ;
each _blocks _2 [ i ] . c ( ) ;
transition _in ( each _blocks _2 [ i ] , 1 ) ;
each _blocks _2 [ i ] . m ( comments , null ) ;
}
}
group _outros ( ) ;
for ( i = each _value _2 . length ; i < each _blocks _2 . length ; i += 1 ) {
out ( i ) ;
}
check _outros ( ) ;
}
if ( dirty & /*holder*/ 0 ) {
each _value _1 = /*cards*/ ctx [ 0 ] ;
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 ( ctx , each _value _1 , i ) ;
if ( each _blocks _1 [ i ] ) {
each _blocks _1 [ i ] . p ( child _ctx , dirty ) ;
} else {
each _blocks _1 [ i ] = create _each _block _1 ( child _ctx ) ;
each _blocks _1 [ i ] . c ( ) ;
each _blocks _1 [ i ] . m ( right , t40 ) ;
}
}
for ( ; i < each _blocks _1 . length ; i += 1 ) {
each _blocks _1 [ i ] . d ( 1 ) ;
}
each _blocks _1 . length = each _value _1 . length ;
}
if ( dirty & /*holder*/ 0 ) {
each _value = /*cards*/ ctx [ 0 ] ;
validate _each _argument ( each _value ) ;
let i ;
for ( i = 0 ; i < each _value . length ; i += 1 ) {
const child _ctx = get _each _context$2 ( ctx , each _value , i ) ;
if ( each _blocks [ i ] ) {
each _blocks [ i ] . p ( child _ctx , dirty ) ;
} else {
each _blocks [ i ] = create _each _block$2 ( child _ctx ) ;
each _blocks [ i ] . c ( ) ;
each _blocks [ i ] . m ( right , null ) ;
}
}
for ( ; i < each _blocks . length ; i += 1 ) {
each _blocks [ i ] . d ( 1 ) ;
}
each _blocks . length = each _value . length ;
}
} ,
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 ] ) ;
}
transition _in ( codeview . $$ . 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 ) ;
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 ] ) ;
}
transition _out ( codeview . $$ . fragment , local ) ;
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 ) ;
if ( detaching ) detach _dev ( t42 ) ;
destroy _component ( codeview , 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 ,
CodeView ,
cards ,
thumbnail ,
holder
} ) ;
$$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 ;
}
// (120: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 = holder ( 82 , 82 ) ) ) attr _dev ( img , "src" , img _src _value ) ;
add _location ( img , file$g , 121 , 6 , 2099 ) ;
add _location ( figure , file$g , 120 , 4 , 2084 ) ;
} ,
m : function mount ( target , anchor ) {
insert _dev ( target , figure , anchor ) ;
append _dev ( figure , img ) ;
append _dev ( figure , t ) ;
} ,
p : noop ,
d : function destroy ( detaching ) {
if ( detaching ) detach _dev ( figure ) ;
}
} ;
dispatch _dev ( "SvelteRegisterBlock" , {
block ,
id : create _each _block _1$1 . name ,
type : "each" ,
source : "(120:2) {#each pins as pin}" ,
ctx
} ) ;
return block ;
}
// (139: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 = holder ( 300 , 300 ) ) ) attr _dev ( img , "src" , img _src _value ) ;
add _location ( img , file$g , 140 , 6 , 2577 ) ;
attr _dev ( figure , "class" , "svelte-1ri9kvn" ) ;
add _location ( figure , file$g , 139 , 4 , 2562 ) ;
} ,
m : function mount ( target , anchor ) {
insert _dev ( target , figure , anchor ) ;
append _dev ( figure , img ) ;
append _dev ( figure , t ) ;
} ,
p : noop ,
d : function destroy ( detaching ) {
if ( detaching ) detach _dev ( figure ) ;
}
} ;
dispatch _dev ( "SvelteRegisterBlock" , {
block ,
id : create _each _block$3 . name ,
type : "each" ,
source : "(139: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 t33 ;
let codeview ;
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 ) ) ;
}
codeview = new CodeView ( {
props : { source : "/code/Instagram" } ,
$$inline : true
} ) ;
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 ( ) ;
}
t33 = space ( ) ;
create _component ( codeview . $$ . fragment ) ;
add _location ( b0 , file$g , 88 , 6 , 1313 ) ;
attr _dev ( input , "placeholder" , "Search" ) ;
add _location ( input , file$g , 89 , 6 , 1388 ) ;
attr _dev ( button0 , "class" , "svelte-1ri9kvn" ) ;
add _location ( button0 , file$g , 91 , 12 , 1440 ) ;
add _location ( li0 , file$g , 91 , 8 , 1436 ) ;
attr _dev ( a0 , "class" , "svelte-1ri9kvn" ) ;
add _location ( a0 , file$g , 92 , 12 , 1481 ) ;
add _location ( li1 , file$g , 92 , 8 , 1477 ) ;
add _location ( ul0 , file$g , 90 , 6 , 1423 ) ;
attr _dev ( nav0 , "class" , "svelte-1ri9kvn" ) ;
add _location ( nav0 , file$g , 87 , 4 , 1301 ) ;
attr _dev ( header , "class" , "svelte-1ri9kvn" ) ;
add _location ( header , file$g , 86 , 2 , 1288 ) ;
attr _dev ( img , "alt" , "Zed's Face" ) ;
if ( img . src !== ( img _src _value = holder ( 256 , 256 ) ) ) attr _dev ( img , "src" , img _src _value ) ;
add _location ( img , file$g , 99 , 6 , 1568 ) ;
attr _dev ( figure , "class" , "svelte-1ri9kvn" ) ;
add _location ( figure , file$g , 98 , 4 , 1553 ) ;
add _location ( b1 , file$g , 104 , 8 , 1661 ) ;
attr _dev ( button1 , "class" , "svelte-1ri9kvn" ) ;
add _location ( button1 , file$g , 104 , 23 , 1676 ) ;
attr _dev ( p0 , "class" , "svelte-1ri9kvn" ) ;
add _location ( p0 , file$g , 103 , 6 , 1649 ) ;
add _location ( b2 , file$g , 108 , 8 , 1730 ) ;
add _location ( b3 , file$g , 108 , 25 , 1747 ) ;
add _location ( b4 , file$g , 108 , 48 , 1770 ) ;
attr _dev ( p1 , "class" , "svelte-1ri9kvn" ) ;
add _location ( p1 , file$g , 107 , 6 , 1718 ) ;
add _location ( b5 , file$g , 111 , 9 , 1814 ) ;
attr _dev ( p2 , "class" , "svelte-1ri9kvn" ) ;
add _location ( p2 , file$g , 111 , 6 , 1811 ) ;
add _location ( br , file$g , 112 , 102 , 1939 ) ;
attr _dev ( a1 , "href" , "www.twitch.tv/zedashaw" ) ;
attr _dev ( a1 , "class" , "svelte-1ri9kvn" ) ;
add _location ( a1 , file$g , 113 , 8 , 1952 ) ;
attr _dev ( p3 , "class" , "svelte-1ri9kvn" ) ;
add _location ( p3 , file$g , 112 , 6 , 1843 ) ;
attr _dev ( info , "class" , "svelte-1ri9kvn" ) ;
add _location ( info , file$g , 102 , 4 , 1636 ) ;
attr _dev ( profile , "class" , "svelte-1ri9kvn" ) ;
add _location ( profile , file$g , 97 , 2 , 1539 ) ;
attr _dev ( pins _1 , "class" , "svelte-1ri9kvn" ) ;
add _location ( pins _1 , file$g , 118 , 2 , 2051 ) ;
add _location ( li2 , file$g , 129 , 8 , 2221 ) ;
add _location ( li3 , file$g , 130 , 8 , 2291 ) ;
add _location ( li4 , file$g , 131 , 8 , 2362 ) ;
add _location ( li5 , file$g , 132 , 8 , 2427 ) ;
add _location ( ul1 , file$g , 128 , 6 , 2208 ) ;
attr _dev ( nav1 , "class" , "svelte-1ri9kvn" ) ;
add _location ( nav1 , file$g , 127 , 4 , 2196 ) ;
attr _dev ( tabs , "class" , "svelte-1ri9kvn" ) ;
add _location ( tabs , file$g , 126 , 2 , 2185 ) ;
attr _dev ( posts _1 , "class" , "svelte-1ri9kvn" ) ;
add _location ( posts _1 , file$g , 137 , 2 , 2526 ) ;
attr _dev ( content , "class" , "svelte-1ri9kvn" ) ;
add _location ( content , file$g , 85 , 0 , 1276 ) ;
} ,
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 ) ;
}
insert _dev ( target , t33 , anchor ) ;
mount _component ( codeview , target , anchor ) ;
current = true ;
} ,
p : function update ( ctx , [ dirty ] ) {
if ( dirty & /*holder*/ 0 ) {
each _value _1 = /*pins*/ ctx [ 1 ] ;
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$1 ( ctx , each _value _1 , i ) ;
if ( each _blocks _1 [ i ] ) {
each _blocks _1 [ i ] . p ( child _ctx , dirty ) ;
} else {
each _blocks _1 [ i ] = create _each _block _1$1 ( child _ctx ) ;
each _blocks _1 [ i ] . c ( ) ;
each _blocks _1 [ i ] . m ( pins _1 , null ) ;
}
}
for ( ; i < each _blocks _1 . length ; i += 1 ) {
each _blocks _1 [ i ] . d ( 1 ) ;
}
each _blocks _1 . length = each _value _1 . length ;
}
if ( dirty & /*holder*/ 0 ) {
each _value = /*posts*/ ctx [ 0 ] ;
validate _each _argument ( each _value ) ;
let i ;
for ( i = 0 ; i < each _value . length ; i += 1 ) {
const child _ctx = get _each _context$3 ( ctx , each _value , i ) ;
if ( each _blocks [ i ] ) {
each _blocks [ i ] . p ( child _ctx , dirty ) ;
} else {
each _blocks [ i ] = create _each _block$3 ( child _ctx ) ;
each _blocks [ i ] . c ( ) ;
each _blocks [ i ] . m ( posts _1 , null ) ;
}
}
for ( ; i < each _blocks . length ; i += 1 ) {
each _blocks [ i ] . d ( 1 ) ;
}
each _blocks . length = each _value . length ;
}
} ,
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 ( codeview . $$ . 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 ( codeview . $$ . 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 ) ;
if ( detaching ) detach _dev ( t33 ) ;
destroy _component ( codeview , 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 ,
CodeView ,
posts ,
pins ,
holder
} ) ;
$$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 ;
}
// (156:2) {#if !thumbnail}
function create _if _block$1 ( 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 , 158 , 8 , 2526 ) ;
attr _dev ( p0 , "class" , "svelte-79nfuj" ) ;
add _location ( p0 , file$h , 159 , 8 , 2560 ) ;
attr _dev ( b0 , "class" , "svelte-79nfuj" ) ;
add _location ( b0 , file$h , 160 , 11 , 2601 ) ;
attr _dev ( b1 , "class" , "svelte-79nfuj" ) ;
add _location ( b1 , file$h , 160 , 29 , 2619 ) ;
attr _dev ( p1 , "class" , "svelte-79nfuj" ) ;
add _location ( p1 , file$h , 160 , 8 , 2598 ) ;
attr _dev ( p2 , "class" , "svelte-79nfuj" ) ;
add _location ( p2 , file$h , 161 , 8 , 2654 ) ;
attr _dev ( info , "class" , "svelte-79nfuj" ) ;
add _location ( info , file$h , 157 , 6 , 2511 ) ;
attr _dev ( img , "alt" , "Zed's Face" ) ;
if ( img . src !== ( img _src _value = holder ( 128 , 128 ) ) ) attr _dev ( img , "src" , img _src _value ) ;
attr _dev ( img , "class" , "svelte-79nfuj" ) ;
add _location ( img , file$h , 165 , 8 , 2758 ) ;
attr _dev ( figure , "class" , "svelte-79nfuj" ) ;
add _location ( figure , file$h , 164 , 6 , 2741 ) ;
attr _dev ( profile , "class" , "svelte-79nfuj" ) ;
add _location ( profile , file$h , 156 , 4 , 2495 ) ;
attr _dev ( pins , "class" , "svelte-79nfuj" ) ;
add _location ( pins , file$h , 169 , 4 , 2843 ) ;
} ,
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, holder*/ 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$1 . name ,
type : "if" ,
source : "(156:2) {#if !thumbnail}" ,
ctx
} ) ;
return block ;
}
// (173: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" , "Van Gogh Art" ) ;
if ( img . src !== ( img _src _value = holder ( 240 , /*height*/ ctx [ 9 ] ) ) ) attr _dev ( img , "src" , img _src _value ) ;
attr _dev ( img , "class" , "svelte-79nfuj" ) ;
add _location ( img , file$h , 174 , 12 , 2975 ) ;
attr _dev ( figcaption , "class" , "svelte-79nfuj" ) ;
add _location ( figcaption , file$h , 175 , 12 , 3040 ) ;
attr _dev ( figure , "class" , "svelte-79nfuj" ) ;
add _location ( figure , file$h , 173 , 10 , 2954 ) ;
} ,
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 : "(173:8) {#each random_sample(pin_sizes, 10) as height}" ,
ctx
} ) ;
return block ;
}
// (171: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 , 171 , 6 , 2882 ) ;
} ,
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, holder*/ 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 : "(171: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 t11 ;
let codeview ;
let current ;
icon = new Icon ( {
props : { name : "pinterest" , color : "var(--color)" } ,
$$inline : true
} ) ;
let if _block = ! /*thumbnail*/ ctx [ 0 ] && create _if _block$1 ( ctx ) ;
codeview = new CodeView ( {
props : { source : "/code/Pinterest" } ,
$$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 ( ) ;
if ( if _block ) if _block . c ( ) ;
t11 = space ( ) ;
create _component ( codeview . $$ . fragment ) ;
attr _dev ( logo , "class" , "svelte-79nfuj" ) ;
add _location ( logo , file$h , 141 , 8 , 2165 ) ;
attr _dev ( a0 , "class" , "svelte-79nfuj" ) ;
add _location ( a0 , file$h , 142 , 8 , 2243 ) ;
attr _dev ( a1 , "class" , "svelte-79nfuj" ) ;
add _location ( a1 , file$h , 143 , 8 , 2264 ) ;
attr _dev ( left , "class" , "svelte-79nfuj" ) ;
add _location ( left , file$h , 140 , 6 , 2150 ) ;
attr _dev ( input , "placeholder" , "Search" ) ;
attr _dev ( input , "class" , "svelte-79nfuj" ) ;
add _location ( input , file$h , 146 , 6 , 2300 ) ;
attr _dev ( button0 , "class" , "svelte-79nfuj" ) ;
add _location ( button0 , file$h , 149 , 12 , 2353 ) ;
attr _dev ( li0 , "class" , "svelte-79nfuj" ) ;
add _location ( li0 , file$h , 149 , 8 , 2349 ) ;
attr _dev ( button1 , "id" , "signup" ) ;
attr _dev ( button1 , "class" , "svelte-79nfuj" ) ;
add _location ( button1 , file$h , 150 , 12 , 2394 ) ;
attr _dev ( li1 , "class" , "svelte-79nfuj" ) ;
add _location ( li1 , file$h , 150 , 8 , 2390 ) ;
attr _dev ( ul , "class" , "svelte-79nfuj" ) ;
add _location ( ul , file$h , 148 , 6 , 2336 ) ;
attr _dev ( nav , "class" , "svelte-79nfuj" ) ;
add _location ( nav , file$h , 139 , 4 , 2138 ) ;
attr _dev ( header , "class" , "svelte-79nfuj" ) ;
add _location ( header , file$h , 138 , 2 , 2125 ) ;
attr _dev ( content , "class" , "svelte-79nfuj" ) ;
add _location ( content , file$h , 137 , 0 , 2113 ) ;
} ,
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 ) ;
insert _dev ( target , t11 , anchor ) ;
mount _component ( codeview , target , anchor ) ;
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$1 ( 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 ) ;
transition _in ( codeview . $$ . fragment , local ) ;
current = true ;
} ,
o : function outro ( local ) {
transition _out ( icon . $$ . fragment , local ) ;
transition _out ( codeview . $$ . fragment , local ) ;
current = false ;
} ,
d : function destroy ( detaching ) {
if ( detaching ) detach _dev ( content ) ;
destroy _component ( icon ) ;
if ( if _block ) if _block . d ( ) ;
if ( detaching ) detach _dev ( t11 ) ;
destroy _component ( codeview , detaching ) ;
}
} ;
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 ,
CodeView ,
holder ,
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 ;
}
// (141: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 = holder ( 82 , 82 ) ) ) attr _dev ( img , "src" , img _src _value ) ;
add _location ( img , file$i , 142 , 6 , 2482 ) ;
add _location ( figure , file$i , 141 , 4 , 2467 ) ;
} ,
m : function mount ( target , anchor ) {
insert _dev ( target , figure , anchor ) ;
append _dev ( figure , img ) ;
append _dev ( figure , t ) ;
} ,
p : noop ,
d : function destroy ( detaching ) {
if ( detaching ) detach _dev ( figure ) ;
}
} ;
dispatch _dev ( "SvelteRegisterBlock" , {
block ,
id : create _each _block _1$3 . name ,
type : "each" ,
source : "(141:2) {#each related as pin}" ,
ctx
} ) ;
return block ;
}
// (149: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 = holder ( 300 , 300 ) ) ) attr _dev ( img , "src" , img _src _value ) ;
add _location ( img , file$i , 151 , 9 , 2675 ) ;
attr _dev ( a , "href" , "/demos/xoracademy/watch" ) ;
attr _dev ( a , "class" , "svelte-i1di9h" ) ;
add _location ( a , file$i , 150 , 6 , 2622 ) ;
attr _dev ( figure , "class" , "svelte-i1di9h" ) ;
add _location ( figure , file$i , 149 , 4 , 2607 ) ;
} ,
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 ;
}
} ,
p : noop ,
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 : "(149: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 t19 ;
let codeview ;
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 ) ) ;
}
codeview = new CodeView ( {
props : { source : "/code/XorAcademy" } ,
$$inline : true
} ) ;
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 ( ) ;
}
t19 = space ( ) ;
create _component ( codeview . $$ . fragment ) ;
attr _dev ( a0 , "id" , "logo-link" ) ;
attr _dev ( a0 , "href" , "/demos/xoracademy" ) ;
attr _dev ( a0 , "class" , "svelte-i1di9h" ) ;
add _location ( a0 , file$i , 109 , 9 , 1683 ) ;
add _location ( b0 , file$i , 109 , 6 , 1680 ) ;
attr _dev ( input , "placeholder" , "Search" ) ;
attr _dev ( input , "class" , "svelte-i1di9h" ) ;
add _location ( input , file$i , 110 , 6 , 1810 ) ;
attr _dev ( button0 , "class" , "svelte-i1di9h" ) ;
add _location ( button0 , file$i , 112 , 44 , 1894 ) ;
attr _dev ( a1 , "href" , "/demos/login" ) ;
attr _dev ( a1 , "class" , "svelte-i1di9h" ) ;
add _location ( a1 , file$i , 112 , 12 , 1862 ) ;
add _location ( li0 , file$i , 112 , 8 , 1858 ) ;
attr _dev ( a2 , "class" , "svelte-i1di9h" ) ;
add _location ( a2 , file$i , 113 , 12 , 1939 ) ;
add _location ( li1 , file$i , 113 , 8 , 1935 ) ;
add _location ( ul , file$i , 111 , 6 , 1845 ) ;
attr _dev ( nav , "class" , "svelte-i1di9h" ) ;
add _location ( nav , file$i , 108 , 4 , 1668 ) ;
attr _dev ( header , "class" , "svelte-i1di9h" ) ;
add _location ( header , file$i , 107 , 2 , 1655 ) ;
attr _dev ( img , "alt" , "Module Thumb" ) ;
if ( img . src !== ( img _src _value = holder ( 256 , 256 ) ) ) attr _dev ( img , "src" , img _src _value ) ;
add _location ( img , file$i , 120 , 6 , 2026 ) ;
attr _dev ( figure , "class" , "svelte-i1di9h" ) ;
add _location ( figure , file$i , 119 , 4 , 2011 ) ;
add _location ( button1 , file$i , 125 , 8 , 2121 ) ;
attr _dev ( p0 , "class" , "svelte-i1di9h" ) ;
add _location ( p0 , file$i , 124 , 6 , 2109 ) ;
add _location ( b1 , file$i , 129 , 8 , 2175 ) ;
add _location ( b2 , file$i , 129 , 25 , 2192 ) ;
attr _dev ( p1 , "class" , "svelte-i1di9h" ) ;
add _location ( p1 , file$i , 128 , 6 , 2163 ) ;
add _location ( h3 , file$i , 132 , 6 , 2233 ) ;
attr _dev ( p2 , "class" , "svelte-i1di9h" ) ;
add _location ( p2 , file$i , 133 , 6 , 2264 ) ;
attr _dev ( info , "class" , "svelte-i1di9h" ) ;
add _location ( info , file$i , 123 , 4 , 2096 ) ;
attr _dev ( profile , "class" , "svelte-i1di9h" ) ;
add _location ( profile , file$i , 118 , 2 , 1997 ) ;
attr _dev ( related _1 , "class" , "svelte-i1di9h" ) ;
add _location ( related _1 , file$i , 139 , 2 , 2428 ) ;
attr _dev ( posts _1 , "class" , "svelte-i1di9h" ) ;
add _location ( posts _1 , file$i , 147 , 2 , 2571 ) ;
attr _dev ( content , "class" , "svelte-i1di9h" ) ;
add _location ( content , file$i , 106 , 0 , 1643 ) ;
} ,
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 ) ;
}
insert _dev ( target , t19 , anchor ) ;
mount _component ( codeview , target , anchor ) ;
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 : function update ( ctx , [ dirty ] ) {
if ( dirty & /*holder*/ 0 ) {
each _value _1 = /*related*/ ctx [ 1 ] ;
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$3 ( ctx , each _value _1 , i ) ;
if ( each _blocks _1 [ i ] ) {
each _blocks _1 [ i ] . p ( child _ctx , dirty ) ;
} else {
each _blocks _1 [ i ] = create _each _block _1$3 ( child _ctx ) ;
each _blocks _1 [ i ] . c ( ) ;
each _blocks _1 [ i ] . m ( related _1 , null ) ;
}
}
for ( ; i < each _blocks _1 . length ; i += 1 ) {
each _blocks _1 [ i ] . d ( 1 ) ;
}
each _blocks _1 . length = each _value _1 . length ;
}
if ( dirty & /*holder*/ 0 ) {
each _value = /*posts*/ ctx [ 0 ] ;
validate _each _argument ( each _value ) ;
let i ;
for ( i = 0 ; i < each _value . length ; i += 1 ) {
const child _ctx = get _each _context$5 ( ctx , each _value , i ) ;
if ( each _blocks [ i ] ) {
each _blocks [ i ] . p ( child _ctx , dirty ) ;
} else {
each _blocks [ i ] = create _each _block$5 ( child _ctx ) ;
each _blocks [ i ] . c ( ) ;
each _blocks [ i ] . m ( posts _1 , null ) ;
}
}
for ( ; i < each _blocks . length ; i += 1 ) {
each _blocks [ i ] . d ( 1 ) ;
}
each _blocks . length = each _value . length ;
}
} ,
i : function intro ( local ) {
if ( current ) return ;
transition _in ( icon . $$ . fragment , local ) ;
transition _in ( codeview . $$ . fragment , local ) ;
current = true ;
} ,
o : function outro ( local ) {
transition _out ( icon . $$ . fragment , local ) ;
transition _out ( codeview . $$ . 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 ) ;
if ( detaching ) detach _dev ( t19 ) ;
destroy _component ( codeview , 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 ,
CodeView ,
posts ,
related ,
holder
} ) ;
$$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 ;
}
// (227: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 = holder ( 64 , 64 ) ) ) attr _dev ( img , "src" , img _src _value ) ;
attr _dev ( img , "class" , "svelte-9c6eed" ) ;
add _location ( img , file$j , 228 , 8 , 5002 ) ;
attr _dev ( h4 , "class" , "svelte-9c6eed" ) ;
add _location ( h4 , file$j , 230 , 8 , 5055 ) ;
attr _dev ( p , "class" , "svelte-9c6eed" ) ;
add _location ( p , file$j , 231 , 8 , 5077 ) ;
attr _dev ( nav , "id" , "vote-nav" ) ;
attr _dev ( nav , "class" , "svelte-9c6eed" ) ;
add _location ( nav , file$j , 232 , 8 , 5215 ) ;
attr _dev ( reply , "class" , "svelte-9c6eed" ) ;
add _location ( reply , file$j , 235 , 8 , 5323 ) ;
attr _dev ( info , "class" , "svelte-9c6eed" ) ;
add _location ( info , file$j , 229 , 8 , 5040 ) ;
attr _dev ( card , "class" , "svelte-9c6eed" ) ;
add _location ( card , file$j , 227 , 8 , 4987 ) ;
} ,
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 : "(227: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 t35 ;
let codeview ;
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 out = i => transition _out ( each _blocks [ i ] , 1 , 1 , ( ) => {
each _blocks [ i ] = null ;
} ) ;
codeview = new CodeView ( {
props : { source : "/code/XorAcademyWatch" } ,
$$inline : true
} ) ;
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 ( ) ;
}
t35 = space ( ) ;
create _component ( codeview . $$ . fragment ) ;
attr _dev ( a0 , "href" , "/demos/xoracademy" ) ;
attr _dev ( a0 , "class" , "svelte-9c6eed" ) ;
add _location ( a0 , file$j , 177 , 9 , 2703 ) ;
add _location ( b , file$j , 177 , 6 , 2700 ) ;
attr _dev ( input , "placeholder" , "Search" ) ;
attr _dev ( input , "class" , "svelte-9c6eed" ) ;
add _location ( input , file$j , 178 , 6 , 2815 ) ;
attr _dev ( button0 , "class" , "svelte-9c6eed" ) ;
add _location ( button0 , file$j , 180 , 44 , 2899 ) ;
attr _dev ( a1 , "href" , "/demos/login" ) ;
attr _dev ( a1 , "class" , "svelte-9c6eed" ) ;
add _location ( a1 , file$j , 180 , 12 , 2867 ) ;
add _location ( li0 , file$j , 180 , 8 , 2863 ) ;
attr _dev ( a2 , "class" , "svelte-9c6eed" ) ;
add _location ( a2 , file$j , 181 , 12 , 2944 ) ;
add _location ( li1 , file$j , 181 , 8 , 2940 ) ;
add _location ( ul , file$j , 179 , 6 , 2850 ) ;
attr _dev ( nav0 , "class" , "svelte-9c6eed" ) ;
add _location ( nav0 , file$j , 176 , 4 , 2688 ) ;
attr _dev ( header , "class" , "svelte-9c6eed" ) ;
add _location ( header , file$j , 175 , 2 , 2675 ) ;
if ( img0 . src !== ( img0 _src _value = holder ( 1280 , 720 ) ) ) attr _dev ( img0 , "src" , img0 _src _value ) ;
add _location ( img0 , file$j , 187 , 6 , 3027 ) ;
attr _dev ( a3 , "class" , "svelte-9c6eed" ) ;
add _location ( a3 , file$j , 189 , 8 , 3087 ) ;
attr _dev ( a4 , "class" , "svelte-9c6eed" ) ;
add _location ( a4 , file$j , 189 , 20 , 3099 ) ;
attr _dev ( p , "class" , "svelte-9c6eed" ) ;
add _location ( p , file$j , 190 , 8 , 3126 ) ;
add _location ( likes , file$j , 192 , 10 , 3183 ) ;
add _location ( video _buttons , file$j , 193 , 10 , 3226 ) ;
set _custom _element _data ( video _actions , "class" , "svelte-9c6eed" ) ;
add _location ( video _actions , file$j , 191 , 8 , 3157 ) ;
attr _dev ( figcaption , "class" , "svelte-9c6eed" ) ;
add _location ( figcaption , file$j , 188 , 6 , 3066 ) ;
add _location ( figure , file$j , 186 , 4 , 3012 ) ;
if ( img1 . src !== ( img1 _src _value = holder ( 64 , 64 ) ) ) attr _dev ( img1 , "src" , img1 _src _value ) ;
attr _dev ( img1 , "class" , "svelte-9c6eed" ) ;
add _location ( img1 , file$j , 207 , 8 , 3677 ) ;
attr _dev ( h4 , "class" , "svelte-9c6eed" ) ;
add _location ( h4 , file$j , 209 , 8 , 3730 ) ;
add _location ( subs , file$j , 210 , 8 , 3759 ) ;
attr _dev ( info , "class" , "svelte-9c6eed" ) ;
add _location ( info , file$j , 208 , 8 , 3715 ) ;
attr _dev ( card , "class" , "svelte-9c6eed" ) ;
add _location ( card , file$j , 206 , 8 , 3662 ) ;
attr _dev ( button1 , "id" , "subscribe" ) ;
attr _dev ( button1 , "class" , "svelte-9c6eed" ) ;
add _location ( button1 , file$j , 212 , 8 , 3809 ) ;
attr _dev ( nav1 , "class" , "svelte-9c6eed" ) ;
add _location ( nav1 , file$j , 205 , 6 , 3648 ) ;
attr _dev ( content0 , "class" , "svelte-9c6eed" ) ;
add _location ( content0 , file$j , 215 , 6 , 3871 ) ;
attr _dev ( promotion , "class" , "svelte-9c6eed" ) ;
add _location ( promotion , file$j , 204 , 6 , 3630 ) ;
attr _dev ( hr , "class" , "svelte-9c6eed" ) ;
add _location ( hr , file$j , 219 , 6 , 4796 ) ;
add _location ( span , file$j , 223 , 8 , 4839 ) ;
attr _dev ( sort , "class" , "svelte-9c6eed" ) ;
add _location ( sort , file$j , 223 , 34 , 4865 ) ;
attr _dev ( nav2 , "class" , "svelte-9c6eed" ) ;
add _location ( nav2 , file$j , 222 , 6 , 4825 ) ;
attr _dev ( comments , "class" , "svelte-9c6eed" ) ;
add _location ( comments , file$j , 221 , 6 , 4808 ) ;
attr _dev ( lower , "class" , "svelte-9c6eed" ) ;
add _location ( lower , file$j , 203 , 4 , 3616 ) ;
attr _dev ( main , "class" , "svelte-9c6eed" ) ;
add _location ( main , file$j , 185 , 2 , 3001 ) ;
attr _dev ( content1 , "class" , "svelte-9c6eed" ) ;
add _location ( content1 , file$j , 174 , 0 , 2663 ) ;
} ,
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 ) ;
}
insert _dev ( target , t35 , anchor ) ;
mount _component ( codeview , target , anchor ) ;
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 : function update ( ctx , [ dirty ] ) {
if ( dirty & /*holder*/ 0 ) {
each _value = /*cards*/ ctx [ 0 ] ;
validate _each _argument ( each _value ) ;
let i ;
for ( i = 0 ; i < each _value . length ; i += 1 ) {
const child _ctx = get _each _context$6 ( ctx , each _value , i ) ;
if ( each _blocks [ i ] ) {
each _blocks [ i ] . p ( child _ctx , dirty ) ;
transition _in ( each _blocks [ i ] , 1 ) ;
} else {
each _blocks [ i ] = create _each _block$6 ( child _ctx ) ;
each _blocks [ i ] . c ( ) ;
transition _in ( each _blocks [ i ] , 1 ) ;
each _blocks [ i ] . m ( comments , null ) ;
}
}
group _outros ( ) ;
for ( i = each _value . length ; i < each _blocks . length ; i += 1 ) {
out ( i ) ;
}
check _outros ( ) ;
}
} ,
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 ] ) ;
}
transition _in ( codeview . $$ . 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 ) ;
each _blocks = each _blocks . filter ( Boolean ) ;
for ( let i = 0 ; i < each _blocks . length ; i += 1 ) {
transition _out ( each _blocks [ i ] ) ;
}
transition _out ( codeview . $$ . fragment , local ) ;
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 ) ;
if ( detaching ) detach _dev ( t35 ) ;
destroy _component ( codeview , 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 , CodeView , cards , holder } ) ;
$$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 ;
let t12 ;
let codeview ;
let current ;
codeview = new CodeView ( {
props : { source : "/code/Login" } ,
$$inline : true
} ) ;
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" ) ;
t12 = space ( ) ;
create _component ( codeview . $$ . fragment ) ;
add _location ( spacer0 , file$k , 15 , 2 , 262 ) ;
add _location ( header , file$k , 17 , 4 , 293 ) ;
attr _dev ( label0 , "for" , "username" ) ;
add _location ( label0 , file$k , 18 , 4 , 320 ) ;
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 , 19 , 4 , 363 ) ;
attr _dev ( label1 , "for" , "password" ) ;
add _location ( label1 , file$k , 20 , 4 , 450 ) ;
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 , 21 , 4 , 493 ) ;
add _location ( br , file$k , 22 , 4 , 584 ) ;
attr _dev ( button , "type" , "submit" ) ;
add _location ( button , file$k , 23 , 4 , 593 ) ;
add _location ( form , file$k , 16 , 2 , 282 ) ;
add _location ( spacer1 , file$k , 25 , 2 , 642 ) ;
attr _dev ( content , "class" , "svelte-t7gl8c" ) ;
add _location ( content , file$k , 14 , 0 , 250 ) ;
} ,
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 ) ;
insert _dev ( target , t12 , anchor ) ;
mount _component ( codeview , target , anchor ) ;
current = true ;
} ,
p : noop ,
i : function intro ( local ) {
if ( current ) return ;
transition _in ( codeview . $$ . fragment , local ) ;
current = true ;
} ,
o : function outro ( local ) {
transition _out ( codeview . $$ . fragment , local ) ;
current = false ;
} ,
d : function destroy ( detaching ) {
if ( detaching ) detach _dev ( content ) ;
if ( detaching ) detach _dev ( t12 ) ;
destroy _component ( codeview , detaching ) ;
}
} ;
dispatch _dev ( "SvelteRegisterBlock" , {
block ,
id : create _fragment$l . name ,
type : "component" ,
source : "" ,
ctx
} ) ;
return block ;
}
function instance$l ( $$self , $$props , $$invalidate ) {
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 } ' ` ) ;
} ) ;
$$self . $capture _state = ( ) => ( { CodeView , holder } ) ;
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
} ) ;
}
}
/* src/demos/Tiles.svelte generated by Svelte v3.30.0 */
const file$l = "src/demos/Tiles.svelte" ;
function create _fragment$m ( ctx ) {
let content ;
let tile ;
let left ;
let img ;
let img _src _value ;
let t0 ;
let middle ;
let h4 ;
let t2 ;
let p ;
let t4 ;
let right ;
let button0 ;
let icon0 ;
let t5 ;
let button1 ;
let icon1 ;
let t6 ;
let codeview ;
let current ;
icon0 = new Icon ( {
props : {
name : "check-circle" ,
color : "var(--color-bg)" ,
size : "24"
} ,
$$inline : true
} ) ;
icon1 = new Icon ( {
props : {
name : "x-circle" ,
color : "var(--color-bg)" ,
size : "24"
} ,
$$inline : true
} ) ;
codeview = new CodeView ( {
props : { source : "/code/Tiles" } ,
$$inline : true
} ) ;
const block = {
c : function create ( ) {
content = element ( "content" ) ;
tile = element ( "tile" ) ;
left = element ( "left" ) ;
img = element ( "img" ) ;
t0 = space ( ) ;
middle = element ( "middle" ) ;
h4 = element ( "h4" ) ;
h4 . textContent = "Tile Example" ;
t2 = space ( ) ;
p = element ( "p" ) ;
p . textContent = "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua." ;
t4 = space ( ) ;
right = element ( "right" ) ;
button0 = element ( "button" ) ;
create _component ( icon0 . $$ . fragment ) ;
t5 = space ( ) ;
button1 = element ( "button" ) ;
create _component ( icon1 . $$ . fragment ) ;
t6 = space ( ) ;
create _component ( codeview . $$ . fragment ) ;
if ( img . src !== ( img _src _value = holder ( 48 , 48 ) ) ) attr _dev ( img , "src" , img _src _value ) ;
add _location ( img , file$l , 48 , 6 , 836 ) ;
add _location ( left , file$l , 47 , 4 , 823 ) ;
attr _dev ( h4 , "class" , "svelte-fwzpwr" ) ;
add _location ( h4 , file$l , 52 , 6 , 898 ) ;
add _location ( p , file$l , 55 , 6 , 942 ) ;
attr _dev ( middle , "class" , "svelte-fwzpwr" ) ;
add _location ( middle , file$l , 51 , 4 , 883 ) ;
attr _dev ( button0 , "class" , "svelte-fwzpwr" ) ;
add _location ( button0 , file$l , 59 , 4 , 1104 ) ;
attr _dev ( button1 , "class" , "svelte-fwzpwr" ) ;
add _location ( button1 , file$l , 60 , 4 , 1188 ) ;
attr _dev ( right , "class" , "svelte-fwzpwr" ) ;
add _location ( right , file$l , 58 , 4 , 1092 ) ;
attr _dev ( tile , "class" , "svelte-fwzpwr" ) ;
add _location ( tile , file$l , 46 , 2 , 812 ) ;
attr _dev ( content , "class" , "svelte-fwzpwr" ) ;
add _location ( content , file$l , 45 , 0 , 800 ) ;
} ,
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 , tile ) ;
append _dev ( tile , left ) ;
append _dev ( left , img ) ;
append _dev ( tile , t0 ) ;
append _dev ( tile , middle ) ;
append _dev ( middle , h4 ) ;
append _dev ( middle , t2 ) ;
append _dev ( middle , p ) ;
append _dev ( tile , t4 ) ;
append _dev ( tile , right ) ;
append _dev ( right , button0 ) ;
mount _component ( icon0 , button0 , null ) ;
append _dev ( right , t5 ) ;
append _dev ( right , button1 ) ;
mount _component ( icon1 , button1 , null ) ;
insert _dev ( target , t6 , anchor ) ;
mount _component ( codeview , target , anchor ) ;
current = true ;
} ,
p : noop ,
i : function intro ( local ) {
if ( current ) return ;
transition _in ( icon0 . $$ . fragment , local ) ;
transition _in ( icon1 . $$ . fragment , local ) ;
transition _in ( codeview . $$ . fragment , local ) ;
current = true ;
} ,
o : function outro ( local ) {
transition _out ( icon0 . $$ . fragment , local ) ;
transition _out ( icon1 . $$ . fragment , local ) ;
transition _out ( codeview . $$ . fragment , local ) ;
current = false ;
} ,
d : function destroy ( detaching ) {
if ( detaching ) detach _dev ( content ) ;
destroy _component ( icon0 ) ;
destroy _component ( icon1 ) ;
if ( detaching ) detach _dev ( t6 ) ;
destroy _component ( codeview , detaching ) ;
}
} ;
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 ( "Tiles" , slots , [ ] ) ;
const writable _props = [ ] ;
Object . keys ( $$props ) . forEach ( key => {
if ( ! ~ writable _props . indexOf ( key ) && key . slice ( 0 , 2 ) !== "$$" ) console . warn ( ` <Tiles> was created with unknown prop ' ${ key } ' ` ) ;
} ) ;
$$self . $capture _state = ( ) => ( { CodeView , Icon , holder } ) ;
return [ ] ;
}
class Tiles$1 extends SvelteComponentDev {
constructor ( options ) {
super ( options ) ;
init ( this , options , instance$m , create _fragment$m , safe _not _equal , { } ) ;
dispatch _dev ( "SvelteRegisterComponent" , {
component : this ,
tagName : "Tiles" ,
options ,
id : create _fragment$m . name
} ) ;
}
}
/* src/demos/Cards.svelte generated by Svelte v3.30.0 */
const file$m = "src/demos/Cards.svelte" ;
function create _fragment$n ( ctx ) {
let content ;
let card ;
let top ;
let img ;
let img _src _value ;
let t0 ;
let middle ;
let h4 ;
let t2 ;
let p ;
let t4 ;
let bottom ;
let button0 ;
let icon0 ;
let t5 ;
let button1 ;
let icon1 ;
let t6 ;
let codeview ;
let current ;
icon0 = new Icon ( {
props : {
name : "check-circle" ,
color : "var(--color-bg)" ,
size : "24"
} ,
$$inline : true
} ) ;
icon1 = new Icon ( {
props : {
name : "x-circle" ,
color : "var(--color-bg)" ,
size : "24"
} ,
$$inline : true
} ) ;
codeview = new CodeView ( {
props : { source : "/code/Cards" } ,
$$inline : true
} ) ;
const block = {
c : function create ( ) {
content = element ( "content" ) ;
card = element ( "card" ) ;
top = element ( "top" ) ;
img = element ( "img" ) ;
t0 = space ( ) ;
middle = element ( "middle" ) ;
h4 = element ( "h4" ) ;
h4 . textContent = "Card Example" ;
t2 = space ( ) ;
p = element ( "p" ) ;
p . textContent = "Lorem ipsum dolor sit amet, consectetur\n adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua." ;
t4 = space ( ) ;
bottom = element ( "bottom" ) ;
button0 = element ( "button" ) ;
create _component ( icon0 . $$ . fragment ) ;
t5 = space ( ) ;
button1 = element ( "button" ) ;
create _component ( icon1 . $$ . fragment ) ;
t6 = space ( ) ;
create _component ( codeview . $$ . fragment ) ;
if ( img . src !== ( img _src _value = holder ( 16 * 30 , 9 * 30 ) ) ) attr _dev ( img , "src" , img _src _value ) ;
attr _dev ( img , "class" , "svelte-s80h8" ) ;
add _location ( img , file$m , 50 , 6 , 782 ) ;
add _location ( top , file$m , 49 , 4 , 770 ) ;
attr _dev ( h4 , "class" , "svelte-s80h8" ) ;
add _location ( h4 , file$m , 54 , 6 , 852 ) ;
add _location ( p , file$m , 57 , 6 , 896 ) ;
attr _dev ( middle , "class" , "svelte-s80h8" ) ;
add _location ( middle , file$m , 53 , 4 , 837 ) ;
attr _dev ( button0 , "class" , "svelte-s80h8" ) ;
add _location ( button0 , file$m , 62 , 4 , 1065 ) ;
attr _dev ( button1 , "class" , "svelte-s80h8" ) ;
add _location ( button1 , file$m , 63 , 4 , 1149 ) ;
attr _dev ( bottom , "class" , "svelte-s80h8" ) ;
add _location ( bottom , file$m , 61 , 4 , 1052 ) ;
attr _dev ( card , "class" , "svelte-s80h8" ) ;
add _location ( card , file$m , 48 , 2 , 759 ) ;
attr _dev ( content , "class" , "svelte-s80h8" ) ;
add _location ( content , file$m , 47 , 0 , 747 ) ;
} ,
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 , card ) ;
append _dev ( card , top ) ;
append _dev ( top , img ) ;
append _dev ( card , t0 ) ;
append _dev ( card , middle ) ;
append _dev ( middle , h4 ) ;
append _dev ( middle , t2 ) ;
append _dev ( middle , p ) ;
append _dev ( card , t4 ) ;
append _dev ( card , bottom ) ;
append _dev ( bottom , button0 ) ;
mount _component ( icon0 , button0 , null ) ;
append _dev ( bottom , t5 ) ;
append _dev ( bottom , button1 ) ;
mount _component ( icon1 , button1 , null ) ;
insert _dev ( target , t6 , anchor ) ;
mount _component ( codeview , target , anchor ) ;
current = true ;
} ,
p : noop ,
i : function intro ( local ) {
if ( current ) return ;
transition _in ( icon0 . $$ . fragment , local ) ;
transition _in ( icon1 . $$ . fragment , local ) ;
transition _in ( codeview . $$ . fragment , local ) ;
current = true ;
} ,
o : function outro ( local ) {
transition _out ( icon0 . $$ . fragment , local ) ;
transition _out ( icon1 . $$ . fragment , local ) ;
transition _out ( codeview . $$ . fragment , local ) ;
current = false ;
} ,
d : function destroy ( detaching ) {
if ( detaching ) detach _dev ( content ) ;
destroy _component ( icon0 ) ;
destroy _component ( icon1 ) ;
if ( detaching ) detach _dev ( t6 ) ;
destroy _component ( codeview , detaching ) ;
}
} ;
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 ( "Cards" , slots , [ ] ) ;
const writable _props = [ ] ;
Object . keys ( $$props ) . forEach ( key => {
if ( ! ~ writable _props . indexOf ( key ) && key . slice ( 0 , 2 ) !== "$$" ) console . warn ( ` <Cards> was created with unknown prop ' ${ key } ' ` ) ;
} ) ;
$$self . $capture _state = ( ) => ( { CodeView , Icon , holder } ) ;
return [ ] ;
}
class Cards extends SvelteComponentDev {
constructor ( options ) {
super ( options ) ;
init ( this , options , instance$n , create _fragment$n , safe _not _equal , { } ) ;
dispatch _dev ( "SvelteRegisterComponent" , {
component : this ,
tagName : "Cards" ,
options ,
id : create _fragment$n . name
} ) ;
}
}
var routes = {
"/" : Home ,
"/about" : About ,
"/demos" : Demos ,
"/demos/login" : Login$1 ,
"/demos/tiles" : Tiles$1 ,
"/demos/cards" : Cards ,
"/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$n = "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$n , 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$2 ( 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$n , 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$2 . name ,
type : "if" ,
source : "(22:0) {#if theme == 'dark'}" ,
ctx
} ) ;
return block ;
}
function create _fragment$o ( ctx ) {
let current _block _type _index ;
let if _block ;
let if _block _anchor ;
let current ;
const if _block _creators = [ create _if _block$2 , 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$o . name ,
type : "component" ,
source : "" ,
ctx
} ) ;
return block ;
}
function instance$o ( $$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$o , create _fragment$o , safe _not _equal , { theme : 0 } ) ;
dispatch _dev ( "SvelteRegisterComponent" , {
component : this ,
tagName : "Darkmode" ,
options ,
id : create _fragment$o . 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$o = "src/App.svelte" ;
function create _fragment$p ( ctx ) {
let header ;
let nav0 ;
let a0 ;
let icon0 ;
let link _action ;
let t0 ;
let ul0 ;
let li0 ;
let a1 ;
let link _action _1 ;
let t2 ;
let li1 ;
let a2 ;
let link _action _2 ;
let t4 ;
let main ;
let router ;
let t5 ;
let hr ;
let t6 ;
let footer ;
let nav1 ;
let a3 ;
let p ;
let link _action _3 ;
let t8 ;
let ul1 ;
let li2 ;
let icon1 ;
let t9 ;
let li3 ;
let icon2 ;
let t10 ;
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 ( ) {
header = element ( "header" ) ;
nav0 = element ( "nav" ) ;
a0 = element ( "a" ) ;
create _component ( icon0 . $$ . fragment ) ;
t0 = space ( ) ;
ul0 = element ( "ul" ) ;
li0 = element ( "li" ) ;
a1 = element ( "a" ) ;
a1 . textContent = "Demos" ;
t2 = space ( ) ;
li1 = element ( "li" ) ;
a2 = element ( "a" ) ;
a2 . textContent = "About" ;
t4 = space ( ) ;
main = element ( "main" ) ;
create _component ( router . $$ . fragment ) ;
t5 = space ( ) ;
hr = element ( "hr" ) ;
t6 = space ( ) ;
footer = element ( "footer" ) ;
nav1 = element ( "nav" ) ;
a3 = element ( "a" ) ;
p = element ( "p" ) ;
p . textContent = "Copyright (C) Big Corp." ;
t8 = space ( ) ;
ul1 = element ( "ul" ) ;
li2 = element ( "li" ) ;
create _component ( icon1 . $$ . fragment ) ;
t9 = space ( ) ;
li3 = element ( "li" ) ;
create _component ( icon2 . $$ . fragment ) ;
t10 = space ( ) ;
li4 = element ( "li" ) ;
create _component ( darkmode . $$ . fragment ) ;
attr _dev ( a0 , "href" , "/" ) ;
add _location ( a0 , file$o , 28 , 4 , 423 ) ;
attr _dev ( a1 , "href" , "/demos" ) ;
add _location ( a1 , file$o , 32 , 10 , 513 ) ;
add _location ( li0 , file$o , 32 , 6 , 509 ) ;
attr _dev ( a2 , "href" , "/about" ) ;
add _location ( a2 , file$o , 33 , 10 , 564 ) ;
add _location ( li1 , file$o , 33 , 6 , 560 ) ;
add _location ( ul0 , file$o , 31 , 4 , 498 ) ;
add _location ( nav0 , file$o , 27 , 2 , 413 ) ;
attr _dev ( header , "class" , "svelte-khlxmc" ) ;
add _location ( header , file$o , 26 , 0 , 402 ) ;
attr _dev ( main , "class" , "svelte-khlxmc" ) ;
add _location ( main , file$o , 38 , 0 , 635 ) ;
add _location ( hr , file$o , 42 , 0 , 702 ) ;
add _location ( p , file$o , 46 , 6 , 756 ) ;
attr _dev ( a3 , "href" , "/" ) ;
add _location ( a3 , file$o , 45 , 4 , 728 ) ;
add _location ( li2 , file$o , 49 , 6 , 811 ) ;
add _location ( li3 , file$o , 50 , 6 , 860 ) ;
add _location ( li4 , file$o , 51 , 6 , 911 ) ;
add _location ( ul1 , file$o , 48 , 4 , 800 ) ;
attr _dev ( nav1 , "class" , "svelte-khlxmc" ) ;
add _location ( nav1 , file$o , 44 , 2 , 718 ) ;
attr _dev ( footer , "class" , "svelte-khlxmc" ) ;
add _location ( footer , file$o , 43 , 0 , 707 ) ;
} ,
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 , header , anchor ) ;
append _dev ( header , nav0 ) ;
append _dev ( nav0 , a0 ) ;
mount _component ( icon0 , a0 , null ) ;
append _dev ( nav0 , t0 ) ;
append _dev ( nav0 , ul0 ) ;
append _dev ( ul0 , li0 ) ;
append _dev ( li0 , a1 ) ;
append _dev ( ul0 , t2 ) ;
append _dev ( ul0 , li1 ) ;
append _dev ( li1 , a2 ) ;
insert _dev ( target , t4 , anchor ) ;
insert _dev ( target , main , anchor ) ;
mount _component ( router , main , null ) ;
insert _dev ( target , t5 , anchor ) ;
insert _dev ( target , hr , anchor ) ;
insert _dev ( target , t6 , anchor ) ;
insert _dev ( target , footer , anchor ) ;
append _dev ( footer , nav1 ) ;
append _dev ( nav1 , a3 ) ;
append _dev ( a3 , p ) ;
append _dev ( nav1 , t8 ) ;
append _dev ( nav1 , ul1 ) ;
append _dev ( ul1 , li2 ) ;
mount _component ( icon1 , li2 , null ) ;
append _dev ( ul1 , t9 ) ;
append _dev ( ul1 , li3 ) ;
mount _component ( icon2 , li3 , null ) ;
append _dev ( ul1 , t10 ) ;
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 ( header ) ;
destroy _component ( icon0 ) ;
if ( detaching ) detach _dev ( t4 ) ;
if ( detaching ) detach _dev ( main ) ;
destroy _component ( router ) ;
if ( detaching ) detach _dev ( t5 ) ;
if ( detaching ) detach _dev ( hr ) ;
if ( detaching ) detach _dev ( t6 ) ;
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$p . name ,
type : "component" ,
source : "" ,
ctx
} ) ;
return block ;
}
function instance$p ( $$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$p , create _fragment$p , safe _not _equal , { } ) ;
dispatch _dev ( "SvelteRegisterComponent" , {
component : this ,
tagName : "App" ,
options ,
id : create _fragment$p . name
} ) ;
}
}
const app = new App ( {
target : document . body ,
props : {
name : 'world'
}
} ) ;
return app ;
} ( ) ) ;
//# sourceMappingURL=bundle.js.map