The Header sits under the Masthead on all NSW Government websites, products and services.
+The header sits under the masthead on all NSW Government websites, products and services.
-There are two versions of the Header:
+There are two versions of the header:
The Masterbrand Header contains the NSW Government logo and site descriptor (site name), with optional sub-descriptor and search. The sub-descriptor can be used to give greater context to users where needed, for example to identify the Department or Agency to which the site is part of.
+The masterbrand header contains the NSW Government logo and site descriptor (site name), with optional secondary descriptor and search.
The Co-brand Header contains the NSW Government logo and Co-branded logo (max 76px in height), with optional search. Depending on your logo’s ratio, the appropriate Co-brand header should be chosen:
-Horizontal stacked: On mobile the NSW Government and Co-brand logo will appear side by side. Consider this option when the Co-branded logo does not exceed 130px in width when at 48px in height. If it does, always test to ensure it does not overlap Search and Menu functions on smaller devices.
-Vertical stacked: On mobile the NSW Government will appear on top of the Co-brand logo. Consider this option when the Co-branded logo does exceed 130px in width when at 48px in height.
+The co-brand header contains the NSW Government logo and co-branded logo (max 76px in height), with optional search. Depending on your logo’s ratio, the appropriate co-brand header should be chosen:
+Horizontal stacked: On mobile the NSW Government and co-brand logo will appear side by side. Consider this option when the co-branded logo does not exceed 130px in width when at 48px in height. If it does, always test to ensure it does not overlap search and menu functions on smaller devices.
+Vertical stacked: On mobile the NSW Government will appear on top of the co-brand logo. Consider this option when the co-branded logo does exceed 130px in width when at 48px in height.
The NSW Government logo reinforces the connection to NSW Government and should always appear in the top left to create a consistent experience across digital product or services. It should appear no smaller than 76px and never smaller than the Co-branded logo.
+The NSW Government logo reinforces the connection to NSW Government and should always appear in the top left to create a consistent experience across digital product or services. It should appear no smaller than 76px and never smaller than the co-branded logo.
+ +Descriptor: Where it is important for a customer to identify a department or agency within NSW Government, a descriptor can be used. The text descriptor is treated, not as a competing logo (or coupled), but as a navigational device to help customers where they need to identify an entity.
+Secondary Descriptor: In the rare case where there is a customer need to relay back to the overarching department, two descriptors can be coupled together. Usage for this requires approval from the NSW Government Brand Team. The secondary descriptor is located directly under the primary descriptor in smaller font.
The search displays on the right hand side and can be omitted if not required.
diff --git a/src/components/header/_header.hbs b/src/components/header/_header.hbs index 6273f810..27977fdb 100644 --- a/src/components/header/_header.hbs +++ b/src/components/header/_header.hbs @@ -4,12 +4,12 @@