chore: rename css piano (#44210)

* chore: rename files

* chore: update codebase

* chore: proper title case

client/i18n/locales/chinese-traditional/intro.json

@@ -113,7 +113,7 @@
           "在這個課程中，你將使用 CSS 來創建你自己的畢加索風格的畫。你將學習 FontAwesome SVG 圖標、CSS 定位，並增強你已經學習過的技能。"
         ]
       },
-      "css-piano": {
+      "learn-responsive-web-design-by-building-a-piano": {
         "title": "CSS 鋼琴",
         "intro": [
           "",

client/i18n/locales/chinese/intro.json

@@ -113,7 +113,7 @@
           "在这个课程中，你将使用 CSS 来创建你自己的毕加索风格的画。你将学习 FontAwesome SVG 图标、CSS 定位，并增强你已经学习过的技能。"
         ]
       },
-      "css-piano": {
+      "learn-responsive-web-design-by-building-a-piano": {
         "title": "CSS 钢琴",
         "intro": [
           "",

client/i18n/locales/english/intro.json

@@ -95,7 +95,7 @@
           "In this course, you will use CSS to create your own painting in the style of Picasso. You will learn about FontAwesome SVG icons, CSS positioning, and reinforce the skills you have already been learning."
         ]
       },
-      "css-piano": { "title": "CSS Piano", "intro": ["", ""] },
+      "learn-responsive-web-design-by-building-a-piano": { "title": "Learn Responsive Web Design by Building a Piano", "intro": ["", ""] },
       "css-photo-gallery": { "title": "CSS Photo Gallery", "intro": ["", ""] },
       "learn-css-grid-by-building-a-magazine": { "title": "Learn CSS Grid by Building a Magazine", "intro": ["", ""] },
       "css-nutrition-label": {

client/i18n/locales/espanol/intro.json

@@ -113,7 +113,7 @@
           "En este curso, usarás CSS para crear tu propia pintura en el estilo de Picasso. Aprenderás sobre los iconos SVG de FontAwesome, posicionamiento CSS, y reforzarás las habilidades que ya has estado aprendiendo."
         ]
       },
-      "css-piano": {
+      "learn-responsive-web-design-by-building-a-piano": {
         "title": "Piano CSS",
         "intro": [
           "",

client/i18n/locales/italian/intro.json

@@ -113,7 +113,7 @@
           "In questo corso, userai CSS per creare il tuo dipinto nello stile di Picasso. Imparerai le icone di FontAwesome SVG, il posizionamento CSS e rinforzerai le abilità che hai già imparato."
         ]
       },
-      "css-piano": {
+      "learn-responsive-web-design-by-building-a-piano": {
         "title": "Piano CSS",
         "intro": [
           "",

client/i18n/locales/portuguese/intro.json

@@ -113,7 +113,7 @@
           "Neste curso, você usará o CSS para criar sua própria pintura ao estilo de Picasso. Você aprenderá sobre os ícones SVG FontAwesome, posicionamento em CSS e reforçará as habilidades que você já está aprendendo."
         ]
       },
-      "css-piano": {
+      "learn-responsive-web-design-by-building-a-piano": {
         "title": "Piano em CSS",
         "intro": [
           "",

client/src/pages/learn/responsive-web-design/learn-responsive-web-design-by-building-a-piano/index.md

@@ -0,0 +1,10 @@
+---
+title: Introduction to the Learn Responsive Web Design by Building a Piano
+block: learn-responsive-web-design-by-building-a-piano
+superBlock: Responsive Web Design
+isBeta: true
+---
+
+## Introduction to the Learn Responsive Web Design by Building a Piano
+
+This is a test for the new project-based curriculum.

client/utils/help-category-map.json

@@ -8,7 +8,7 @@
   "css-grid": "HTML-CSS",
   "learn-the-css-box-model-by-building-a-rothko-painting": "HTML-CSS",
   "css-picasso-painting": "HTML-CSS",
-  "css-piano": "HTML-CSS",
+  "learn-responsive-web-design-by-building-a-piano": "HTML-CSS",
   "responsive-web-design-projects": "HTML-CSS",
   "basic-javascript": "JavaScript",
   "es6": "JavaScript",

curriculum/challenges/_meta/learn-responsive-web-design-by-building-a-piano/meta.json

@@ -1,8 +1,8 @@
 {
-  "name": "CSS Piano",
+  "name": "Learn Responsive Web Design by Building a Piano",
   "isUpcomingChange": true,
   "usesMultifileEditor": true,
-  "dashedName": "css-piano",
+  "dashedName": "learn-responsive-web-design-by-building-a-piano",
   "order": 13,
   "time": "5 hours",
   "template": "",

utils/preformatted-block-names.json

@@ -4,7 +4,7 @@
   "basic-html-and-html5": "Basic HTML and HTML5",
   "css-flexbox": "CSS Flexbox",
   "css-grid": "CSS Grid",
-  "css-piano": "CSS Piano",
+  "learn-responsive-web-design-by-building-a-piano": "Learn Responsive Web Design by Building a Piano",
   "devops": "DevOps",
   "es6": "ES6",
   "information-security-with-helmetjs": "Information Security with HelmetJS",