diff --git a/src/patterns/04-components/00-cms-styles/dashboards/_dashboards.scss b/src/patterns/04-components/00-cms-styles/dashboards/_dashboards.scss
new file mode 100644
index 0000000000000000000000000000000000000000..ad610618bc3e3da0d0d2a2928336f7cf57167144
--- /dev/null
+++ b/src/patterns/04-components/00-cms-styles/dashboards/_dashboards.scss
@@ -0,0 +1,56 @@
+@use '../../../01-core' as *;
+
+.dashboards{
+ &-container{
+ .panel{
+ padding:0;
+ }
+ .uw-search-form {
+ margin:0 0 var(--size-2) 0;
+ .catalog-search-form,
+ .service-search-form,
+ .uw-project-search-form {
+ .form-item{
+ height: 2.39rem;
+ margin: 0;
+ }
+ .form-text {
+ height: 2.39rem;
+ margin: 0;
+ }
+ }
+ }
+ }
+}
+
+// Edit tabs for the admin pages in Drupal.
+.tabs{
+ &__trigger{
+ padding-bottom: 0;
+ &:hover,
+ &:focus{
+ background: var(--gray-2);
+ border: var(--size-xs) solid var(--gray-4);
+ }
+ .is-collapse-enabled &{
+ height: 1.72rem;
+ }
+ }
+ .is-collapse-enabled &{
+ &::before{
+ display: none;
+ }
+ li{
+ &:not(.is-active){
+ display: none;
+ }
+ }
+ }
+ &.is-open{
+ li{
+ &:not(:first-child){
+ display: inherit;
+ }
+ }
+ }
+}
diff --git a/src/patterns/04-components/00-cms-styles/layout-builder/_layout-builder.scss b/src/patterns/04-components/00-cms-styles/layout-builder/_layout-builder.scss
new file mode 100644
index 0000000000000000000000000000000000000000..a516b3b3b87f2e980dfe9923fdb17d7cc1a78488
--- /dev/null
+++ b/src/patterns/04-components/00-cms-styles/layout-builder/_layout-builder.scss
@@ -0,0 +1,339 @@
+// @file
+// Styles for the Layout Builder stuff module.
+
+@use '../../../01-core' as *;
+
+/* stylelint-disable-next-line selector-no-qualifying-type */
+// constraining sections of the theme with the site-container
+ .uw-highlighted,
+ .block-page-title-block,
+ .block-local-tasks-block,
+ .node-form,
+ .admin-list,
+ .js-media-library-view,
+ .messages,
+ .message,
+ .contextual-region.profile,
+ .uw-content-moderation__wrapper,
+ form {
+ @include uw-contained-width;
+ padding: var(--size-2);
+ @media(min-width: $screen-xl) {
+ padding: var(--size-2) 0;
+ }
+ }
+ // Reset padding
+ .uw-content-moderation__wrapper{
+ padding: var(--size-2);
+ }
+ // right column on edit
+ .entity-meta__header {
+ background-color: #fffbda;
+ }
+ // overlay popuup
+ .ui-dialog .ui-dialog-title {
+ font-family: var(--font-condensedbook);
+ font-size: var(--font-size-4);
+ font-weight: 400;
+ }
+ .js-media-library-view {
+ background: gesso-color(form, fieldset, fieldset-background);
+ border: 1px solid #bfbfbf;
+ border-radius: 2px;
+ padding: var(--size-2);
+ }
+ // button in popup
+ .ui-dialog-buttonpane {
+ //box-shadow: 6px;
+ }
+ .ui-dialog {
+ // Reset the widths put from default size values.
+ input[size="60"],
+ input[size="120"] {
+ max-width: 100%;
+ width: 100%;
+ }
+
+ .media-library-widget {
+ .fieldset-wrapper {
+ display: block;
+ }
+ }
+
+ .description {
+ font-size: gesso-font-size(-2);
+ font-style: italic;
+ }
+
+ .views-display-link {
+ font-family: var(--font-systemmedium);
+ }
+
+ form {
+ @include uw-contained-width;
+ padding: 0 !important;
+ }
+
+ .field--widget-entity-reference-paragraphs {
+ padding: var(--size-2);
+
+ .field--widget-entity-reference-paragraphs {
+ padding: 0 !important;
+ }
+ }
+
+ .field--name-field-uw-ec-items {
+ background: inherit;
+ padding: inherit;
+ }
+
+ // Adjusting the presentation of the tables.
+ .field--widget-entity-reference-paragraphs td {
+ background: inherit;
+ border: var(--size-xs) solid var(--gray-3);
+ padding: var(--size-2);
+ }
+
+ .field--widget-entity-reference-paragraphs .field-label {
+ border-width: var(--size-xs) var(--size-xs) 0;
+
+ .label {
+ font-size: var(--font-size-1);
+ }
+ }
+
+ // Adjusting the drag handles ion the draggable tables.
+ .paragraph-type--uw-para-fact-figure .tabledrag-handle .handle {
+ margin: 0;
+ }
+
+ .draggable .tabledrag-handle {
+
+ cursor: move;
+ float: inherit;
+ height: inherit;
+ margin-left: inherit;
+ overflow: inherit;
+ text-decoration: none;
+
+ .handle {
+ float: left;
+ height: var(--size-4);
+ padding: 0;
+ width: var(--size-4)
+
+ }
+ }
+
+ .tabledrag-hide {
+ border-width: var(--size-xs) var(--size-xs) 0;
+ font-family: var(--font-condensedbook);
+ font-size:var(--font-size-1);
+ font-weight: 400;
+ margin: 0;
+ padding: 0 var(--size-2);
+ text-align: center;
+
+ }
+
+ // Removes gap at bottom of editor in dialogue
+ .odd .form-item,
+ .even .form-item {
+ margin-bottom: 0 !important;
+ }
+
+ // Resets the min width.
+ .field-multiple-table {
+ min-width: inherit;
+ }
+
+ // Reset media
+ .media-library-item--grid {
+ padding-bottom:var(--size-4);
+ }
+
+ }
+ // Token dialog popup.
+ .token-tree-dialog {
+ font-family: var(--font-book);
+
+ table td {
+ padding: var(--size-1) var(--size-2);
+ }
+ }
+ // Makes the flex basis accomodate more characters.
+ .js .paragraph-type-title {
+ flex-basis: 35%;
+ }
+ .tabledrag-changed.warning {
+ color: #e00 !important;
+ }
+
+
+ // Edits of buttons in the wcms forms
+ .button,
+ button {
+
+ .layout-builder-form &,
+ .form-actions & {
+ font-size: var(--font-size-000);
+ height: 2.5rem;
+ line-height: 2.75;
+ max-width: inherit;
+ padding: var(--size-05);
+
+ &:hover,
+ &:focus {
+ padding: var(--size-05);
+ }
+ }
+
+ .media-library-content &,
+ .paragraphs-actions &,
+ .paragraph-type-top &,
+ .paragraphs-dropbutton-wrapper & ,
+ .user-login-form &{
+ font-size: var(--font-size-000);
+ font-weight: 200;
+ height: inherit;
+ //letter-spacing:inherit;
+ max-width: 12rem;
+ padding: var(--size-1) var(--size-2);
+ width: 100%;
+
+ &:hover,
+ &:focus {
+ padding: var(--size-1) var(--size-2);
+ }
+ }
+
+ .ui-dialog & {
+ margin: var(--size-1) 0 0 0;
+
+ }
+
+ .ui-dialog-buttonset.form-actions & {
+ max-width: 10rem;
+ }
+
+ .user-login-form .form-actions & {
+ @include button();
+ }
+
+ .tabledrag-toggle-weight-wrapper & {
+ font-size: var(--font-size-000);
+ font-weight: 200;
+ max-width: 10rem;
+ padding: 0;
+ text-align: inherit;
+ width: inherit;
+
+ &:hover,
+ &:focus {
+ background: none;
+ font-size: var(--font-size-000);
+ font-weight: 200;
+ max-width: 10rem;
+ padding: 0;
+ text-align: inherit;
+ width: inherit;
+ }
+ }
+ }
+
+ // Reset the button in media dialog
+ .media-library-widget__toggle-weight {
+ font-size: var(--font-size-000) !important;
+ font-weight: 200;
+ max-width: 10rem;
+ padding: 0;
+ text-align: inherit;
+ width: inherit;
+
+ &:hover,
+ &:focus {
+ background: none;
+ font-size: var(--font-size-000);
+ font-weight: 200;
+ max-width: 10rem;
+ padding: 0;
+ text-align: inherit;
+ width: inherit;
+ }
+ }
+
+ // Removce Box shadow on the dashboard boxes.
+ .layouts-dashboards-3 .drow > div,
+ .layouts-dashboards-2 .drow > div,
+ .layouts-dashboards-1 .drow > div {
+ box-shadow: none;
+ }
+
+ // overlay labels
+ .uw-admin-label {
+ background-color: var(--gray-5) !important;
+ color: var(--uw-white);
+ font-family: var(--font-system);
+ font-size: var(--font-size-000);
+ left: -1px;
+ padding: 0.2rem var(--size-2);
+ position: absolute;
+ top: -1.5rem !important;;
+ }
+
+ // Give padding for the admin labels.
+ .layout-builder__region {
+ padding: var(--size-05);
+ }
+
+ .contextual .trigger {
+ color: #f03;
+ width: inherit;
+
+ &:focus {
+ color: #25ffcc;
+ width: inherit;
+ }
+ }
+
+ // Color for button in dialog
+ .paragraphs-dropdown-action.button {
+ color: var(--gray-6);
+ }
+.uw-content-moderation__wrapper{
+ display: none;
+ .user-logged-in &{
+ display: block;
+ margin-bottom: var(--size-4);
+
+ }
+}
+
+// Edit tabs for the main pages in drupal
+.tabs{
+ &__trigger{
+ padding-bottom: 0;
+ &:hover,
+ &:focus{
+ background: var(--gray-2);
+ border: var(--size-xs) solid var(-gray-4);
+ }
+ }
+ .is-collapse-enabled &{
+ &::before{
+ display: none;
+ }
+ li{
+ &:not(.is-active){
+ display: none;
+ }
+ }
+ }
+ &.is-open{
+ li{
+ &:not(:first-child){
+ display: inherit;
+ }
+ }
+ }
+}
diff --git a/src/patterns/04-components/00-cms-styles/toolbar-menu/_toolbar-menu.scss b/src/patterns/04-components/00-cms-styles/toolbar-menu/_toolbar-menu.scss
new file mode 100644
index 0000000000000000000000000000000000000000..c329506058219a74b80c22088a10ca34594e4feb
--- /dev/null
+++ b/src/patterns/04-components/00-cms-styles/toolbar-menu/_toolbar-menu.scss
@@ -0,0 +1,20 @@
+// @file
+// Styles for the Toolbar module.
+
+/* stylelint-disable-next-line selector-no-qualifying-type */
+ul.toolbar-menu {
+ font-size:var(--font-size-000);
+
+ li {
+ margin-bottom: 0;
+ padding-left: 0;
+ }
+}
+/* stylelint-disable-next-line selector-no-qualifying-type */
+.org-default .toolbar .toolbar-bar .toolbar-item {
+ color: var(--uw-white);
+ &:hover,
+ &:focus {
+ color: var(--uw-white);
+ }
+ }
diff --git a/src/patterns/04-components/_index.scss b/src/patterns/04-components/_index.scss
index e968fee00bb9b33d243b1531c29762c4c2b9f307..52d90c49c573a72fa694812b3cbc682b504ca82e 100644
--- a/src/patterns/04-components/_index.scss
+++ b/src/patterns/04-components/_index.scss
@@ -1,3 +1,6 @@
+@forward '00-cms-styles/dashboards/dashboards';
+@forward '00-cms-styles/layout-builder/layout-builder';
+@forward '00-cms-styles/toolbar-menu/toolbar-menu';
@forward 'banners/banners';
@forward 'blockquote/blockquote';
@forward 'button/button';
diff --git a/src/patterns/04-components/page-title/_page-title.scss b/src/patterns/04-components/page-title/_page-title.scss
new file mode 100644
index 0000000000000000000000000000000000000000..b1667b0e89e38ed8ccb457cc28d74ede4a1aa442
--- /dev/null
+++ b/src/patterns/04-components/page-title/_page-title.scss
@@ -0,0 +1,14 @@
+// @file
+// Styles for Page title.
+
+@use '../../01-core' as *;
+
+.block-page-title-block{
+ margin-bottom: 0;
+}
+.page-title {
+ @include uw-no-breakout();
+ margin: 0;
+ padding: 0;
+
+}
diff --git a/src/patterns/04-components/page-title/page-title.twig b/src/patterns/04-components/page-title/page-title.twig
new file mode 100644
index 0000000000000000000000000000000000000000..d34e331432f65ca6bdfc0307e9b11617168707db
--- /dev/null
+++ b/src/patterns/04-components/page-title/page-title.twig
@@ -0,0 +1 @@
+<h1 class="page-title">{{ page_title }}</h1>
diff --git a/src/patterns/04-components/page-title/page-title.yml b/src/patterns/04-components/page-title/page-title.yml
new file mode 100644
index 0000000000000000000000000000000000000000..f163e79823559966b02b322604965df3fd7d871b
--- /dev/null
+++ b/src/patterns/04-components/page-title/page-title.yml
@@ -0,0 +1,2 @@
+---
+page_title: 'Page Title'