Added an override styles for the ActionButtons component (#635)

* Added an override for the ActionButtons component

* refactor: override action buttons styles

* refactor: rename mediaCoTheme to mediaco for consistency

---------

Co-authored-by: Sharma <[email protected]>
Co-authored-by: Siva Rama Krishna <[email protected]>
Co-authored-by: tumms2021389 <[email protected]>

Author: 3 people

angular.json

@@ -80,7 +80,7 @@
               },
               "src/assets/img"
             ],
-            "styles": ["src/styles.scss"],
+            "styles": ["src/styles.scss", "src/app/_samples/mediaco/mediaCoStyles.scss"],
             "scripts": ["./node_modules/tinymce/tinymce.min.js"],
             "customWebpackConfig": {
               "path": "./extra-webpack.config.js"

src/app/_samples/mediaco/mediaCoStyles.scss

@@ -0,0 +1,17 @@
+.mediaco {
+  // Action Buttons styles for MediaCo sample app - start
+  .button-bar {
+    gap: 1rem;
+    margin-top: 1.2rem;
+  }
+
+  .right-group {
+    margin-left: 0 !important;
+  }
+
+  .secondary-button {
+    background-color: var(--app-sys-secondary-button-background) !important;
+    border-color: var(--app-sys-secondary-button-border) !important;
+  }
+  // Action Buttons styles for MediaCo sample app - end
+}

src/themes.scss

@@ -267,7 +267,7 @@
   );
 }
 
-.mediaCoTheme {
+.mediaco {
   @include mat.theme(
     (
       color: mat.$magenta-palette,