@ably/ui 11.0.0 → 11.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/core/Meganav.jsx +15 -2
  2. package/core/MeganavContentDevelopers.jsx +15 -2
  3. package/core/styles.css +1 -1
  4. package/package.json +1 -1
  5. package/src/core/MeganavContentDevelopers/component.html.erb +9 -2
  6. package/src/core/MeganavContentDevelopers/component.jsx +11 -1
  7. package/src/core/styles/text.css +1 -1
package/core/Meganav.jsx CHANGED
@@ -1013,7 +1013,7 @@ var MeganavContentDevelopers = function MeganavContentDevelopers(_ref) {
1013
1013
  className: "ui-meganav-media-heading"
1014
1014
  }, "Tutorials & Demos"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
1015
1015
  className: "ui-meganav-media-copy"
1016
- }, "Get stuck in with our hands-on resources. ")))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
1016
+ }, "Get stuck in with our hands-on resources.")))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
1017
1017
  href: absUrl("/reference-guide-chat"),
1018
1018
  className: "ui-meganav-media-with-image group"
1019
1019
  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
@@ -1025,7 +1025,19 @@ var MeganavContentDevelopers = function MeganavContentDevelopers(_ref) {
1025
1025
  className: "ui-meganav-media-heading"
1026
1026
  }, "Chat apps reference guide"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
1027
1027
  className: "ui-meganav-media-copy"
1028
- }, "Learn how to build chat apps with Ably.")))))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
1028
+ }, "Learn how to build chat apps with Ably.")))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
1029
+ href: absUrl("/reference-guide-multiplayer"),
1030
+ className: "ui-meganav-media-with-image group"
1031
+ }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
1032
+ name: "icon-multi-user-spaces-col",
1033
+ size: "2.5rem"
1034
+ }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
1035
+ className: "flex flex-col justify-center"
1036
+ }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
1037
+ className: "ui-meganav-media-heading"
1038
+ }, "Multiplayer reference guide"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
1039
+ className: "ui-meganav-media-copy"
1040
+ }, "Learn how to build collaborative features with Ably.")))))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
1029
1041
  className: "col-span-full md:col-span-4 pt-8 pb-24 md:py-24 lg:py-32 px-24 sm:px-32 md:px-0"
1030
1042
  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("h3", {
1031
1043
  className: "ui-meganav-overline uppercase",
@@ -1053,6 +1065,7 @@ var MeganavContentDevelopers = function MeganavContentDevelopers(_ref) {
1053
1065
  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
1054
1066
  className: "ui-meganav-media-heading"
1055
1067
  }, "Status", /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("iframe", {
1068
+ title: "Ably status",
1056
1069
  src: "https://status.ably.com/embed/icon",
1057
1070
  allowtransparency: "true",
1058
1071
  frameBorder: "0",
package/core/MeganavContentDevelopers.jsx CHANGED
@@ -242,7 +242,7 @@ var MeganavContentDevelopers = function MeganavContentDevelopers(_ref) {
242
242
  className: "ui-meganav-media-heading"
243
243
  }, "Tutorials & Demos"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
244
244
  className: "ui-meganav-media-copy"
245
- }, "Get stuck in with our hands-on resources. ")))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
245
+ }, "Get stuck in with our hands-on resources.")))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
246
246
  href: absUrl("/reference-guide-chat"),
247
247
  className: "ui-meganav-media-with-image group"
248
248
  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
@@ -254,7 +254,19 @@ var MeganavContentDevelopers = function MeganavContentDevelopers(_ref) {
254
254
  className: "ui-meganav-media-heading"
255
255
  }, "Chat apps reference guide"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
256
256
  className: "ui-meganav-media-copy"
257
- }, "Learn how to build chat apps with Ably.")))))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
257
+ }, "Learn how to build chat apps with Ably.")))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
258
+ href: absUrl("/reference-guide-multiplayer"),
259
+ className: "ui-meganav-media-with-image group"
260
+ }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
261
+ name: "icon-multi-user-spaces-col",
262
+ size: "2.5rem"
263
+ }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
264
+ className: "flex flex-col justify-center"
265
+ }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
266
+ className: "ui-meganav-media-heading"
267
+ }, "Multiplayer reference guide"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
268
+ className: "ui-meganav-media-copy"
269
+ }, "Learn how to build collaborative features with Ably.")))))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
258
270
  className: "col-span-full md:col-span-4 pt-8 pb-24 md:py-24 lg:py-32 px-24 sm:px-32 md:px-0"
259
271
  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("h3", {
260
272
  className: "ui-meganav-overline uppercase",
@@ -282,6 +294,7 @@ var MeganavContentDevelopers = function MeganavContentDevelopers(_ref) {
282
294
  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
283
295
  className: "ui-meganav-media-heading"
284
296
  }, "Status", /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("iframe", {
297
+ title: "Ably status",
285
298
  src: "https://status.ably.com/embed/icon",
286
299
  allowtransparency: "true",
287
300
  frameBorder: "0",
package/core/styles.css CHANGED
@@ -347,7 +347,7 @@
347
347
 
348
348
  .ui-text-h4 {
349
349
  @apply font-sans font-medium text-cool-black;
350
- @apply text-h4 uppercase;
350
+ @apply text-h4;
351
351
  @apply tracking-widen-0.1;
352
352
  }
353
353
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ably/ui",
3
- "version": "11.0.0",
3
+ "version": "11.2.0",
4
4
  "description": "Home of the Ably design system library ([design.ably.com](https://design.ably.com)). It provides a showcase, development/test environment and a publishing pipeline for different distributables.",
5
5
  "repository": {
6
6
  "type": "git",
package/src/core/MeganavContentDevelopers/component.html.erb CHANGED
@@ -35,7 +35,6 @@
35
35
  </li>
36
36
  </ul>
37
37
  </div>
38
-
39
38
  <div class="col-span-full md:col-span-4 pb-8 md:py-24 lg:py-32 px-24 sm:px-32 md:px-0">
40
39
  <ul class="md:mt-40" aria-labelledby="meganav-developers-panel-explore">
41
40
  <li>
@@ -65,9 +64,17 @@
65
64
  </div>
66
65
  <% end %>
67
66
  </li>
67
+ <li>
68
+ <%= link_to abs_url("/reference-guide-multiplayer"), class: "ui-meganav-media-with-image group" do %>
69
+ <%= render(AblyUi::Core::Icon.new(name: "icon-multi-user-spaces-col", size: "2.5rem")) %>
70
+ <div class="flex flex-col justify-center">
71
+ <p class="ui-meganav-media-heading">Multiplayer reference guide</p>
72
+ <p class="ui-meganav-media-copy">Learn how to build collaborative features with Ably.</p>
73
+ </div>
74
+ <% end %>
75
+ </li>
68
76
  </ul>
69
77
  </div>
70
-
71
78
  <div class="col-span-full md:col-span-4 pt-8 pb-24 md:py-24 lg:py-32 px-24 sm:px-32 md:px-0">
72
79
  <h3 class="ui-meganav-overline uppercase" id="meganav-developers-panel-quick-links">
73
80
  Quick links
package/src/core/MeganavContentDevelopers/component.jsx CHANGED
@@ -58,7 +58,7 @@ const MeganavContentDevelopers = ({ absUrl }) => (
58
58
  <Icon name="icon-display-tutorials-demos-col" size="2.5rem" />
59
59
  <div className="flex flex-col justify-center">
60
60
  <p className="ui-meganav-media-heading">Tutorials & Demos</p>
61
- <p className="ui-meganav-media-copy">Get stuck in with our hands-on resources. </p>
61
+ <p className="ui-meganav-media-copy">Get stuck in with our hands-on resources.</p>
62
62
  </div>
63
63
  </a>
64
64
  </li>
@@ -71,6 +71,15 @@ const MeganavContentDevelopers = ({ absUrl }) => (
71
71
  </div>
72
72
  </a>
73
73
  </li>
74
+ <li>
75
+ <a href={absUrl("/reference-guide-multiplayer")} className="ui-meganav-media-with-image group">
76
+ <Icon name="icon-multi-user-spaces-col" size="2.5rem" />
77
+ <div className="flex flex-col justify-center">
78
+ <p className="ui-meganav-media-heading">Multiplayer reference guide</p>
79
+ <p className="ui-meganav-media-copy">Learn how to build collaborative features with Ably.</p>
80
+ </div>
81
+ </a>
82
+ </li>
74
83
  </ul>
75
84
  </div>
76
85
 
@@ -99,6 +108,7 @@ const MeganavContentDevelopers = ({ absUrl }) => (
99
108
  <p className="ui-meganav-media-heading">
100
109
  Status
101
110
  <iframe
111
+ title="Ably status"
102
112
  src="https://status.ably.com/embed/icon"
103
113
  allowtransparency="true"
104
114
  frameBorder="0"
package/src/core/styles/text.css CHANGED
@@ -25,7 +25,7 @@
25
25
 
26
26
  .ui-text-h4 {
27
27
  @apply font-sans font-medium text-cool-black;
28
- @apply text-h4 uppercase;
28
+ @apply text-h4;
29
29
  @apply tracking-widen-0.1;
30
30
  }
31
31