Custom dashboard widgets

nomadic

@3dvs Think it should probably be possible to encapsulate it in an HTML file fairly easily. Only thing I would be worried about is how local storage is handled with dashboard widgets, but figure it probably won't be an issue.

Maybe Vivaldi could even get in contact with ZenQuotes to create an official widget of their own. They are fine with my free usage with attribution, but think Vivaldi's usage would probably require more.

I probably won't have a new dashboard version done for awhile. My laptop died a little over a week ago, so I have been using an old desktop pc. It has a lot of quirks that make me not really want to set up my development tools or write code on it.

Might get enough of a gap in other projects and/or enough motivation to do it sooner, but I won't promise anything.

Hopefully I will be able to get a new laptop soon. The likely model I am looking at should hopefully be released in November. New generation CPUs were launched not too long ago, so I want to wait to get a laptop with one of those or see if the discounts on last gen models are enticing enough.

luetage

@luetage New release for the APOD widget. I rewrote the original post with instructions. Went a bit overboard with this ^^

WildEnte

@luetage admit it, you are actually a space nerd and have found the perfect way to combine that passion with your Vivaldi hobby
This is awesome

jimmynewtron

@luetage Do you have a clock widget?

tam710562

@luetage You can also add a Data URLs of an html file
Here is an example

data:text/html;base64,PGh0bWw+DQogIDxoZWFkPg0KICAgIDx0aXRsZT5DbG9jazwvdGl0bGU+DQogICAgPHN0eWxlPg0KICAgICAgOnJvb3Qgew0KICAgICAgICAtLW1haW4tYmctY29sb3I6ICMxZTFmMjY7DQogICAgICAgIC0tbWFpbi10ZXh0LWNvbG9yOiAjY2NjOw0KICAgICAgfQ0KICAgICAgKiB7DQogICAgICAgIGJveC1zaXppbmc6IGJvcmRlci1ib3g7DQogICAgICB9DQogICAgICBib2R5IHsNCiAgICAgICAgbWFyZ2luOiAwOw0KICAgICAgICBoZWlnaHQ6IDEwMHZoOw0KICAgICAgICBkaXNwbGF5OiBmbGV4Ow0KICAgICAgICBmbGV4LWRpcmVjdGlvbjogY29sdW1uOw0KICAgICAgICBqdXN0aWZ5LWNvbnRlbnQ6IHNwYWNlLWJldHdlZW47DQogICAgICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7DQogICAgICAgIGZvbnQtc2l6ZTogMTZweDsNCiAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tbWFpbi1iZy1jb2xvcik7DQogICAgICAgIHBvc2l0aW9uOiByZWxhdGl2ZTsNCiAgICAgICAgdHJhbnNpdGlvbjogYWxsIGVhc2UgMC4yczsNCiAgICAgIH0NCiAgICAgIC5jbG9jayB7DQogICAgICAgIG1hcmdpbjogMjBweDsNCiAgICAgICAgaGVpZ2h0OiBjYWxjKG1pbigxMDB2dywgMTAwdmgpIC0gNDBweCk7DQogICAgICAgIHdpZHRoOiBjYWxjKG1pbigxMDB2dywgMTAwdmgpIC0gNDBweCk7DQogICAgICAgIGRpc3BsYXk6IGZsZXg7DQogICAgICAgIGp1c3RpZnktY29udGVudDogY2VudGVyOw0KICAgICAgICBhbGlnbi1pdGVtczogY2VudGVyOw0KICAgICAgICBiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1tYWluLWJnLWNvbG9yKTsNCiAgICAgICAgYmFja2dyb3VuZC1pbWFnZTogdXJsKCJkYXRhOmltYWdlL3BuZztiYXNlNjQsaVZCT1J3MEtHZ29BQUFBTlNVaEVVZ0FBQVpBQUFBR1FDQVlBQUFDQXZ6Yk1BQUFBR1hSRldIUlRiMlowZDJGeVpRQkJaRzlpWlNCSmJXRm5aVkpsWVdSNWNjbGxQQUFBQXlacFZGaDBXRTFNT21OdmJTNWhaRzlpWlM1NGJYQUFBQUFBQUR3L2VIQmhZMnRsZENCaVpXZHBiajBpNzd1L0lpQnBaRDBpVnpWTk1FMXdRMlZvYVVoNmNtVlRlazVVWTNwcll6bGtJajgrSUR4NE9uaHRjRzFsZEdFZ2VHMXNibk02ZUQwaVlXUnZZbVU2Ym5NNmJXVjBZUzhpSUhnNmVHMXdkR3M5SWtGa2IySmxJRmhOVUNCRGIzSmxJRFV1Tmkxak1EWTNJRGM1TGpFMU56YzBOeXdnTWpBeE5TOHdNeTh6TUMweU16bzBNRG8wTWlBZ0lDQWdJQ0FnSWo0Z1BISmtaanBTUkVZZ2VHMXNibk02Y21SbVBTSm9kSFJ3T2k4dmQzZDNMbmN6TG05eVp5OHhPVGs1THpBeUx6SXlMWEprWmkxemVXNTBZWGd0Ym5NaklqNGdQSEprWmpwRVpYTmpjbWx3ZEdsdmJpQnlaR1k2WVdKdmRYUTlJaUlnZUcxc2JuTTZlRzF3UFNKb2RIUndPaTh2Ym5NdVlXUnZZbVV1WTI5dEwzaGhjQzh4TGpBdklpQjRiV3h1Y3pwNGJYQk5UVDBpYUhSMGNEb3ZMMjV6TG1Ga2IySmxMbU52YlM5NFlYQXZNUzR3TDIxdEx5SWdlRzFzYm5NNmMzUlNaV1k5SW1oMGRIQTZMeTl1Y3k1aFpHOWlaUzVqYjIwdmVHRndMekV1TUM5elZIbHdaUzlTWlhOdmRYSmpaVkpsWmlNaUlIaHRjRHBEY21WaGRHOXlWRzl2YkQwaVFXUnZZbVVnVUdodmRHOXphRzl3SUVORElESXdNVFVnS0ZkcGJtUnZkM01wSWlCNGJYQk5UVHBKYm5OMFlXNWpaVWxFUFNKNGJYQXVhV2xrT2pRd01rTTJOa0UxUmpORFJqRXhSVGxDUXpoR1JrWkdOelpGUkRFMFJURkRJaUI0YlhCTlRUcEViMk4xYldWdWRFbEVQU0o0YlhBdVpHbGtPalF3TWtNMk5rRTJSak5EUmpFeFJUbENRemhHUmtaR056WkZSREUwUlRGRElqNGdQSGh0Y0UxTk9rUmxjbWwyWldSR2NtOXRJSE4wVW1WbU9tbHVjM1JoYm1ObFNVUTlJbmh0Y0M1cGFXUTZOREF5UXpZMlFUTkdNME5HTVRGRk9VSkRPRVpHUmtZM05rVkVNVFJGTVVNaUlITjBVbVZtT21SdlkzVnRaVzUwU1VROUluaHRjQzVrYVdRNk5EQXlRelkyUVRSR00wTkdNVEZGT1VKRE9FWkdSa1kzTmtWRU1UUkZNVU1pTHo0Z1BDOXlaR1k2UkdWelkzSnBjSFJwYjI0K0lEd3ZjbVJtT2xKRVJqNGdQQzk0T25odGNHMWxkR0UrSUR3L2VIQmhZMnRsZENCbGJtUTlJbklpUHo2ZE56VFdBQUFUK1VsRVFWUjQydXpkRFl5a2RYMEg4R2YxZUtrYXlvS2t0YnkwM1NzTk5ZYWszTm0wUW11d2U1YVVnbGpjcTlTV3hvaTNCZWxMYU10T0NsWUJnVGtvYlVTaTNpb1JpdGg0UjBDeHRLYTNLRlpzdGR4QzdRdVZCdGRFMGRRVTcweHJDY2pCOVBkbi9rT0h1V2YyN1c1dm5wbm44MG0rMmIzWlhiajc3OHovKy95ZnR4bHJ0Vm9GQUt6VWl3d0JBQW9FQUFVQ2dBSUJRSUVBZ0FJQlFJRUFvRUFBVUNBQUtCQUFVQ0FBS0JBQUZBZ0FDZ1FBQlFJQUNnUUFCUUtBQWdGQWdRQ2dRQUJBZ1FDZ1FBQlFJQUFvRUFBVUNBQW9FQUFVQ0FBS0JBQUZBa0E5clRNRWpMcEdvN0VsUG93djhpMTdJck9MZkQzOTdGVE9aTS9YNWlOejZlZWJ6ZWFDMGFaT3hscXRsbEZnMUF0a1o4bkUzeTBWd0tZK1gwcy90MzJKQW5yK2Z4VWxzdFdJVXhkMllVRi9hY1d4YzVubGtUU2pySnFHRFFVQzlUWVIyYmFLbjV1SkVwazBmQ2dRcUsrWmtwVkhPbFl5SFZtZk01MGY2N1hGOEZFSGpvRlFLM2wxc0xQbjRiSmpJTHQ3Q21SUC9wNzVudS9iRU5sVjhyODZxdGxzN2pIaVdJRkF2VXlXckQ1MmxKUkhFU1V4WC9aNExoWlFJRkF6WlpQLy9DTGZQMi9JcUNQWGdVQjVJVFI2SHB0YjVQdkhEUmtLQk9pVXhkd0t2bi9DcW9RNnNnc0w5a09qMFVpN3UzcDNlUzA0Z0k0Q0FaWXlVL0xZckdGQmdRQ0w2ZHdmcTl0Uzk5VUNCUUkxbDNaYmxWMnB2dFh1S3hRSTBFODY2NnJzSGxsemJxYUlBZ0ZXV2g3cFZ1NmJEUThLQkNpVGRsdDl0ZGozckt1MHkycXpYVmNvRUtCZmVaU3RQSjY3UjFhK3BRa29FT0FGcHBRSEtCQllxWFNkUjlrN0VxYlMyS2c4cURPM01vSCswbW02WmUvdGtVcGpVMUgrWGlDZ1FLREdPbWRhbGQyVk41WEdqazZ4TkJxTmZ2K05QYkU2Y1VFaENvUnE2NXJFem9pY0dia3E4bCtSeXJ4YldFeW13elNrVzRyKzcrZVJ5bVU1LzVoME04YlpDanducXViMnlFZnkrQXpiOHdJRk1wS095Qy9NVkI3ZmpYd21jcGZTcUsvdXNhOVFtYnkyYUY4cjgrdVJMMFJPODV0U0lGVERWeUsva3JlUXI0dzhFSGxNYVZDUk1qa2tjbVBYblBPNDM0d0NvUnFlaU53UmVYUGt1TWl4a1hNaU55bU9WVW5IT2ViMjg3OVJ5Yk96T3IrbkFSVEpoWkdUOCtmZmlmeTJsKzN3RzJ1MVdrWmh5SFZOQnVkSGJpM2F4ejdTclRWK09mSWZTb05sUG4vV3l0R1JSeU5INWo5ZkdybmVjOGdLaEdwNUlHLzVwZ1BBeDBjdWlWd2MyYXM0R09DcTVQS3U4a2hGY3FOUlZ5QlVUem9POHE2aWZRRDkwS0o5VUQwZFhQKzgwbUFsditNRFdDWW5SUzdvK25PNk1QTXBvNjFBcUo2MDYrcWh5SjJSWHl2YXgwT3VqWndkMmEwNEdNQ3E1SDJSbCtYUDd5c3FjSFlnQ29UKzB2VWYyL0xxSTcxd2Y2eG9uejY1b2hldTR1QUFGTWxaa2NuOGVUclI0eDFGaGE1TlFvR3dyNmNqbnkzYXAvSmVWN1RQeUxvbTh1V2lmV0JkY1hBd2l1UWxrUnU2L3Z6aHlNTkdVb0ZRZmVrbW1YTzVNQ1lpUHhJNUwzSzE0dUFnRmNsRmtaL0luNmVMVzY4d2VncUU0ZkJzWG5Ha1ZVaTZiVVM2VXYxdGtVOUcvbFZ4c01aRjh2S2lmYXJ1V1A1emVoN3VObW9LaE9FcWtTL20vRnpSUGhieUI1RzNSL1lxRHRhd1NOS3VxMlB5NTQ4VTdXTnlLQkNHVERyblBoMy91Q3Zuby9HQzMydFlXTU1pU2RkNy9FQitPQjB3VHdmT256QkNvOGtiU28yMlo0cjJBZlhYUmM2UEYvbTlob1ExTHBKMHZDUGRFU0hkcW1ScnhIUE9Db1FoOWtTOHFEOXZHRGlJSmZKa2ZOZ1dxNUZEallZQ1lYaGZ5SjNkQ0RDSTU5LzMwOGNLdnpjSis4a3VyTkV1RC9CY3hBb0VMMWFHLzNscE5XSUZndklBejFHOEh3Z3dHR2sxb2xBVUNBQTFaQmNXQUFvRUFBVUNnQUlCUUlFQWdBSUJRSUVBb0VBQVVDQUFLQkFBVUNBQUtCQUFGQWdBQ2dRQUJRSUFDZ1FBQlFLQUFnRkFnUUNnUUFCQWdRQ2dRQUJRSUFBb0VBQVVDQUFvRUFBVUNBQUtCQUFGQW9BQ0FRQUZBb0FDQVVDQkFLQkFBRkFnQUtCQUFGQWdBQ2dRQUJRSUFJUjFvL1lQYWpRYUIvUy8xMncyUFV1Z3BnN3dmSEpDNU91ak5LZU02Z3JrRStsM0gzbXBsd0F3SUdQNTQzR1JpeVB2NzNwTWdWVFVtWkUzUks2Ti9HUGtkS3NQWUFCendGRjVMcm9uOHU3SUdaSExGVWkxWFJOcDVjOWZHZmxNWHBHY3FEeUFnMVFpcjQ3OFplUURrWk1qUjBkZUhQbEZCVkp0cDBabUlvOTNQWmEyQXY0NWNrUGtHQzhKWUkxTVJMYm04dGdVZVVWKy9CdVJDeUtYS3BCcSsxN2src2hQUlc3cGV2end5Q1dSZjQrY2IvVUJISUJWU09lWXhyR1J0MFYyUnQ0UldaOGZmeXB5ZGVUY3lNMUZlN2U2QWhrQ2FRWHkxc2pQUk82UFBKc2ZUMHZKV3lNUFJINGhMeXVWQjdDYUVra242cncrY25kZWVVemt4OUp1OUU4VjdXT3k3NGs4T0lwalVvZnJRRkpSVE9aVng5ZTZIdDlZdEkrUGZEVC8wZ0ZXNHBUSWgzSk95UnVucVRqUzd2SzAyL3pDeU9jaVQwYWVVU0RES3kwamI4OUY4U2Rkdjh5MCtuaHo1SkgwQkxENkFKYXhDam1pYUorc2swN09TYnVtVHNoZi9uYmtvc2g1ZWZYeHpjamVVUjZQT2w2SmZsWGtwTWoycmwvdVhaR0h2VHlBWlc2UXB0STRQbkpJbmtmUzJWWnZpbnl3VG5OSlhXOWw4bWprTFpGZml0d1h1UzIyTEo3MHVnQ1dzUXBKQmZMeG9uMmNkV2VlUnk2TGZMRnVZMUhuZTJHbHJZWjBET1QwZUVKOHlzc0NXRUdKcERrakhUeS9JRytFN2lsR2ZIZFZtWFdlQ2dDcjhsRGRCNkQyZCtOMTRCd3dkeWdRQUJTSUxRakFIS0pBQUZBZ3Rod0F6Q1ZXSUFBb0VGc01nRGxGZ1FDZ1FHd3BBT1lXQlFJQWRTNFFxdy9BSEtOQUFGQWd0Z3dBYzQwQ0FVQ0JBRUR0QzhUdUs4Q2NvMEFBVUNDMkJBQnpqd0lCd0FvRUFHcGZJSFpmQWVZZ0JRS0FBdEg4Z0ZXSUFnSEFDZ1FBYWw4Z2RsOEI1aVFGQW9BQ0FVQ0JXQ29DMUg1dXNnSUJRSUVBb0VBQXFMaXhWcXRsRkFDd0FnRkFnUUNnUUFCUUlBQ2dRQUJRSUFBb0VBQVVDQUFLQkFBVUNBQUtCQUFGQW9BQ0FVQ0JBSUFDQVVDQkFLQkFBRkFnQUNnUUFGQWdBQ2dRQUJRSUFBb0VBQVVDQUFvRUFBVUNnQUlCUUlFQVVFUHJCdjBYYURRYW5VOG5JbHNpazVFTlBkODJINW1MekVZV3VyL1FiRGI5Rm9HUkVYUGllSHlZeWtsejRYalhsL2ZrdVhCSHpIMDdCdjEzSFd1MVdsVW9rTlFDTTh2OGtlbGNKQW9FR0xYeVNCdlEyL0lHOVZMU2h2WG1tQU1YQnZYM3JjSXVyRzByS0kvTzkyL3hWQU5HckR6U2ltUG5Nc3VqeUt1VFhYbkZVcjhDaVgvNHpDckxZTnNLQmhtZzZ1VXhudWUxbFZydHp3MTNnZVFCbSttM0xJc2NGUm5MbjgrVmZOK01weDB3SXJZVUx6eldrYVRqSFdrZi8vcG1zNW5td28yUnN1TWVVekdmRG1TRGVwQUgwU2RMQml5Vng2WThjQjA3Y3JZWDdZTkszUVBlNlBsZWdHRTBWZkxZZFBlQjh2ajh1WTNyS0l2dEpkK2Y1dFBaMnF4QWl2SmRVRnNYS1lSR254SUNHSGE5WjU0dUxIS1dWZG5qQXprT011Z1Z5SElHNXZrQlhXWUpBUXliVFQxL1htelBTbVgydXF3YnNrR2U3Mm5xeWJ4cUFSaGFzZHFZMjQvVlNqSTNpTC8zSUhkaDdWbkZpbUtEcHhwUVYvazZrZDRUaUJieThaRmFyVURTUDdqM1FORFVJaXVLS1lVQzFLZ3NKcnJtdlhTTVk3TFBuRGM5cUwvaklBdWszNm01OHlWZlM0Tldkc241dUtjWk1LSW0rc3g3SFdrdnp2UUtkMzhkVUFQYmhaV1hYSE1saFpDdXhOeVZ5eVJsZS82ekErWUFiZW1rb2syRHZoL1dvRzlsMHVqemVHZkYwU3pLZDEwQjFIMTFzaXZmemFPZUJaSlhJZFBGOGs5TG0vZThBV3EweWtnYjJlbTQ4RnhSZmlsRE0wcGtZSGVVcmNyZGVEc3JqbjRYQnM3bFFldzlGaklmSmJUUjh3eW9nM3dXVnRxdDMzdjhkLzBnN3NwYmxUZVU2dHpDWkgxZWtUUzZzakYvcmV4QWtkdVlBTFdSRDVodkx2blNRSFpsVmUxQ3d0U2dpOTNQWlZ5QkFIVXZrVmlKcExteSs4U2kydDFNc2JNYzZ5MlF4WlpoWmU5VUNEQzBZaDVNTjRidFBWbG9kb2t6ckhvTFpDRDNCUnowQ3FSM1g5Nk9Qc3V6VHNPV0ZRN0FNRnNvbWR2bWk4WHZEVGhSaGJsdzBNZEFlbzlyVEJYOXJ5N2Zzb3lmQnhqR0F0bG52dXYzSGg5NXo0MEM2Vk1BTzRzWHZybEs1MnJNM29ORXFaMGRBd0dHV2o1N3F1eWk2bDE1OTFaM2VhUS9iNi9LeG5RVlR1UGRWYXp1bmxiUG5aa1ZnKzhaQ0F5MW1BZWZlMy96VmY1NDJwQk9wL0VlOUEzcUtwekd1NUlMQ1o4Zjc4THVLMkIwVmlHZGk2cFgxVCtES0krcUZFam5HcERsbmxIVnVUSVRZSlJLSkYzQ3NIa0ZHOVRwK3pibm54dUlLbDFJdURFMzhHekpBTTduMGxpdlBJQVJMcEVkZVo1YmJDL0xmUDc2K2tIZlRISGd4MEFBNksvUmFLUUQ2dWtZeWZ5Z2RsVXBFQUFPcUJjWkFnQVVDQUFLQkFBRkFvQUNBUUFGQW9BQ0FVQ0JBS0JBQUZBZ0FLQkFBRkFnQUNnUUFCUUlBQW9FQUJRSUFBb0VBQVVDZ0FJQlFJRUFnQUlCUUlFQW9FQUFVQ0FBS0JBQVVDQUFLQkFBRkFoQURUVWFEUVVDQUFvRUFBVUNnQUpadFZIYnh3aVlteFFJQUFvRUFFYXlRT3pHQXN4SkNnUUFCUUtBQXJGa0JLajlYR1FGQW9BQ3NRb0J6RUVLQkFBRkFvQUNzWVFFTVBkWWdRQ2dRR3dKQU9ZY0JRS0FBZ0ZBZ1ZoU0FwaHJyRUFBVUNDMkRBQnpqQUlCUUlIWVFnRE1MUW9FQUJTSVZRaGdUbEVnQUNnUVd3eUF1VVNCQUtCQWJEa0FtRU1VQ0FBS3hCWUVZTzVRSUFBb2tLRjJXR3hKdk53d0FDdFlmYndtUHZ5MEFxbTNWMFZ1aTF3UlQ0akR2U3lBWlpSSG1pdCtQL0pnNU5aSWJUZEE2MW9nRTVITEluZEgzaFM1S1BKYlhockFNdnhtWkNwL2ZuN2s0Y2dmUmw2aVFFYmJVWkUzUnU2SlhCcjU4Y2hZWkcva0NLc1FZSW5WUi9ydzZjZ25JcTM4OERHUjZ5TC9GRGxMZ1l5ZWRaR2Z6eXVPOTBWT1NvV1Jud0Qva0V0bFcrVDdYaUxBRXI2UjU0eE5rVWZ5WTJsRDlNUTh4K3pNYzR3Q0dRRS9HYmtwOHJISXFaRmo4K01Ma2JmbS9FM2t2eVBQT2pVUFdHVDEwZTNleUNtUlN5TGY3WHA4TXZKQTVNOGpSeXVRNFRLV1B4NFh1VGp5MTdra2pzdVBmNjlvNzc1S3h6NXV5MXNRenl6eFJBR1VSNWtuY2xHc2o5eVkvNXk4ckdnZmFIODA4cnVSUXhUSWNEZ21MeS9UcXVMS29uM0EvTkRJMDVHUFI4Nk9YQi81Y2xweGVHa0FCOER1eU85RlhoMjVyK3Z4SXlQdmpleUt2RmFCVk44N0l6Y1g3Vk4weC9PS1pENlhTbHBxM3ArLzc5bFZibkVBVmgvOXBET3lYaGM1TjY4K09rNk96RVZ1VnlEVmRrOXUvZVN4b24xNmJqcnRMdTNLK2xaZWlhekZFd2VvZDNsMHBKTno3c3dic1dsMytYZnk0K2xrbm8rTTB2aXNHOEhmK2FkemlYd2xja2ZrUzE0R3dBQThWYlIzbDZkanJSOHMyaGNjemxtQlZOOWJJbGNWN1YxWGc5Z0NBZXE1K2lqem41RnpJcWVOMmhpTnRWb3R6eFFBckVBQVVDQUFLQkFBRkFnQUtCQUFGQWdBQ2dRQUJRS0FBZ0VBQlFLQUFnRkFnUUNnUUFCUUlBQ2dRQUJRSUFBb0VBQVVDQUFLQkFBVUNBQUtCQUFGQW9BQ0FVQ0JBSUFDQVVDQkFLQkFBRkFnQUNnUUFGQWdBQ2dRQUJRSUFBb0VBQVVDQUFvRUFBVUNnQUlCUUlFQW9FQU1BVEFJalViRElBeTVkWVpnZEY2SXpXYlRZS0E0c0FMQkN4UFBVYXhBc0JyQjg5SWdXSUhnQlF1ZWkxaUJXSTJBNGtDQnNJd1g4bUZSSkU4WkRRN0M4KzN3K0hCMjVQN0l0NHpJNkxJTHF4NHVqOXdXTCt5ekRBVnJYQjZueDRlL2lOd1N1ZGlJV0lFdzNDWWk3OHEvNjAzeEFqOGpQbjdKYmkzV1lKV2IvR0RramZuNTlodVJPeUlQR2lFRnd2QjVjZVRxcnQvelYxTjVkTC9nRlFrSHFEZzZVbGw4Tm0yc1JINDQ4a2VSdDBmK045SXlZZ3FFNFhGcVpDcC92amR5YWI4SlFKR3duOFhSOFZoNk9rWFNycXhESXEvSitWdWpwa0FZTGpma1ZVaHlaK1R2bHBvUUZBbXJMSTZPWnlNUFJUNFV1VEJ5UXVUYXlMOUZ2bWtFRlFqRDRmekl4dno1TTVITDhpcGtXUk9FSW1HRnhkSHRmeUlmaS94cTVJY2lQeHBKeDk1dU5wSUtoT283SnZKblhYKytJdkxvYWlZTVJhSTRWaUZ0cUtSVGVOOGRlWC9rNk1nZkYrMWpJd3RHVllGUThkZDlmdEVtWDR0Y3RiOFRpQ0pSSEt1UWRwbitTK1RrdkJLWmpzd1lYUVZDZFowWXVTaC9udlpIdi9OQVR5aktSR2tzMDhORit4cWtUMFplR2ptM2FKL1crNERSVmlCVTAvV1J3L1BuZjU5ZnNHc3kwU2dTeGJFTTZiVGV2NHFraTFqWEYrM1R5cytMN0M2YzFxdEFxSlIwNnVRYnV2NThTV1ROYmw4eUNxdVNrc2x6TXJJbGZ4enZlbnhQWkM0eW16K08ycjk3clh3Nzh0N0k2eU9IUlY0Vk9TMnZTbEFnVkVUYVJYQlQxNTl2T1ppN0NrWmdWWkxLWWx2eC85Zk5sSDE5S21kSDBkNmZ2MGR4TENrZFVQOUM1RStMOXBtQXI0aGNHWmt2MnRlTW9FQ29nTitKdkRKLy9ualJ2Z0o0b0JQVUVKVkpLb2Vka1EzTC9QNVVJdWtXTVp1R29VUXFjRmZjcC9PS0k1MWFmbnprMk1nNVBSczhLQkFHNkdmeng3UmYrYnBjSXBXWnVDcGVKak1yS0krTzlQMXBWOWRXcGJHa1ovSnFPSjFPL3VISWtVWDd1cEM3STEvMzBsVWdERjdhb2pzemNrM2tBMVdmMENwVUtCUEZ2cWVXcGxWRjJrVzFvNmRrZXYvU3pmaDN6Y2EvWlUvVnhyZWkwaW05bjR2Y0czbFA0U0Q2MEJ0cnRmd09xYStZZUpzOUJaTEtJTzJhbXUrelV1a3RrZWtva0ZramlSVUkxRS92UWZNZGZjb2pTVVV4MmZQWXVDSEVDZ1RxdC9wSWsvL3Vub2MzTGxJZyszQXRESFhtSFFtcHM3SUQ1L09HQlpiSExpd1VTSGw1cElQcmFmZFc5eTZyZENQQWRCSGhEa01IQ2dTNnBRUG9hYmRXMmkrMXBjLzNiTWxGc3RscWhicXpDd3RlYU9jaTVkRzlPdGxWOUw5cUhSUUkxRXphWGJXU0N3cTNOUnFOQ2NPR0FnRzZwVk4yMDI2cVRmbGoyYlVlYVhlWDk3ZWd0aHdEZ1gybHd1ZzlVTjY1UG1SYnorTnBOOWEwSWNNS0JOaGE5RC9MYXJia2ErT05SbU9EWVVPQkFIT3IrTHFyMFZFZ1VET3JPUTEzd2JDQkFvSFZsSUhWQmlnUTZxN1piQzZVbE1qa0VqOVc5dlU5UmhNRkF2WFRlMHdqWFVUWTc2QjQ1MDJrWGxBZVVVU3VTRWVCUUEzMXZxTmc1KzF0Wi9KcVl6eC9uTW1QTC9YelVCdXVBNkh1MGk2czJaNlZSZWQrV0V0SnU2N2NXQkVyRUtpeDlINndxOWtOTloyUG80QUNnWnJxdkkzdDNESy9QNVhHUnFzUEZBalFYU0lwczBYNUtiNnBZTkp0UzlZWGJ1VU8zdElXQUNzUUFCUUlBQW9FQUFVQ0FBb0VBQVVDZ0FJQlFJRUFvRUFBUUlFQW9FQUFVQ0FBS0JBQUZBZ0FLQkFBRkFnQUNnUUFCUUtBQWdFQUJRS0FBZ0ZBZ1FDZ1FBQlFJQUNnUUFCUUlBQW9FQUFVQ0FBS0JBQlc0UDhFR0FEMDdZUHdLNUd0QndBQUFBQkpSVTVFcmtKZ2dnPT0iKTsNCiAgICAgICAgYmFja2dyb3VuZC1wb3NpdGlvbjogY2VudGVyIGNlbnRlcjsNCiAgICAgICAgYmFja2dyb3VuZC1zaXplOiBjb3ZlcjsNCiAgICAgICAgYm9yZGVyLXJhZGl1czogNTAlOw0KICAgICAgICBib3JkZXI6IDRweCBzb2xpZCB2YXIoLS1tYWluLWJnLWNvbG9yKTsNCiAgICAgICAgYm94LXNoYWRvdzogMCAtMTVweCAxNXB4IHJnYmEoMjU1LCAyNTUsIDI1NSwgMC4wNSksDQogICAgICAgICAgaW5zZXQgMCAtMTVweCAxNXB4IHJnYmEoMjU1LCAyNTUsIDI1NSwgMC4wNSksDQogICAgICAgICAgMCAxNXB4IDE1cHggcmdiYSgwLCAwLCAwLCAwLjMpLCBpbnNldCAwIDE1cHggMTVweCByZ2JhKDAsIDAsIDAsIDAuMyk7DQogICAgICAgIHRyYW5zaXRpb246IGFsbCBlYXNlIDAuMnM7DQogICAgICB9DQogICAgICAuY2xvY2s6YmVmb3JlIHsNCiAgICAgICAgY29udGVudDogIiI7DQogICAgICAgIGhlaWdodDogMC43NXJlbTsNCiAgICAgICAgd2lkdGg6IDAuNzVyZW07DQogICAgICAgIGJhY2tncm91bmQtY29sb3I6IHZhcigtLW1haW4tdGV4dC1jb2xvcik7DQogICAgICAgIGJvcmRlcjogMnB4IHNvbGlkIHZhcigtLW1haW4tYmctY29sb3IpOw0KICAgICAgICBwb3NpdGlvbjogYWJzb2x1dGU7DQogICAgICAgIGJvcmRlci1yYWRpdXM6IDUwJTsNCiAgICAgICAgei1pbmRleDogMTAwMDsNCiAgICAgICAgdHJhbnNpdGlvbjogYWxsIGVhc2UgMC4yczsNCiAgICAgIH0NCiAgICAgIC5ob3VyLA0KICAgICAgLm1pbiwNCiAgICAgIC5zZWMgew0KICAgICAgICBwb3NpdGlvbjogYWJzb2x1dGU7DQogICAgICAgIGRpc3BsYXk6IGZsZXg7DQogICAgICAgIGp1c3RpZnktY29udGVudDogY2VudGVyOw0KICAgICAgICBib3JkZXItcmFkaXVzOiA1MCU7DQogICAgICB9DQogICAgICAuaG91ciB7DQogICAgICAgIGhlaWdodDogY2FsYygobWluKDEwMHZ3LCAxMDB2aCkgLSA0MHB4KSAqIDAuNSk7DQogICAgICAgIHdpZHRoOiBjYWxjKChtaW4oMTAwdncsIDEwMHZoKSAtIDQwcHgpICogMC41KTsNCiAgICAgIH0NCiAgICAgIC5ob3VyOmJlZm9yZSB7DQogICAgICAgIGNvbnRlbnQ6ICIiOw0KICAgICAgICBwb3NpdGlvbjogYWJzb2x1dGU7DQogICAgICAgIGhlaWdodDogNTAlOw0KICAgICAgICB3aWR0aDogNnB4Ow0KICAgICAgICBiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1tYWluLXRleHQtY29sb3IpOw0KICAgICAgICBib3JkZXItcmFkaXVzOiA2cHg7DQogICAgICB9DQogICAgICAubWluIHsNCiAgICAgICAgaGVpZ2h0OiBjYWxjKChtaW4oMTAwdncsIDEwMHZoKSAtIDQwcHgpICogMC42KTsNCiAgICAgICAgd2lkdGg6IGNhbGMoKG1pbigxMDB2dywgMTAwdmgpIC0gNDBweCkgKiAwLjYpOw0KICAgICAgfQ0KICAgICAgLm1pbjpiZWZvcmUgew0KICAgICAgICBjb250ZW50OiAiIjsNCiAgICAgICAgaGVpZ2h0OiA1MCU7DQogICAgICAgIHdpZHRoOiA0cHg7DQogICAgICAgIGJhY2tncm91bmQtY29sb3I6IHZhcigtLW1haW4tdGV4dC1jb2xvcik7DQogICAgICAgIGJvcmRlci1yYWRpdXM6IDRweDsNCiAgICAgIH0NCiAgICAgIC5zZWMgew0KICAgICAgICBoZWlnaHQ6IGNhbGMoKG1pbigxMDB2dywgMTAwdmgpIC0gNDBweCkgKiAwLjcpOw0KICAgICAgICB3aWR0aDogY2FsYygobWluKDEwMHZ3LCAxMDB2aCkgLSA0MHB4KSAqIDAuNyk7DQogICAgICB9DQogICAgICAuc2VjOmJlZm9yZSB7DQogICAgICAgIGNvbnRlbnQ6ICIiOw0KICAgICAgICBoZWlnaHQ6IDYwJTsNCiAgICAgICAgd2lkdGg6IDJweDsNCiAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogI2YwMDsNCiAgICAgICAgYm9yZGVyLXJhZGl1czogMnB4Ow0KICAgICAgfQ0KICAgIDwvc3R5bGU+DQogIDwvaGVhZD4NCiAgPGJvZHk+DQogICAgPGRpdiBjbGFzcz0iY2xvY2siPg0KICAgICAgPGRpdiBjbGFzcz0iaG91ciI+PC9kaXY+DQogICAgICA8ZGl2IGNsYXNzPSJtaW4iPjwvZGl2Pg0KICAgICAgPGRpdiBjbGFzcz0ic2VjIj48L2Rpdj4NCiAgICA8L2Rpdj4NCiAgICA8c2NyaXB0Pg0KICAgICAgY29uc3QgZGVnID0gNjsNCiAgICAgIGNvbnN0IGhvdXIgPSBkb2N1bWVudC5xdWVyeVNlbGVjdG9yKCIuaG91ciIpOw0KICAgICAgY29uc3QgbWluID0gZG9jdW1lbnQucXVlcnlTZWxlY3RvcigiLm1pbiIpOw0KICAgICAgY29uc3Qgc2VjID0gZG9jdW1lbnQucXVlcnlTZWxlY3RvcigiLnNlYyIpOw0KICAgICAgY29uc3Qgc2V0Q2xvY2sgPSAoKSA9PiB7DQogICAgICAgIGxldCBkYXkgPSBuZXcgRGF0ZSgpOw0KICAgICAgICBsZXQgaGggPSBkYXkuZ2V0SG91cnMoKSAqIDMwOw0KICAgICAgICBsZXQgbW0gPSBkYXkuZ2V0TWludXRlcygpICogZGVnOw0KICAgICAgICBsZXQgc3MgPSBkYXkuZ2V0U2Vjb25kcygpICogZGVnOw0KICAgICAgICBob3VyLnN0eWxlLnRyYW5zZm9ybSA9IGByb3RhdGVaKCR7aGggKyBtbSAvIDEyfWRlZylgOw0KICAgICAgICBtaW4uc3R5bGUudHJhbnNmb3JtID0gYHJvdGF0ZVooJHttbX1kZWcpYDsNCiAgICAgICAgc2VjLnN0eWxlLnRyYW5zZm9ybSA9IGByb3RhdGVaKCR7c3N9ZGVnKWA7DQogICAgICB9Ow0KICAgICAgc2V0Q2xvY2soKTsNCiAgICAgIHNldEludGVydmFsKHNldENsb2NrLCAxMDAwKTsNCiAgICA8L3NjcmlwdD4NCiAgPC9ib2R5Pg0KPC9odG1sPg0K

Tool to convert https://dopiaza.org/tools/datauri/index.php

luetage

@tam710562 That’s a neat and straightforward way to share a widget.

jimmynewtron

@tam710562 Thank you.

jimmynewtron

@tam710562 Could you share all the code?

luetage

@jimmynewtron He shared all the code. It’s a data URL. Copy it and use it as webpage URL in your widget. If you want to get a hold of the original HTML code, right‐click the widget and under developer tools pick “inspect.” Switch to the sources tab and click on the data URL on the left side, there you can view/copy the HTML.

jimmynewtron

@luetage Thank you. It worked.

aminought

Still not so powerful as my mod: https://forum.vivaldi.net/topic/95430/speed-dial-widgets. It's not working now, but you can grasp some ideas: using of css-selector, resizing and scaling.

luetage

Binary Clock Widget

light	dark

Displays a simple binary clock in a widget. For information and tips how to read out the actual time I refer you to @Ruarí’s excellent blog post on the topic ☛ https://ruario.vivaldi.net/2023/11/06/reading-a-binary-watch-tips/

Installation

Use the link to download the webpage folder binary-clock-widget.zip. You can preview its contents by visiting https://github.com/luetage/vivaldi_modding/tree/master/binary-clock-widget first.

Download https://downgit.github.io/#/home?url=https://github.com/luetage/vivaldi_modding/tree/master/binary-clock-widget

Extract the zip file and save the folder to a location of your choice (e.g. alongside other Vivaldi backup files).

Open the dashboard, add a new webpage widget and use the path to the binary.html file within the binary-clock-widget folder as webpage URL ☛ file:///full/path/to/folder/binary-clock-widget/binary.html. Alternatively open the HTML file directly in Vivaldi and copy the address.

Notes

Runs offline. Displays hours and minutes in binary format (24 hour clock). Updates once a minute and then calculates the next minute jump, instead of checking every second. This is supposed to be run as a regular size widget, you can change the widget size from the three dot menu. Automatically adapts to your Vivaldi theme when you check “Share Theme Colors” when adding the widget, otherwise it’s black on white.

History

2024.10.0 Release ️
2024.10.1 Fix minor alignment issue
2024.10.2 Update light theme
2024.10.3 Dashboard-camo support
2024.12.0 Use Vivaldi theme variables

tam710562

@luetage to simplify the installation for source code from github you can use GitHub & BitBucket HTML Preview to generate the link to the html page

https://htmlpreview.github.io/?https://github.com/luetage/vivaldi_modding/blob/master/binary-clock-widget/binary.html

luetage

@tam710562 This is nifty, didn’t know about it. But for the binary clock everything is done locally, they are no calls to other websites, it runs from your own device. Therefore I believe it doesn’t make sense to load the widget from a server each time.

But it isn’t much code at all; I will combine it into one HTML file and use your data URI approach for this widget, or at least provide the option. For modding purposes (theming et al.) downloading the folder gives you the source.

luetage

The apod widget can’t handle today’s “picture,” because none is provided. I did a small update that fixes the issue and at least displays the info and provides the link.

I f*ed up the update, didn’t really have time. It correctly shows the noimage default image on media type “other,” but will spit it out all the time. Anyway, I pushed a proper update and increased the version to 2024.10.4. Sorry for the confusion. I hope this works now, if not, another update will follow.

HKayn

Has anyone found a way to access the CSS variables of the Vivaldi UI, or somehow pass them into the website? It would be really great if the theme of custom webpage widgets could adapt to that of the browser.

I've just tried out the dashboard on the latest release candidate, and I'm excited to check out the modding forum once the dashboard hits stable and everyone gets their hands on it!

luetage

@HKayn You could maybe do that, but it would need a custom browser modification I assume; a function that sends the color variables to your widgets. I believe I would know how to do it for tabs, but widgets aren’t tabs. Prefers color scheme will give you two different themes to work with for light and dark native in CSS. Pick neutral color schemes and they should fit right in with your Vivaldi themes.

HKayn

@luetage said in Custom dashboard widgets:

@HKayn You could maybe do that, but it would need a custom browser modification I assume; a function that sends the color variables to your widgets.

I've gone ahead and built exactly that! https://forum.vivaldi.net/topic/102173/dashboard-camo-theme-integration-for-dashboard-webpages

Turns out that webpage widgets are really just tabs.

luetage

Fortune Widget

light	dark

Displays a random fortune each time you open the dashboard.

Installation

Use the link to download the webpage folder fortune-widget.zip. You can preview its contents by visiting https://github.com/luetage/vivaldi_modding/tree/master/fortune-widget first.

Download download-directory.github.io?url=https://github.com/luetage/vivaldi_modding/tree/master/fortune-widget&filename=fortune-widget

Extract the zip file and save the contents to a location of your choice in a folder called fortune-widget (e.g. alongside other Vivaldi backup files).

Open the dashboard, add a new webpage widget, check “Share Theme Colors,” and use the path to the fortune.html file within the fortune-widget folder as webpage URL ☛ file:///full/path/to/folder/fortune-widget/fortune.html. Alternatively open the HTML file directly in Vivaldi and copy the address.

Notes

Runs offline. Fortunes are loaded locally from a central data.js file in your fortune-widget folder. The program comes with around 11k fortunes, sourced from https://github.com/your-fortune/your-fortune.github.io and filtered by character count. Feel free to edit the file as you see fit, but make sure to use a proper text editor, because it’s quite large. When adding your own fortunes make sure to use curly‐ instead of straight quotes. The widget will replace 2 dashes for an en‐dash, 3 dashes for en em‐dash, and converts asterisks to bold and italic just like in markdown (*italic*, **bold**). Separate quote and author.

History

2024.10.0 Release
2024.10.1 Dashboard-camo support
2024.12.0 Use Vivaldi theme variables

luetage

@nomadic I tested the local storage. It works in widgets. One thing to note is that local storage only survives restarts, if you allow cookies for the page. Once you attempt to delete session data, even if it isn’t present, local storage will be cleared too. Making an exception for the widget in privacy settings is a way around it.