#Tag
Log in
Kila
Kila
@greene@wandering.shop  ·  activity timestamp 21 hours ago
Two gray/brown tabby kittens on the floor in a veterinary exam room. One of the kittens is on his back and keeps flipping over and over while batting at the other kitten, who finally pounces right at the end of the video.
screwlisp
screwlisp
@screwlisp@gamerplus.org  ·  activity timestamp 6 days ago
Aral Balkan
Aral Balkan
@aral@mastodon.ar.al  ·  activity timestamp last week
Gert V 🇵🇸 and 1 other boosted
Aral Balkan
Aral Balkan
@aral@mastodon.ar.al  ·  activity timestamp 3 weeks ago
Aral Balkan
Aral Balkan
@aral@mastodon.ar.al  ·  activity timestamp 2 weeks ago
Aral Balkan
Aral Balkan
@aral@mastodon.ar.al  ·  activity timestamp 2 weeks ago
Aral Balkan
Aral Balkan
@aral@mastodon.ar.al  ·  activity timestamp 2 weeks ago
Aral Balkan
Aral Balkan
@aral@mastodon.ar.al  ·  activity timestamp 3 weeks ago
Aral Balkan
Aral Balkan
@aral@mastodon.ar.al  ·  activity timestamp 3 weeks ago
Screenshot of code (the <${TeamSchedule.connectedTo(this)} /> line is highlighted): export default class InterviewsPage extends kitten.Page { html () { const today = db.calendar.today const futureDays = db.calendar.futureDays const pastDays = db.calendar.pastDays return kitten.html` <${MainLayout} page='/admin/interviews/'> <h2>Interviews</h2> <${SignUpsSwitch.connectedTo(this)} /> <${InternalNav} /> <${TeamSchedule.connectedTo(this)} /> <h3 id='today'>Today</h3> <if ${today !== undefined}> <then>
Screenshot of code (the <${TeamSchedule.connectedTo(this)} /> line is highlighted): export default class InterviewsPage extends kitten.Page { html () { const today = db.calendar.today const futureDays = db.calendar.futureDays const pastDays = db.calendar.pastDays return kitten.html` <${MainLayout} page='/admin/interviews/'> <h2>Interviews</h2> <${SignUpsSwitch.connectedTo(this)} /> <${InternalNav} /> <${TeamSchedule.connectedTo(this)} /> <h3 id='today'>Today</h3> <if ${today !== undefined}> <then>
Screenshot of code (the <${TeamSchedule.connectedTo(this)} /> line is highlighted): export default class InterviewsPage extends kitten.Page { html () { const today = db.calendar.today const futureDays = db.calendar.futureDays const pastDays = db.calendar.pastDays return kitten.html` <${MainLayout} page='/admin/interviews/'> <h2>Interviews</h2> <${SignUpsSwitch.connectedTo(this)} /> <${InternalNav} /> <${TeamSchedule.connectedTo(this)} /> <h3 id='today'>Today</h3> <if ${today !== undefined}> <then>
Screenshot of code, continuation of the same class, starting with the end of the html() method from the previous screenshot and going till the end of the class (the table[inert] style and the onToggle() method are highlighted: <style> table[inert] { opacity: 0.9; filter: grayscale(100%); } </style> </table> </section> ` } onToggle () { this.editable = !this.editable console.log(this.editable) this.update() } }
Screenshot of code, continuation of the same class, starting with the end of the html() method from the previous screenshot and going till the end of the class (the table[inert] style and the onToggle() method are highlighted: <style> table[inert] { opacity: 0.9; filter: grayscale(100%); } </style> </table> </section> ` } onToggle () { this.editable = !this.editable console.log(this.editable) this.update() } }
Screenshot of code, continuation of the same class, starting with the end of the html() method from the previous screenshot and going till the end of the class (the table[inert] style and the onToggle() method are highlighted: <style> table[inert] { opacity: 0.9; filter: grayscale(100%); } </style> </table> </section> ` } onToggle () { this.editable = !this.editable console.log(this.editable) this.update() } }
Screenshot of code (the lines editable=false and the button tag code are highlighted): class TeamSchedule extends kitten.Component { editable = false html () { return kitten.html` <section> <h3>Team schedule</h3> <button name='toggle' connect >${this.editable ? 'Lock' : 'Unlock to edit'}</button> <table id='team-schedule' ${this.editable ? '' : 'inert'}> <caption id='caption'> <markdown> Shows which team members will be present on calls on which days. </markdown>
Screenshot of code (the lines editable=false and the button tag code are highlighted): class TeamSchedule extends kitten.Component { editable = false html () { return kitten.html` <section> <h3>Team schedule</h3> <button name='toggle' connect >${this.editable ? 'Lock' : 'Unlock to edit'}</button> <table id='team-schedule' ${this.editable ? '' : 'inert'}> <caption id='caption'> <markdown> Shows which team members will be present on calls on which days. </markdown>
Screenshot of code (the lines editable=false and the button tag code are highlighted): class TeamSchedule extends kitten.Component { editable = false html () { return kitten.html` <section> <h3>Team schedule</h3> <button name='toggle' connect >${this.editable ? 'Lock' : 'Unlock to edit'}</button> <table id='team-schedule' ${this.editable ? '' : 'inert'}> <caption id='caption'> <markdown> Shows which team members will be present on calls on which days. </markdown>
GIF
GIF
Screen capture of the Team schedule interface from the Gaza Verified admin site. It is a table of names and days (Aral, Casey, Joy, Aseel, Fabio And Mondays … Fridays) with checkboxes at each name/day pair. It starts out greyed out. The Unlock to edit button is clicked and the interface comes alive (opacity returns to full and the checkboxes become green and clickable). The person toggles a few checkboxes and clicks the Lock button to lock the interface again and then repeats the process to undo the changes they just made.
Screen capture of the Team schedule interface from the Gaza Verified admin site. It is a table of names and days (Aral, Casey, Joy, Aseel, Fabio And Mondays … Fridays) with checkboxes at each name/day pair. It starts out greyed out. The Unlock to edit button is clicked and the interface comes alive (opacity returns to full and the checkboxes become green and clickable). The person toggles a few checkboxes and clicks the Lock button to lock the interface again and then repeats the process to undo the changes they just made.
Aral Balkan
Aral Balkan
@aral@mastodon.ar.al  ·  activity timestamp 3 weeks ago
Aral Balkan
Aral Balkan
@aral@mastodon.ar.al  ·  activity timestamp 3 weeks ago
Aral Balkan
Aral Balkan
@aral@mastodon.ar.al  ·  activity timestamp 3 weeks ago
Aral Balkan
Aral Balkan
@aral@mastodon.ar.al  ·  activity timestamp 4 weeks ago
Screenshot of the Kitten shell open in terminal for the currently-running site: > kitten.db.accounts.findAccountWithHandle('@aral@mastodon.ar.al') Proxy [ Account { id: 'ce4c1f2c-2044-47a0-b97e-1bc1a43bfc07', url: 'https://mastodon.ar.al/@aral', isVerified: true, data: Proxy [ [Object], [Object] ], isScheduled: false, joinPageIp: undefined, privatePageIps: Proxy [ [Array], [Object] ], isTeam: false, callDays: Proxy [ [Array], [Object] ] } get: [Function: bound getHandler], set: [Function: bound setHandler], defineProperty: [Function: bound definePropertyHandler], deleteProperty: [Function: bound deletePropertyHandler] } ] > kitten.db.calendar.scheduleInterview(kitten.db.accounts.findAccountWithHandle('@aral@mastodon.ar.al').id)
Screenshot of the Kitten shell open in terminal for the currently-running site: > kitten.db.accounts.findAccountWithHandle('@aral@mastodon.ar.al') Proxy [ Account { id: 'ce4c1f2c-2044-47a0-b97e-1bc1a43bfc07', url: 'https://mastodon.ar.al/@aral', isVerified: true, data: Proxy [ [Object], [Object] ], isScheduled: false, joinPageIp: undefined, privatePageIps: Proxy [ [Array], [Object] ], isTeam: false, callDays: Proxy [ [Array], [Object] ] } get: [Function: bound getHandler], set: [Function: bound setHandler], defineProperty: [Function: bound definePropertyHandler], deleteProperty: [Function: bound deletePropertyHandler] } ] > kitten.db.calendar.scheduleInterview(kitten.db.accounts.findAccountWithHandle('@aral@mastodon.ar.al').id)
Screenshot of the Kitten shell open in terminal for the currently-running site: > kitten.db.accounts.findAccountWithHandle('@aral@mastodon.ar.al') Proxy [ Account { id: 'ce4c1f2c-2044-47a0-b97e-1bc1a43bfc07', url: 'https://mastodon.ar.al/@aral', isVerified: true, data: Proxy [ [Object], [Object] ], isScheduled: false, joinPageIp: undefined, privatePageIps: Proxy [ [Array], [Object] ], isTeam: false, callDays: Proxy [ [Array], [Object] ] } get: [Function: bound getHandler], set: [Function: bound setHandler], defineProperty: [Function: bound definePropertyHandler], deleteProperty: [Function: bound deletePropertyHandler] } ] > kitten.db.calendar.scheduleInterview(kitten.db.accounts.findAccountWithHandle('@aral@mastodon.ar.al').id)