mate-academy · agacia1515w-ops · Mar 4, 2026 · Mar 5, 2026 · Mar 5, 2026 · Mar 5, 2026
diff --git a/.eslintignore b/.eslintignore
@@ -1,2 +1,2 @@
+/backstop_data
 /dist
-/node_modules
diff --git a/.github/workflows/test.yml-template b/.github/workflows/test.yml-template
@@ -0,0 +1,29 @@
+name: Test
+
+on:
+  pull_request:
+    branches: [ master ]
+
+jobs:
+  build:
+
+    runs-on: ubuntu-latest
+
+    strategy:
+      matrix:
+        node-version: [20.x]
+
+    steps:
+    - uses: actions/checkout@v2
+    - name: Use Node.js ${{ matrix.node-version }}
+      uses: actions/setup-node@v1
+      with:
+        node-version: ${{ matrix.node-version }}
+    - run: npm install
+    - run: npm test
+    - name: Upload HTML report(backstop data)
+      if: ${{ always() }}
+      uses: actions/upload-artifact@v2
+      with:
+        name: report
+        path: backstop_data
diff --git a/.gitignore b/.gitignore
@@ -1,15 +1,2 @@
-.idea
-.vscode
-build
-dist
-node_modules
-.DS_Store
-
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
-
-raw_reports
-reports
-cypress/screenshots
-cypress/videos
+main.css
+main.css.map
diff --git a/Bose-1.jpg b/Bose-1.jpg
diff --git a/Bose-2.jpg b/Bose-2.jpg
diff --git a/Bose-3.jpg b/Bose-3.jpg
diff --git a/header.jpg b/header.jpg
diff --git a/index.html b/index.html
@@ -6,17 +6,158 @@
       name="viewport"
       content="width=device-width, initial-scale=1.0"
     />
-    <title>Miami</title>
-    <link
-      rel="stylesheet"
-      href="src/styles/main.scss"
-    />
-    <script
-      src="src/scripts/main.js"
-      defer
-    ></script>
+    <title>BOSE</title>
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap" 
+      rel="stylesheet">
+
+  <link rel="stylesheet" href="styles/main.css">
+
   </head>
+
   <body>
-    <h1>Miami</h1>
+    <header class="header">
+       <h1 class="title">
+      The world shades.
+      <br>
+      Your music shines.
+    </h1>
+    </header>
+
+
+
+ <section class="section">
+    <h2 class="title title-section">
+    Recommended
+  </h2>
+  </section>
+
+  <article class="Bose">
+      <img class="Bose__photo" src="Bose-1.jpg"  alt="">
+      <h3 class="Bose__name">Bose portable Smart speaker</h3>
+      <p class="Bose__role">Smart home</p>
+      <p class="Bose__price">$ 399.00</p>
+    </div>
+  </article>
+    <article class="Bose">
+      <img class="Bose__photo" src="Bose-2.jpg"  alt="">
+      <h3 class="Bose__name">SoundLink Flex Bluetooth speaker</h3>
+      <p class="Bose__role">Portable bluetooth</p>
+      <p class="Bose__price">$ 149.00</p>
+    </div>
+  </article>
+    <article class="Bose">
+      <img class="Bose__photo" src="Bose-3.jpg"  alt="">
+      <h3 class="Bose__name">SoundLink Color Bluetooth speaker II</h3>
+      <p class="Bose__role">Portable bluetooth</p>
+      <p class="Bose__price">$ 129.00</p>
+    </div>
+  </article>
+
+
+ <section class="section">
+    <h4 class="title title-section">
+    Browse Bose 
+    <br>
+    products by 
+    <br>
+    category
+  </h4>
+  <article class="article">
+    <div class="pictures">
+      <img src="picture-1.jpg" class="pictures__item" alt="">
+      <img src="picture-2.jpg" class="pictures__item" alt="">
+    </div>
+    <p class="article__paragraph">Headphones & earbuds</p>
+  </article>
+    <article class="article">
+    <div class="pictures">
+      <img src="picture-3.jpg" class="pictures__item" alt="">
+      <img src="picture-4.jpg" class="pictures__item" alt="">
+    </div>
+    <p class="article__paragraph">Speakers</p>
+  </article>
+    <article class="article">
+    <div class="pictures">
+      <img src="picture-5.jpg" class="pictures__item" alt="">
+      <img src="picture-6.jpg" class="pictures__item" alt="">
+    </div>
+    <p class="article__paragraph">Audio sunglasses</p>
+  </article>
+
+
+
+  <a href="#" class="button">View all</a>
+  </section>
+
+
+
+
+<main class="main">
+<h5 class="title title--secondary">
+  Why buy direct 
+  <br>
+  from Bose
+</h5>
+<p class="main__paragraph">Free 2-day shipping and returns</p>
+
+<p class="main__paragraph">90-day risk-free trial</p>
+
+<p class="main__paragraph">World class customer service</p> 
+<p class="main__paragraph">My Bose account management</p>
+
+<p class="main__paragraph main__paragraph--bold">
+  A great product is more than what’s 
+  in the box. It’s a promise of premium 
+  performance, world-class support, 
+  and everything you expect from a 
+  trusted brand. It’s just one of many 
+  reasons why you’ll shop with 
+  confidence on Bose.com.</p>
+
+    </main>
+
+ <section class="section">
+    <h6 class="title title-section">
+    Contact us
+  </h6>
+
+  <form class="form">
+    <div class="form__item">
+      <label for="name" class="form__label">Name</label>
+      <input class="form__input" type="text" 
+      placeholder="Name">
+    </div>
+
+    <div class="form__item">
+      <label for="email" class="form__label">Email</label>
+     <input class="form__input" type="email"
+      placeholder="Email">
+    </div>
+    <div class="form__item">
+      <label for="message" class="form__label">Message</label>
+      <textarea class="form__textarea" placeholder="Message"></textarea>
+    </div>
+
+    <button class="button button--primary">Send</button>
+
+
+
+  <address class="address">
+    <h7 class="address__label">Phone</h7>
+    <p class="address__content">+1 234 5555-55-55</p>
+    <h7 class="address__label">Email</h7>
+    <p class="address__content">[email protected]</p>
+    <h7 class="address__label">Address</h7>
+    <p class="address__content">
+      400 first ave.
+      <br>
+      suite 700Minneapolis, 
+      <br>
+      MN 55401
+    </p>
+  </address>
+  </section>
   </body>
 </html>
diff --git a/node_modules/.bin/acorn b/node_modules/.bin/acorn
diff --git a/node_modules/.bin/bemlint b/node_modules/.bin/bemlint
diff --git a/node_modules/.bin/browserslist b/node_modules/.bin/browserslist
diff --git a/node_modules/.bin/create-jest b/node_modules/.bin/create-jest
diff --git a/node_modules/.bin/cross-env b/node_modules/.bin/cross-env
diff --git a/node_modules/.bin/cross-env-shell b/node_modules/.bin/cross-env-shell
diff --git a/node_modules/.bin/cssesc b/node_modules/.bin/cssesc
diff --git a/node_modules/.bin/detect-libc b/node_modules/.bin/detect-libc
diff --git a/node_modules/.bin/esbuild b/node_modules/.bin/esbuild
diff --git a/node_modules/.bin/escodegen b/node_modules/.bin/escodegen
diff --git a/node_modules/.bin/esgenerate b/node_modules/.bin/esgenerate
diff --git a/node_modules/.bin/esparse b/node_modules/.bin/esparse
diff --git a/node_modules/.bin/esvalidate b/node_modules/.bin/esvalidate
diff --git a/node_modules/.bin/import-local-fixture b/node_modules/.bin/import-local-fixture
diff --git a/node_modules/.bin/is-docker b/node_modules/.bin/is-docker
diff --git a/node_modules/.bin/jest b/node_modules/.bin/jest
diff --git a/node_modules/.bin/js-yaml b/node_modules/.bin/js-yaml
diff --git a/node_modules/.bin/jsesc b/node_modules/.bin/jsesc
diff --git a/node_modules/.bin/json5 b/node_modules/.bin/json5
diff --git a/node_modules/.bin/linthtml b/node_modules/.bin/linthtml
diff --git a/node_modules/.bin/mate-scripts b/node_modules/.bin/mate-scripts
diff --git a/node_modules/.bin/nanoid b/node_modules/.bin/nanoid
diff --git a/node_modules/.bin/node-which b/node_modules/.bin/node-which
diff --git a/node_modules/.bin/parser b/node_modules/.bin/parser
diff --git a/node_modules/.bin/prettier b/node_modules/.bin/prettier
diff --git a/node_modules/.bin/resolve b/node_modules/.bin/resolve
diff --git a/node_modules/.bin/rimraf b/node_modules/.bin/rimraf
diff --git a/node_modules/.bin/rollup b/node_modules/.bin/rollup
diff --git a/node_modules/.bin/sass b/node_modules/.bin/sass
diff --git a/node_modules/.bin/semver b/node_modules/.bin/semver
diff --git a/node_modules/.bin/stylelint b/node_modules/.bin/stylelint
diff --git a/node_modules/.bin/tree-kill b/node_modules/.bin/tree-kill
diff --git a/node_modules/.bin/update-browserslist-db b/node_modules/.bin/update-browserslist-db
diff --git a/node_modules/.bin/vite b/node_modules/.bin/vite
diff --git a/node_modules/.bin/yaml b/node_modules/.bin/yaml