Sandbox Test Page 2

Version 11.1 by Jareth Carpenter on 2026/08/31 22:46

Product Documentation

Learning Center

Product Documentation

Guides, answers, and implementation resources for your FirstDigital voice services. Choose a product to get started.

Cloud Connected PSTN (CCP) Webex integration Open CCP docs Microsoft Teams Direct Routing Open Teams docs FirstDigital SIP Trunk Voice connectivity Open SIP docs Support Resources and contact information Get support

Data URI image

Learning Center

Product Documentation

Guides, answers, and implementation resources for your FirstDigital voice services. Choose a product to get started.

  alongside whatever else is already there.
  It is fixed-position and self-contained, so it does not need to
  sit inside that page's own wrapper div, and it will not disturb
  that page's own layout.
If a wiki page does not yet use at all, you can also add just this snippet on its own to give that page a home button, without needing to touch anything else on it. ------------------------------------------------------------ CUSTOMIZING ------------------------------------------------------------ - Destination: change the href on the tag below if the home URL ever changes. - Position: the button defaults to the bottom-left corner. To move it, edit the "position" rule in .fdhb-btn (bottom/left/ right/top) near the top of the

 block.
  - Label: change "Home" in the markup, or drop the  entirely
    to show only the house icon (a comment marks where).

  ------------------------------------------------------------
  NOTES
  - This file is a FRAGMENT: no DOCTYPE declaration and no
    html / head / body elements.
  - Class and ID names use the "fdhb-" prefix (FirstDigital Home
    Button), so this cannot clash with any other FirstDigital wiki
    fragment's classes ("fdt-", "fdccp-", "fdvq-", "fdcht-", "fdid-",
    "fdmth-", "fdm-", "fdo-", "fd-home", etc.) even when this button
    is pasted onto the same page as one of them.
  - Safe to paste this same snippet onto multiple pages across your
    wiki. If it is ever accidentally pasted twice on the SAME page,
    a safety-net rule hides the second copy so you only ever see
    one button.
  - After saving, only ever re-edit the page in SOURCE / WIKI mode
    (never WYSIWYG) -- the rich-text editor can strip the     block or duplicate html-macro content. Paste directly from this
    file rather than through Microsoft Word, which can silently
    turn straight quotes into curly ones and break the HTML/CSS.
  ============================================================
-->
  /* Safety net: if a page ever ends up with this snippet twice,
     show only the first copy. */
  #fdhb-root ~ #fdhb-root { display: none !important; }

  #fdhb-root, #fdhb-root *, #fdhb-root *::before, #fdhb-root *::after {
    box-sizing: border-box;
  }

  #fdhb-root {
    /* FirstDigital brand tokens (Brand Guide 2025, p.11) */
    --fdhb-navy:  #003366;
    --fdhb-bright:#38b2e3;
    --fdhb-white: #ffffff;
  }

  .fdhb-btn {
    position: fixed;
    left: 18px;
    bottom: 18px;
    z-index: 2147483000; /* sit above virtually anything else on the page */

    display: inline-flex;
    align-items: center;
    gap: 8px;

    background: var(--fdhb-navy);
    color: var(--fdhb-white) !important;
    font-family: 'Host Grotesk', 'Segoe UI', -apple-system, BlinkMacSystemFont, Arial, sans-serif;
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1;
    text-decoration: none !important;
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 999px;
    padding: 11px 18px 11px 14px;
    box-shadow: 0 6px 18px rgba(0,51,102,0.28);
    transition: background .18s ease, transform .18s ease, box-shadow .18s ease;
  }

  .fdhb-btn:hover {
    background: var(--fdhb-bright);
    transform: translateY(-2px);
    box-shadow: 0 10px 22px rgba(0,51,102,0.34);
  }

  .fdhb-btn:focus-visible {
    outline: 3px solid var(--fdhb-bright);
    outline-offset: 2px;
  }

  .fdhb-btn svg {
    width: 17px;
    height: 17px;
    flex: 0 0 auto;
    fill: none;
    stroke: var(--fdhb-white);
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .fdhb-btn span { display: inline-block; }

  @media (max-width: 480px) {
    .fdhb-btn { left: 12px; bottom: 12px; padding: 11px; }
    /* Icon-only on small screens so the button never crowds mobile content */
    .fdhb-btn span { display: none; }
  }

  @media (prefers-reduced-motion: reduce) {
    .fdhb-btn { transition: none; }
  }



  
    
    
    Home

Home