Skip to Content

Changes for page MS Teams Home Page:

Last modified by Chris Workman on 2026/08/21 22:35
From version 6.1
edited by Chris Workman
on 2026/07/27 16:20
Change comment: There is no comment for this version
To version 9.1
edited by Chris Workman
on 2026/07/27 17:12
Change comment: There is no comment for this version

Summary

Details

Page properties
Content
... ... @@ -1,22 +1,23 @@
1 +{{html clean="false"}}
1 1  <style>
2 -@import url('[[https:~~/~~/fonts.googleapis.com/css2?family=Fraunces:wght@500;600&family=Inter:wght@400;500;600;700&display=swap');>>https://fonts.googleapis.com/css2?family=Fraunces:wght@500;600&family=Inter:wght@400;500;600;700&display=swap');]]
3 +@import url('https://fonts.googleapis.com/css2?family=Fraunces:wght@500;600&family=Inter:wght@400;500;600;700&display=swap');
3 3  
4 4  
5 5   :root {
6 - --navy: #00346A;
7 + --navy: #00346A;
7 7   --navy-deep: #00284F;
8 - --blue: #007CB6;
9 + --blue: #007CB6;
9 9   --ice: #E3F1F8;
10 - --coral: #E11636;
11 + --coral: #E11636;
11 11   --coral-tint: #FCE1E5;
12 - --bg: #F5F8FB;
13 + --bg: #F5F8FB;
13 13   --ink: #16232F;
14 - --muted: #5A6472;
15 + --muted: #5A6472;
15 15   --card-bg: #FFFFFF;
16 - --line: #E1E8EE;
17 - }--
17 + --line: #E1E8EE;
18 + }
18 18  
19 -* { box-sizing: border-box; }
20 + * { box-sizing: border-box; }
20 20  
21 21   .fd-teams-hub {
22 22   margin: 0;
... ... @@ -41,7 +41,7 @@
41 41   height: 8px;
42 42   border-radius: 50%;
43 43   background: var(--ice);
44 - }--
45 + }
45 45  
46 46   .presence-rail span:nth-child(1) { background: var(--coral); }
47 47   .presence-rail span:nth-child(2) { background: var(--blue); }
... ... @@ -66,7 +66,7 @@
66 66   text-transform: uppercase;
67 67   color: var(--blue);
68 68   margin-bottom: 14px;
69 - }--
70 + }
70 70  
71 71   h1 {
72 72   font-family: 'Fraunces', Georgia, serif;
... ... @@ -75,7 +75,7 @@
75 75   line-height: 1.1;
76 76   color: var(--navy-deep);
77 77   margin: 0 0 16px;
78 - }--
79 + }
79 79  
80 80   header p {
81 81   font-size: 16px;
... ... @@ -82,7 +82,7 @@
82 82   line-height: 1.6;
83 83   color: var(--muted);
84 84   margin: 0;
85 - }--
86 + }
86 86  
87 87   .grid {
88 88   display: grid;
... ... @@ -120,7 +120,7 @@
120 120   .card:focus-visible {
121 121   outline: 3px solid var(--coral);
122 122   outline-offset: 3px;
123 - }--
124 + }
124 124  
125 125   .icon-wrap {
126 126   width: 44px;
... ... @@ -130,11 +130,11 @@
130 130   display: flex;
131 131   align-items: center;
132 132   justify-content: center;
133 - }--
134 + }
134 134  
135 135   .card:nth-child(2) .icon-wrap { background: var(--coral-tint); }
136 136   .card:nth-child(3) .icon-wrap { background: var(--ice); }
137 - .card:nth-child(4) .icon-wrap { background: var(--coral-tint); }--
138 + .card:nth-child(4) .icon-wrap { background: var(--coral-tint); }
138 138  
139 139   .icon-wrap svg {
140 140   width: 22px;
... ... @@ -144,13 +144,13 @@
144 144   stroke-width: 1.8;
145 145   stroke-linecap: round;
146 146   stroke-linejoin: round;
147 - }--
148 + }
148 148  
149 149   .card-title {
150 150   font-size: 18px;
151 151   font-weight: 700;
152 152   color: var(--navy-deep);
153 - }--
154 + }
154 154  
155 155   .card-desc {
156 156   font-size: 13.5px;
... ... @@ -157,7 +157,7 @@
157 157   line-height: 1.5;
158 158   color: var(--muted);
159 159   margin: -6px 0 0;
160 - }--
161 + }
161 161  
162 162   .arrow {
163 163   margin-top: auto;
... ... @@ -168,7 +168,7 @@
168 168   display: flex;
169 169   align-items: center;
170 170   gap: 6px;
171 - }--
172 + }
172 172  
173 173   .arrow svg {
174 174   width: 14px;
... ... @@ -177,7 +177,7 @@
177 177   fill: none;
178 178   stroke-width: 2;
179 179   transition: transform 0.18s ease;
180 - }--
181 + }
181 181  
182 182   .card:hover .arrow svg {
183 183   transform: translateX(3px);
... ... @@ -188,7 +188,7 @@
188 188   font-size: 12.5px;
189 189   color: var(--muted);
190 190   text-align: center;
191 - }--
192 + }
192 192  
193 193   @media (prefers-reduced-motion: reduce) {
194 194   .card, .arrow svg { transition: none; }
... ... @@ -204,11 +204,7 @@
204 204   <span></span><span></span><span></span><span></span>
205 205   </div>
206 206  
207 - <header>
208 - <div class="eyebrow">Microsoft Teams</div>
209 - <h1>Resource Hub</h1>
210 - <p>Everything you need to set up, use, and troubleshoot Microsoft Teams voice and calling &mdash; organized in one place.</p>
211 - </header>
208 +
212 212  
213 213   <nav class="grid" aria-label="Microsoft Teams resource categories">
214 214  
... ... @@ -249,6 +249,12 @@
249 249   </a>
250 250  
251 251   </nav>
249 + <footer>
250 + <div class="eyebrow">Microsoft Teams</div>
251 + <h1>Resource Hub</h1>
252 + <p>Everything you need to set up, use, and troubleshoot Microsoft Teams voice and calling &mdash; organized in one place.</p>
253 + </footer>
252 252  
253 253   <footer>FirstDigital &middot; Microsoft Teams Resource Hub</footer>
254 254  </div>
257 +{{/html}}