Is it possible to style elements rendered within the <div> tag?

[stevebarakat]

I'm making a script to help me learn Scriptkit's helper functions. Using colors and well structured content helps tremendously when learning. Is there a way to use css?

// Menu: Helper Functions
// Description: A glossary of Scriptkit's gloabal helper functions.
// Author: S.Barakat

let command = await arg("Pick a command", ["cd", "cp", "chmod", "echo", "exec", "exit", "grep"]);

let summary = "";
let definition = "";

switch (command) {
  case "cd":
    summary = "Use c d to change the current working directory to directory."
    definition = md("# CD: Change the current working directory to `directory`.") +
      md("* ``` cd [-L|[-P [-e]] [-@] [directory]``` ") +
      md("More Info: https://man7.org/linux/man-pages/man1/cd.1p.html")
    break;
  case "cp":
    summary = "Use c p to copy single or multiple files or directories."
    definition = md("# CP: Copy single or multiple files or directories.") +
      md("### To copy a file:") +
      md("* `cp foo.txt bar.txt`" + '<br />' + "creates `bar.txt` with contents of `foo.txt`") +
      md("### To copy multiple files, pass their names followed by the destination directory:") +
      md("* `cp foo.txt bar.txt baz.txt copies/`" + '<br />' + "duplicates `foo.txt`, `bar.txt`, and `baz.txt` to the `copies` directory.") +
      md("### To copy a directory, pass the -R flag:") +
      md("* `cp -R thisDirectory/ thatDirectory`" + '<br />' + "recursively copies the contents of `thisDirectory` to `thatDirectory`.") +
      md("### To copy multiple directories, pass the path of the directories to be copied followed by the destination directory:") +
      md("* `cp path/to/foo path/to/bar path/to/baz path/to/copies`" + '<br />' + "duplicates the `foo`, `bar`, and `baz` directories to the `copies` directory.") +
      md("https://man7.org/linux/man-pages/man1/cd.1p.html")
    break;
  case "chmod":
    summary = "Use c h m o d to change access permissions according to the mode."
    definition = md("# CHMOD: Change the permissions of each given file according to mode.") +
      md("### Numeric mode:") +
      md("* A numeric mode is from one to four octal digits (0-7), derived by adding up the bits with values 4, 2, and 1. Any omitted digits are assumed to be leading zeros.`") +
      md("* The first digit selects the `set user ID (4)`, `set group ID (2)`, and `sticky (1)` attributes.") +
      md("* The second digit selects permissions for the user who " + "<b><i>" + " owns " + "</i></b>" + " the file: `read (4), write (2), and execute (1)`") +
      md("* The third selects permissions for other users in the file's group: `read (4), write (2), and execute (1)`") +
      md("* The fourth selects permissions for other users" + "<b><i>" + " not " + "</i></b>" + "in the file's group: `read (4), write (2), and execute (1)`") +
      md("### Examples:") +
      md("* `chmod 400 sample.txt`" + '<br />' + "Read by owner only.") +
      md("* `chmod 040 sample.txt`" + '<br />' + "Read by group only.") +
      md("* `chmod 004 sample.txt`" + '<br />' + "Read by anyone.") +
      md("* `chmod 200 sample.txt`" + '<br />' + "Write by owner only.") +
      md("* `chmod 020 sample.txt`" + '<br />' + "Write by group only.") +
      md("* `chmod 002 sample.txt`" + '<br />' + "Write by anyone.") +
      md("* `chmod 100 sample.txt`" + '<br />' + "Execute by owner only.") +
      md("* `chmod 010 sample.txt`" + '<br />' + "Execute by group only.") +
      md("* `chmod 001 sample.txt`" + '<br />' + "Execute by anyone.") +
      md("* `chmod 444 sample.txt`" + '<br />' + "Allow read permission to owner and group and anyone.") +
      md("* `chmod 777 sample.txt`" + '<br />' + "Allow everyone to read, write, and execute file.") +
      md("More Info: https://man7.org/linux/man-pages/man1/chmod.1.html")
    break;
  case "echo":
    summary = "Use echo to display a line of text."
    definition = md("# ECHO: Display a line of text.") +
      md("* `echo 'Hello World!' `" + '<br />' + "` output: Hello World!`") +
      md("More Info & Examples: https://www.tutorialspoint.com/unix_commands/echo.htm");
    break;
  case "exec":
    summary = "Use exec to execute s command in place of the current process (instead of creating a new process)."
    definition = md("# EXEC: Execute " + "<i>" + " command " + "</i>" + " in place of the current process (instead of creating a new process).") +
      md("* `exec [command args ...]`") + md("* `exec [-a name] [-cl] [command args ... ]`") +
      md("One common use case for exec relates to tidying up a script. If you need to use a script to tee up the parameters for a command, then terminating the script with exec launches the new program with those parameters and closes the current shell session.") +
      md("More Info: https://man7.org/linux/man-pages/man1/exec.1p.html")
    break;
  case "exit":
    summary = "Use exit to terminate a script."
    definition = md("# EXIT: Terminates a script. It can also return a value, which is available to the script's parent process.") +
      md("### Example 1: Exit from shell.") +
      md("* `exit`") +
      md("### Example 2: Return the succsess/failure of functionality in script.") +
      md("* `exit 0`" + '<br />' + "Terminate shell script with success message:") +
      md("* `exit 1`" + '<br />' + "Terminate shell script with failure message:") +
      md("More Info: https://man7.org/linux/man-pages/man1/exit.1p.html")
    break;
  case "grep":
    summary = "Use grep to print lines matching a pattern."
    definition = md("# GREP: Searches the named input FILEs for lines containing a match to the given PATTERN.") +
      md("* `grep [OPTION...] PATTERNS [FILE...]`") +
      md('* Searches standard input if no files are named or a single hyphen-minus (-) is given as the file name.') +
      md('* By default, grep prints the matching lines.') +
      md("### Example 1: Search for the given string in a single file `filename.txt`") +
      md('* `grep "waldo" fileName`' + '<br />' + "outputs: waldo (if found).") +
      md("### Example 2: Search for the given string in multiple files `filename1.txt, filename2.txt, filename3.txt`") +
      md('* `grep "waldo" fileName*`' + '<br />' + "outputs: waldo (if found).") +
      md("### Example 3: Case insensitive search") +
      md('* `grep -i "Waldo" fileName`' + '<br />' + "outputs: waldo (if found).") +
      md("More Info: https://man7.org/linux/man-pages/man1/grep.1.html")
    break;
  default:
    console.log(`Couldn't find ${expr}.`);
}


await say(
  summary
);

await div(md(definition), "p-4");

I prefer Github's default text styling to the md helper's. It very colorful but doesn't wrap the content within the window, as you can see in this screenshot:

Also, I've been calling the app Scriptkit and spelling it that way, which is incorrect. It's two words. I have noted that. Or is it one word "Kit"?

...ps: Some of the helper functions seem like they might have rare use cases. Any possibility you can list a dozen or so of the most useful ones to start learning first? Thank you.

[johnlindquist]

Yes, await div() takes any html string:

g.

---

"Script Kit" is preferred if you're doing anything social media, blogging, etc.

"Kit" is fine when just chatting about it here, etc

---

I would browse though the script examples and see which functions stick out the most to you:

https://www.scriptkit.com/scripts

arg and npm will probably be at the top of the list