Calendar NTP

joystmp

There is a chrome extension that I have grown to love. It shows a simple calender on NTP, allowing me to focus on my work and not get distracted.

Here is a screenshot

However, I have some reservations regarding entering personal data and possible misuse of that data by the extension developer.

I want to request if Orion would develop such a feature.

Vlad

joystmp Would you create one in pure javascript and Kagi assistant? then upload it to a website and make it your start page? Once you are done with it and it works let me know and I will take a look.

joystmp

Vlad

This is what I've achieved https://jsbin.com/furesoculi. The website is

dynamic (should look good on desktop and mobile)
has dark and light mode
use localStorage for persistent storage

The prompt is given below.

Provide a code containing html, css and javascript for a website that utilises full page to show current month with all dates and highlights current date. The remaining spaces should be filled with dates of preceding/next month. There should be arrow button at top to show previous and next month endlessly and should be placed at 25% and 75% mark witin the month row. Add 2% padding on all sides of page. Each date should allow typing within the date box and storing text in persistent storage which does not get removed on page refresh. Make the month header row smaller. Add a slight tint to weekends. The website should be dynamic and should look beautiful and elegant irrespective of screen dimensions. Use atleast 1rem font size. Adjust the size of text boxes so that entire visible is visible without any need of scrolling. Show dates at top right. Add a sun and moon icon at top right to shift between light and dark mode. Use apple system font for all text and add a few popular fonts as backup. Make the month text bold. Make extensive use of apple design guidelines.
!<

calendarhtml.zip

3kB

joystmp

Here a better, more cleaner, Applesque design https://jsbin.com/quqegubape