Changes for page Cloud Connected PSTN (CCP) How To's:
Last modified by Chris Workman on 2026/08/21 22:43
From version 4.1
edited by Chris Workman
on 2026/08/21 22:43
on 2026/08/21 22:43
Change comment:
There is no comment for this version
To version 3.1
edited by Chris Workman
on 2026/08/21 22:21
on 2026/08/21 22:21
Change comment:
There is no comment for this version
Summary
-
Page properties (1 modified, 0 added, 0 removed)
Details
- Page properties
-
- Content
-
... ... @@ -1,356 +1,8 @@ 1 -{{html clean="false"}} 2 -<!-- 3 - ============================================================ 4 - FirstDigital - Cloud Connected PSTN (CCP) How To's (XWiki fragment) 5 - No photographs. Text, brand colour and icons only. 6 - Same design system as the Microsoft Teams Resource Hub (fdt-), 7 - Cloud Connected PSTN Resource Hub (fdccp-), and Voice Services 8 - Q&A (fdvq-) pages. This page is the natural destination for the 9 - "How To's" card on the CCP Resource Hub. 10 - ============================================================ 1 + 11 11 12 - HOW TO USE 13 - 1. Edit the wiki page in SOURCE / WIKI mode (never WYSIWYG). 14 - 2. Select all existing page content and delete it. 15 - 3. Paste: 16 16 17 - {{html clean="false"}} 18 - ...everything in this file... 19 - {{/html}} 4 +[[Moving a number between SIP trunks via FDconnect>>https://app.vidcast.io/share/c2f50516-9950-4b45-a019-4a81a6fee293?playerMode=vidcast]] 20 20 21 - 4. Save& View.6 +[[Disaster Redirect Plan>>https://app.vidcast.io/share/7b80781e-6678-457d-b7e4-2349a095c7d3?playerMode=vidcast]] 22 22 23 - ------------------------------------------------------------ 24 - LINKS 25 - ------------------------------------------------------------ 26 - All three topics already link to their real Vidcast video 27 - walkthroughs, taken directly from the source document -- no 28 - placeholders needed: 29 - 1. Moving a number between SIP trunks via FDconnect 30 - https://app.vidcast.io/share/c2f50516-9950-4b45-a019-4a81a6fee293?playerMode=vidcast 31 - 2. Disaster Redirect Plan 32 - https://app.vidcast.io/share/7b80781e-6678-457d-b7e4-2349a095c7d3?playerMode=vidcast 33 - 3. Free Caller Registry 34 - https://app.vidcast.io/share/9a76e07d-1a9d-4d69-9354-e0d8b5699543?playerMode=vidcast 35 - All three open in a new tab (target="_blank") since they leave 36 - the wiki for an external video player. 37 - 38 - ------------------------------------------------------------ 39 - NOTES 40 - - This file is a FRAGMENT: no DOCTYPE declaration and no 41 - html / head / body elements. Everything is scoped inside 42 - .fdcht-hub so it cannot leak into the wiki theme. 43 - - After saving, only ever re-edit this page in SOURCE mode. 44 - The WYSIWYG editor can duplicate html-macro content. 45 - - Class names use the "fdcht-" prefix, so this page cannot clash 46 - with the menu page ("fdm-"), onboarding page ("fdo-"), the 47 - Microsoft Teams Resource Hub ("fdt-"), the Cloud Connected PSTN 48 - Resource Hub ("fdccp-"), or Voice Services Q&A ("fdvq-") even if 49 - more than one of them ever appears on the same page. 50 - - The only external asset is your logo, loaded from your wiki. 51 - Nothing is embedded, so this file is small. 52 - ============================================================ 53 ---> 54 -<style> 55 -@import url('https://fonts.googleapis.com/css2?family=Host+Grotesk:wght@300;400;600;800&display=swap'); 56 - 57 - /* Safety net: if the wiki ever renders this block twice, 58 - show only the first copy. */ 59 - .fdcht-hub ~ .fdcht-hub { display: none !important; } 60 - 61 - /* ---- FirstDigital brand tokens (Brand Guide 2025, p.11) ---- */ 62 - .fdcht-hub { 63 - --fd-navy: #003366; 64 - --fd-blue: #307ab2; 65 - --fd-blue-bright: #38b2e3; 66 - --fd-red: #cf333d; 67 - --fd-body: #2e404d; 68 - --fd-secondary: #8f9499; 69 - --fd-bg-mid: #dedede; 70 - --fd-bg-light: #f0f0f0; 71 - --fd-ice: #e3f1f8; 72 - --fd-white: #ffffff; 73 - } 74 - 75 - .fdcht-hub, .fdcht-hub * { box-sizing: border-box; } 76 - 77 - .fdcht-hub { 78 - font-family: 'Host Grotesk', 'Segoe UI', -apple-system, BlinkMacSystemFont, Arial, sans-serif; 79 - font-weight: 300; 80 - color: var(--fd-body); 81 - background: var(--fd-white); 82 - max-width: 1000px; 83 - margin: 0 auto; 84 - padding: 0 20px 30px; 85 - -webkit-font-smoothing: antialiased; 86 - } 87 - 88 - /* ---- Masthead ---- */ 89 - .fdcht-masthead { 90 - display: flex; 91 - align-items: center; 92 - justify-content: space-between; 93 - gap: 20px; 94 - flex-wrap: wrap; 95 - padding: 22px 0 18px; 96 - border-bottom: 1px solid var(--fd-bg-mid); 97 - } 98 - 99 - .fdcht-masthead img { height: 46px; width: auto; display: block; } 100 - 101 - .fdcht-masthead-label { 102 - font-size: 12px; 103 - font-weight: 600; 104 - letter-spacing: 0.16em; 105 - text-transform: uppercase; 106 - color: var(--fd-secondary); 107 - white-space: nowrap; 108 - } 109 - 110 - /* ---- Hero ---- */ 111 - .fdcht-hero { 112 - margin-top: 22px; 113 - border-radius: 6px; 114 - padding: 34px 34px 32px; 115 - background: linear-gradient(100deg, 116 - var(--fd-navy) 0%, 117 - var(--fd-navy) 56%, 118 - var(--fd-blue) 100%); 119 - } 120 - 121 - .fdcht-rule { 122 - width: 62px; height: 4px; 123 - background: var(--fd-red); 124 - border: 0; 125 - margin: 0 0 16px; 126 - } 127 - 128 - .fdcht-eyebrow { 129 - font-size: 16px; 130 - font-weight: 600; 131 - letter-spacing: 0.18em; 132 - text-transform: uppercase; 133 - color: var(--fd-blue-bright); 134 - margin-bottom: 9px; 135 - } 136 - 137 - .fdcht-hero h1 { 138 - font-size: clamp(26px, 3.6vw, 36px); 139 - font-weight: 800; 140 - line-height: 1.14; 141 - letter-spacing: -0.01em; 142 - color: var(--fd-white); 143 - margin: 0 0 12px; 144 - } 145 - 146 - .fdcht-hero p { 147 - font-size: 15.5px; 148 - font-weight: 300; 149 - line-height: 1.62; 150 - color: #dbe6ef; 151 - margin: 0; 152 - max-width: 600px; 153 - } 154 - 155 - /* ---- How-to list ---- */ 156 - .fdcht-list { 157 - display: flex; 158 - flex-direction: column; 159 - gap: 14px; 160 - margin-top: 26px; 161 - } 162 - 163 - .fdcht-row { 164 - display: flex; 165 - align-items: center; 166 - gap: 18px; 167 - background: var(--fd-white); 168 - border: 1px solid var(--fd-bg-mid); 169 - border-radius: 6px; 170 - padding: 18px 20px; 171 - text-decoration: none !important; 172 - color: inherit; 173 - transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; 174 - } 175 - 176 - .fdcht-row:hover { 177 - transform: translateY(-2px); 178 - border-color: var(--fd-blue-bright); 179 - box-shadow: 0 12px 26px rgba(0,51,102,0.14); 180 - } 181 - 182 - .fdcht-row:focus-visible { 183 - outline: 3px solid var(--fd-blue-bright); 184 - outline-offset: 2px; 185 - } 186 - 187 - .fdcht-badge { 188 - width: 46px; height: 46px; 189 - border-radius: 8px; 190 - background: var(--fd-ice); 191 - display: flex; 192 - align-items: center; 193 - justify-content: center; 194 - flex: 0 0 auto; 195 - } 196 - 197 - .fdcht-badge svg { 198 - width: 22px; height: 22px; 199 - fill: none; 200 - stroke: var(--fd-navy); 201 - stroke-width: 1.7; 202 - stroke-linecap: round; 203 - stroke-linejoin: round; 204 - } 205 - 206 - .fdcht-badge svg .accent { stroke: var(--fd-blue-bright); } 207 - 208 - .fdcht-row-text { flex: 1 1 auto; min-width: 0; } 209 - 210 - .fdcht-q { 211 - display: block; 212 - font-size: 16.5px; 213 - font-weight: 700; 214 - line-height: 1.35; 215 - color: var(--fd-navy); 216 - } 217 - 218 - .fdcht-tag { 219 - display: inline-flex; 220 - align-items: center; 221 - gap: 5px; 222 - font-size: 12px; 223 - font-weight: 600; 224 - letter-spacing: .04em; 225 - text-transform: uppercase; 226 - color: var(--fd-secondary); 227 - margin-top: 5px; 228 - } 229 - 230 - .fdcht-tag svg { 231 - width: 12px; height: 12px; 232 - fill: var(--fd-secondary); 233 - stroke: none; 234 - } 235 - 236 - .fdcht-watch { 237 - flex: 0 0 auto; 238 - display: flex; 239 - align-items: center; 240 - gap: 8px; 241 - font-size: 13px; 242 - font-weight: 600; 243 - color: var(--fd-red); 244 - white-space: nowrap; 245 - } 246 - 247 - .fdcht-watch svg { 248 - width: 30px; height: 30px; 249 - flex: 0 0 auto; 250 - } 251 - 252 - .fdcht-watch svg circle { 253 - fill: var(--fd-red); 254 - transition: fill .2s ease; 255 - } 256 - 257 - .fdcht-watch svg path { 258 - fill: var(--fd-white); 259 - } 260 - 261 - .fdcht-row:hover .fdcht-watch svg circle { fill: var(--fd-navy); } 262 - 263 - /* ---- Footer ---- */ 264 - .fdcht-footer { 265 - margin-top: 30px; 266 - padding-top: 18px; 267 - border-top: 1px solid var(--fd-bg-mid); 268 - display: flex; 269 - justify-content: space-between; 270 - gap: 16px; 271 - flex-wrap: wrap; 272 - font-size: 12.5px; 273 - color: var(--fd-secondary); 274 - } 275 - 276 - @media (max-width: 720px) { 277 - .fdcht-hub { padding: 0 12px 24px; } 278 - .fdcht-masthead img { height: 38px; } 279 - .fdcht-hero { padding: 26px 22px 24px; } 280 - .fdcht-row { padding: 16px; gap: 14px; } 281 - .fdcht-watch span { display: none; } 282 - .fdcht-footer { justify-content: flex-start; } 283 - } 284 - 285 - @media (prefers-reduced-motion: reduce) { 286 - .fdcht-row, .fdcht-watch svg circle { transition: none; } 287 - } 288 -</style> 289 - 290 -<div class="fdcht-hub"> 291 - 292 - <div class="fdcht-masthead"> 293 - <img src="https://learn.firstdigital.com/bin/download/Main/WebHome/FirstDigital-Logo.png?rev=1.3" alt="FirstDigital"> 294 - <span class="fdcht-masthead-label">Fiber · Internet · Cloud · Voice</span> 295 - </div> 296 - 297 - <section class="fdcht-hero"> 298 - <hr class="fdcht-rule"> 299 - <div class="fdcht-eyebrow">Cloud Connected PSTN</div> 300 - <h1>How To’s</h1> 301 - <p>Short video walkthroughs for common Cloud Connected PSTN tasks. Select a topic below to watch.</p> 302 - </section> 303 - 304 - <nav class="fdcht-list" aria-label="Cloud Connected PSTN how-to videos"> 305 - 306 - <a class="fdcht-row" href="https://app.vidcast.io/share/c2f50516-9950-4b45-a019-4a81a6fee293?playerMode=vidcast" target="_blank" rel="noopener"> 307 - <span class="fdcht-badge"> 308 - <svg viewBox="0 0 24 24" aria-hidden="true"><path d="M7 7h8l-2.5-2.5M7 7l2.5 2.5"/><path class="accent" d="M17 17H9l2.5 2.5M17 17l-2.5-2.5"/></svg> 309 - </span> 310 - <span class="fdcht-row-text"> 311 - <span class="fdcht-q">Moving a number between SIP trunks via FDconnect</span> 312 - <span class="fdcht-tag"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="10"/></svg>Video walkthrough</span> 313 - </span> 314 - <span class="fdcht-watch"> 315 - <span>Watch</span> 316 - <svg viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="12" r="12"/><path d="M10 8.5l6 3.5-6 3.5z"/></svg> 317 - </span> 318 - </a> 319 - 320 - <a class="fdcht-row" href="https://app.vidcast.io/share/7b80781e-6678-457d-b7e4-2349a095c7d3?playerMode=vidcast" target="_blank" rel="noopener"> 321 - <span class="fdcht-badge"> 322 - <svg viewBox="0 0 24 24" aria-hidden="true"><path d="M12 3l9 4.5v5.4C21 17.7 17 20.4 12 21c-5-.6-9-3.3-9-8.1V7.5L12 3z"/><path class="accent" d="M12 8.5v4.5M12 16v.01"/></svg> 323 - </span> 324 - <span class="fdcht-row-text"> 325 - <span class="fdcht-q">Disaster Redirect Plan</span> 326 - <span class="fdcht-tag"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="10"/></svg>Video walkthrough</span> 327 - </span> 328 - <span class="fdcht-watch"> 329 - <span>Watch</span> 330 - <svg viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="12" r="12"/><path d="M10 8.5l6 3.5-6 3.5z"/></svg> 331 - </span> 332 - </a> 333 - 334 - <a class="fdcht-row" href="https://app.vidcast.io/share/9a76e07d-1a9d-4d69-9354-e0d8b5699543?playerMode=vidcast" target="_blank" rel="noopener"> 335 - <span class="fdcht-badge"> 336 - <svg viewBox="0 0 24 24" aria-hidden="true"><rect x="4" y="4" width="16" height="16" rx="2"/><path class="accent" d="M8.5 12.5l2.3 2.3L16 9.5"/></svg> 337 - </span> 338 - <span class="fdcht-row-text"> 339 - <span class="fdcht-q">Free Caller Registry</span> 340 - <span class="fdcht-tag"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="10"/></svg>Video walkthrough</span> 341 - </span> 342 - <span class="fdcht-watch"> 343 - <span>Watch</span> 344 - <svg viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="12" r="12"/><path d="M10 8.5l6 3.5-6 3.5z"/></svg> 345 - </span> 346 - </a> 347 - 348 - </nav> 349 - 350 - <div class="fdcht-footer"> 351 - <span>FirstDigital · Cloud Connected PSTN How To’s</span> 352 - <span>Need help? Contact your FirstDigital support team at 801-456-1000 or support@firstdigital.com.</span> 353 - </div> 354 - 355 -</div> 356 -{{/html}} 8 +[[Free Caller Registry>>https://app.vidcast.io/share/9a76e07d-1a9d-4d69-9354-e0d8b5699543?playerMode=vidcast]]