From 1e02045498e4df2c62a442ed1c06960a17721070 Mon Sep 17 00:00:00 2001 From: Simon Date: Tue, 19 Aug 2025 22:58:30 -0400 Subject: [PATCH] reworked image hyperlinks + help tab tex --- startpage.html | 184 +++++++++++++++++++++++++++++-------------------- 1 file changed, 111 insertions(+), 73 deletions(-) diff --git a/startpage.html b/startpage.html index e55bec7..5ef9054 100644 --- a/startpage.html +++ b/startpage.html @@ -314,33 +314,30 @@

you are now editing the page!

- this is the settings box - there are various tabs containing various + this is the settings box - use the tabs above to find various customization options for your startpage experience.

- this box is adjustable, just like every layer you add to the page. - you can drag it around the page, and dragging with right click will - adjust the size of the layer.

+ this box is adjustable, and so will be every layer you add to the page. + click + drag to move, right-click + drag to resize.

on the "layers" tab, you can add two types of layers to the page:

  1. bookmark layer:
    a customizable box that can serve as a clock, - tell you the date, and hold bookmarks all at once. it can also just be - one of those things, or any combination.

    to group a bookmarks - together within a layer, enter the respective links with the same "section". - uncategorized (no section specified) bookmarks will stay at the top of their layer. + tell you the date, and/or hold bookmarks.

    to group a bookmarks + together within a layer, enter links with the same "section". + uncategorized (no "section" specified) bookmarks will stay at the top of their layer.

  2. - image layer:
    paste any URL that points directly at an image or GIF - to add it to the page.

    use "free transform" in the "global - settings" tab to change the image resizing style. + media layer:
    paste any URL that either points directly to an image/GIF + or to a youtube video to add it to the page.

    use "free transform" in the + "global settings" tab to change the container's resizing style.

your changes will be saved to the page when you exit editing mode.

- to go back to the last saved state while still editing the page (or to revert/undo - live changes), refresh the page without disabling / exiting "editing" mode. + to undo current changes / revert to the last saved state, refresh the page without disabling / exiting "editing" mode.

that concludes the basics. there's some more advanced information below: @@ -360,17 +357,15 @@

precise adjustments: - if you click on a slider to focus it, and then keep your mouse hovered over it, - you can use the arrow keys to make minute adjustments. + click on a slider (e.g. border width) to focus it, keep your mouse hovered over it, + and use the arrow keys to make minute changes.

floating text:
- for floating text anywhere on the page, remove the border and set the - background opacity of a layer to zero.
then, add new sections to the - layer without any link information (sections can be added on their own). - customize the layer's "section" text to your liking and place the text - wherever you want. + create a bookmark layer, remove the border, and set the background opacity to zero. +
then, add new sections to the layer without entering any label/link information. + customize the layer's section text to your liking and place wherever you want.

@@ -384,8 +379,8 @@ google fonts.

- beware, if you have multiple font families selected (it keeps track of - all of the fonts you press "get font" on), only the first one will be + NOTE: if you have multiple font families in your cart (it tracks all + of the fonts you press "get font" on), only the top one will be loaded. also, only regular versions of fonts are supported.

to load a font:
@@ -410,12 +405,12 @@

- you can export your entire current page's setup to your clipboard in the - "import / export" tab. open a text file and paste the contents to store + you can export your current page's entire setup to your clipboard in the + "import / export" tab. save the contents somewhere on your computer to store your theme for later or for sharing with others.

- to load in a theme, simply paste the output of the export button into the - "import" input, and refresh the page. + to load in a theme, simply paste exported data into the "import" input, + and refresh the page (ignore the warning that saved data will be lost).

@@ -431,12 +426,12 @@ type="text" />
-

add image to page

+

add media layer

imgur upload for convenience
-

layers

+

layer list

@@ -481,13 +476,15 @@
-

image manipulation

+

media manipulation

- +
-

change page wallpaper

+
+ +

change wallpaper

@@ -507,9 +504,10 @@
+

change cursors

-

for reference: cursors

+

site with a bunch of cursors for reference (copy desired cursor image URLs for below)

@@ -532,34 +530,33 @@
+
+

audio

-
- +
+ -
- - +
+ + +
-
-
- - -
+
+ + +
- + -

- (note: this will require either white-listing this site in your browser - or generally enabling "allow auto-play audio" in your browser's settings. -

+

+ (note: this will require either white-listing this site in your browser + or generally enabling "allow auto-play audio" in your browser's settings. +

- todo: -
add check for youtube container in border functions -
rename stuff | better function names | imageUrl -> mediaUrl | etc.