diff --git a/.github/workflows/test.yml-template b/.github/workflows/test.yml-template new file mode 100644 index 0000000000..8b5743ecb4 --- /dev/null +++ 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/README.md b/README.md index 93d9738cc4..44eaf34127 100644 --- a/README.md +++ b/README.md @@ -65,7 +65,7 @@ Adapt the page to the following screens: 11. `git push origin develop` - to send you code for PR. 12. Create a Pull Request (PR) from your branch `develop` to branch `master` of original repo. 13. Replace `` with your Github username in the - [DEMO LINK](https://.github.io/layout_dia/). + [DEMO LINK](https://232567.github.io/layout_dia/). 14. Copy `DEMO LINK` to the PR description. > To update you PR repeat steps 7-11. diff --git a/index.html b/index.html index 1eca937738..1b0f872862 100644 --- a/index.html +++ b/index.html @@ -1,19 +1,401 @@ - - - - Dia - - - -

Dia

- - + + + + Dia Agency + + + + + + + +
+
+ + + +
+
+ +
+
+

Strategic Agency

+

We help you grow your business

+ Get Started +
+
+ +
+ +
+
+ +
+

About Our Agency

+

+ We are a strategic digital agency focused on helping brands grow through design, + technology and meaningful experiences. +

+
+ +
+ Business meeting + +
+ + + +
+
+ +
+
+ +
+
+ +
+

Who we are

+ +

+ We are a multidisciplinary digital agency focused on building meaningful + experiences that connect brands with people. +

+ +

+ From brand identity to digital products, we partner with companies to + transform ideas into powerful solutions. +

+ +

+ Our team is driven by curiosity, collaboration and a commitment to + excellence — delivering results that are visually compelling and strategically impactful. +

+
+ +
+ Creative team working together +
+ +
+
+ +
+
+ +

Our expertise

+ +
+ +
+ +

Branding

+

Creating strong brand identities

+
+ +
+ +

Design

+

Innovative and user-friendly designs

+
+ +
+ +

Strategy

+

Effective business strategies

+
+ +
+ +
+
+ +
+
+ +

Our process

+ +
+ +
+ +

Research

+

We analyze your business and market.

+ + Learn more + + +
+ +
+ +

Planning

+

We create a strategic roadmap.

+ + Learn more + + +
+ +
+ +

Execution

+

We implement the strategy effectively.

+ + Learn more + + +
+ +
+ +

Optimization

+

We monitor and improve results.

+ + Learn more + + +
+ +
+ +
+
+ +
+
+ +

What our clients say

+ +
+ +
+ Client photo +

“Working with Dia Agency was a game changer for our business.”

+

Sarah Johnson

+ Marketing Director +
+ +
+ Client photo +

“Professional, creative and extremely dedicated.”

+

Michael Smith

+ CEO — Vision Corp +
+ +
+ Client photo +

“Their process is smooth and efficient.”

+

Emily Davis

+ Product Manager +
+ +
+ +
+
+ +
+
+ +
+

Our Vision

+

+ We believe in creating meaningful digital experiences that connect brands with people. +

+ +
    +
  • Human‑centered design
  • +
  • Data‑driven decisions
  • +
  • Long‑term partnerships
  • +
+ + Learn More +
+ +
+ Team working on strategy +
+ +
+
+ +
+
+ +
+

Let’s Build Something Great Together

+

+ Whether you’re looking to elevate your brand or create a new digital experience — we’re here to help. +

+ + Get in Touch +
+ +
+ Team collaboration +
+ +
+
+ +
+
+ +

Our Portfolio

+ +
+ +
+ Project 1 +

Brand Identity

+
+ +
+ Project 2 +

Website Redesign

+
+ +
+ Project 3 +

Mobile App UI

+
+ +
+ +
+
+ +
+ +
+ +
+

Get in Touch

+

+ Have a project in mind or want to collaborate? + Send us a message and we’ll get back to you shortly. +

+ +
    +
  • + + contact@diaagency.com +
  • +
  • + + +1 (555) 123‑4567 +
  • +
  • + + 123 Creative Street, New York, USA +
  • +
+
+ +
+ Creative workspace +
+ +
+ +
+ +
+
+ +
+ +
+ +
+ +
+ +
+ + +
+ +
+ +
+ +
+ + + + + + diff --git a/package-lock.json b/package-lock.json index 1b7e1f550b..4b3ca216e5 100644 --- a/package-lock.json +++ b/package-lock.json @@ -13,7 +13,7 @@ "@linthtml/linthtml": "^0.9.6", "@mate-academy/bemlint": "latest", "@mate-academy/linthtml-config": "latest", - "@mate-academy/scripts": "^2.1.2", + "@mate-academy/scripts": "^2.1.3", "@mate-academy/stylelint-config": "latest", "jest": "^29.7.0", "jest-environment-jsdom": "^29.7.0", @@ -1510,10 +1510,11 @@ "dev": true }, "node_modules/@mate-academy/scripts": { - "version": "2.1.2", - "resolved": "https://registry.npmjs.org/@mate-academy/scripts/-/scripts-2.1.2.tgz", - "integrity": "sha512-gUXFdqqOfYzF9R3RSx2pCa5GLdOkxB9bFbF+dpUpzucdgGAANqOGdqpmNnMj+e3xA9YHraUWq3xo9cwe5vD9pQ==", + "version": "2.1.3", + "resolved": "https://registry.npmjs.org/@mate-academy/scripts/-/scripts-2.1.3.tgz", + "integrity": "sha512-a07wHTj/1QUK2Aac5zHad+sGw4rIvcNl5lJmJpAD7OxeSbnCdyI6RXUHwXhjF5MaVo9YHrJ0xVahyERS2IIyBQ==", "dev": true, + "license": "MIT", "dependencies": { "@octokit/rest": "^17.11.2", "@types/get-port": "^4.2.0", @@ -2217,286 +2218,350 @@ } }, "node_modules/@rollup/rollup-android-arm-eabi": { - "version": "4.53.3", - "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.53.3.tgz", - "integrity": "sha512-mRSi+4cBjrRLoaal2PnqH82Wqyb+d3HsPUN/W+WslCXsZsyHa9ZeQQX/pQsZaVIWDkPcpV6jJ+3KLbTbgnwv8w==", + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.60.0.tgz", + "integrity": "sha512-WOhNW9K8bR3kf4zLxbfg6Pxu2ybOUbB2AjMDHSQx86LIF4rH4Ft7vmMwNt0loO0eonglSNy4cpD3MKXXKQu0/A==", "cpu": [ "arm" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "android" ] }, "node_modules/@rollup/rollup-android-arm64": { - "version": "4.53.3", - "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.53.3.tgz", - "integrity": "sha512-CbDGaMpdE9sh7sCmTrTUyllhrg65t6SwhjlMJsLr+J8YjFuPmCEjbBSx4Z/e4SmDyH3aB5hGaJUP2ltV/vcs4w==", + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.60.0.tgz", + "integrity": "sha512-u6JHLll5QKRvjciE78bQXDmqRqNs5M/3GVqZeMwvmjaNODJih/WIrJlFVEihvV0MiYFmd+ZyPr9wxOVbPAG2Iw==", "cpu": [ "arm64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "android" ] }, "node_modules/@rollup/rollup-darwin-arm64": { - "version": "4.53.3", - "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.53.3.tgz", - "integrity": "sha512-Nr7SlQeqIBpOV6BHHGZgYBuSdanCXuw09hon14MGOLGmXAFYjx1wNvquVPmpZnl0tLjg25dEdr4IQ6GgyToCUA==", + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.60.0.tgz", + "integrity": "sha512-qEF7CsKKzSRc20Ciu2Zw1wRrBz4g56F7r/vRwY430UPp/nt1x21Q/fpJ9N5l47WWvJlkNCPJz3QRVw008fi7yA==", "cpu": [ "arm64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "darwin" ] }, "node_modules/@rollup/rollup-darwin-x64": { - "version": "4.53.3", - "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.53.3.tgz", - "integrity": "sha512-DZ8N4CSNfl965CmPktJ8oBnfYr3F8dTTNBQkRlffnUarJ2ohudQD17sZBa097J8xhQ26AwhHJ5mvUyQW8ddTsQ==", + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.60.0.tgz", + "integrity": "sha512-WADYozJ4QCnXCH4wPB+3FuGmDPoFseVCUrANmA5LWwGmC6FL14BWC7pcq+FstOZv3baGX65tZ378uT6WG8ynTw==", "cpu": [ "x64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "darwin" ] }, "node_modules/@rollup/rollup-freebsd-arm64": { - "version": "4.53.3", - "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.53.3.tgz", - "integrity": "sha512-yMTrCrK92aGyi7GuDNtGn2sNW+Gdb4vErx4t3Gv/Tr+1zRb8ax4z8GWVRfr3Jw8zJWvpGHNpss3vVlbF58DZ4w==", + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.60.0.tgz", + "integrity": "sha512-6b8wGHJlDrGeSE3aH5mGNHBjA0TTkxdoNHik5EkvPHCt351XnigA4pS7Wsj/Eo9Y8RBU6f35cjN9SYmCFBtzxw==", "cpu": [ "arm64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "freebsd" ] }, "node_modules/@rollup/rollup-freebsd-x64": { - "version": "4.53.3", - "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.53.3.tgz", - "integrity": "sha512-lMfF8X7QhdQzseM6XaX0vbno2m3hlyZFhwcndRMw8fbAGUGL3WFMBdK0hbUBIUYcEcMhVLr1SIamDeuLBnXS+Q==", + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.60.0.tgz", + "integrity": "sha512-h25Ga0t4jaylMB8M/JKAyrvvfxGRjnPQIR8lnCayyzEjEOx2EJIlIiMbhpWxDRKGKF8jbNH01NnN663dH638mA==", "cpu": [ "x64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "freebsd" ] }, "node_modules/@rollup/rollup-linux-arm-gnueabihf": { - "version": "4.53.3", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.53.3.tgz", - "integrity": "sha512-k9oD15soC/Ln6d2Wv/JOFPzZXIAIFLp6B+i14KhxAfnq76ajt0EhYc5YPeX6W1xJkAdItcVT+JhKl1QZh44/qw==", + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.60.0.tgz", + "integrity": "sha512-RzeBwv0B3qtVBWtcuABtSuCzToo2IEAIQrcyB/b2zMvBWVbjo8bZDjACUpnaafaxhTw2W+imQbP2BD1usasK4g==", "cpu": [ "arm" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ] }, "node_modules/@rollup/rollup-linux-arm-musleabihf": { - "version": "4.53.3", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.53.3.tgz", - "integrity": "sha512-vTNlKq+N6CK/8UktsrFuc+/7NlEYVxgaEgRXVUVK258Z5ymho29skzW1sutgYjqNnquGwVUObAaxae8rZ6YMhg==", + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.60.0.tgz", + "integrity": "sha512-Sf7zusNI2CIU1HLzuu9Tc5YGAHEZs5Lu7N1ssJG4Tkw6e0MEsN7NdjUDDfGNHy2IU+ENyWT+L2obgWiguWibWQ==", "cpu": [ "arm" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ] }, "node_modules/@rollup/rollup-linux-arm64-gnu": { - "version": "4.53.3", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.53.3.tgz", - "integrity": "sha512-RGrFLWgMhSxRs/EWJMIFM1O5Mzuz3Xy3/mnxJp/5cVhZ2XoCAxJnmNsEyeMJtpK+wu0FJFWz+QF4mjCA7AUQ3w==", + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.60.0.tgz", + "integrity": "sha512-DX2x7CMcrJzsE91q7/O02IJQ5/aLkVtYFryqCjduJhUfGKG6yJV8hxaw8pZa93lLEpPTP/ohdN4wFz7yp/ry9A==", "cpu": [ "arm64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ] }, "node_modules/@rollup/rollup-linux-arm64-musl": { - "version": "4.53.3", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.53.3.tgz", - "integrity": "sha512-kASyvfBEWYPEwe0Qv4nfu6pNkITLTb32p4yTgzFCocHnJLAHs+9LjUu9ONIhvfT/5lv4YS5muBHyuV84epBo/A==", + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.60.0.tgz", + "integrity": "sha512-09EL+yFVbJZlhcQfShpswwRZ0Rg+z/CsSELFCnPt3iK+iqwGsI4zht3secj5vLEs957QvFFXnzAT0FFPIxSrkQ==", "cpu": [ "arm64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ] }, "node_modules/@rollup/rollup-linux-loong64-gnu": { - "version": "4.53.3", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loong64-gnu/-/rollup-linux-loong64-gnu-4.53.3.tgz", - "integrity": "sha512-JiuKcp2teLJwQ7vkJ95EwESWkNRFJD7TQgYmCnrPtlu50b4XvT5MOmurWNrCj3IFdyjBQ5p9vnrX4JM6I8OE7g==", + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loong64-gnu/-/rollup-linux-loong64-gnu-4.60.0.tgz", + "integrity": "sha512-i9IcCMPr3EXm8EQg5jnja0Zyc1iFxJjZWlb4wr7U2Wx/GrddOuEafxRdMPRYVaXjgbhvqalp6np07hN1w9kAKw==", + "cpu": [ + "loong64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "linux" + ] + }, + "node_modules/@rollup/rollup-linux-loong64-musl": { + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loong64-musl/-/rollup-linux-loong64-musl-4.60.0.tgz", + "integrity": "sha512-DGzdJK9kyJ+B78MCkWeGnpXJ91tK/iKA6HwHxF4TAlPIY7GXEvMe8hBFRgdrR9Ly4qebR/7gfUs9y2IoaVEyog==", "cpu": [ "loong64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ] }, "node_modules/@rollup/rollup-linux-ppc64-gnu": { - "version": "4.53.3", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-ppc64-gnu/-/rollup-linux-ppc64-gnu-4.53.3.tgz", - "integrity": "sha512-EoGSa8nd6d3T7zLuqdojxC20oBfNT8nexBbB/rkxgKj5T5vhpAQKKnD+h3UkoMuTyXkP5jTjK/ccNRmQrPNDuw==", + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-ppc64-gnu/-/rollup-linux-ppc64-gnu-4.60.0.tgz", + "integrity": "sha512-RwpnLsqC8qbS8z1H1AxBA1H6qknR4YpPR9w2XX0vo2Sz10miu57PkNcnHVaZkbqyw/kUWfKMI73jhmfi9BRMUQ==", "cpu": [ "ppc64" ], "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "linux" + ] + }, + "node_modules/@rollup/rollup-linux-ppc64-musl": { + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-ppc64-musl/-/rollup-linux-ppc64-musl-4.60.0.tgz", + "integrity": "sha512-Z8pPf54Ly3aqtdWC3G4rFigZgNvd+qJlOE52fmko3KST9SoGfAdSRCwyoyG05q1HrrAblLbk1/PSIV+80/pxLg==", + "cpu": [ + "ppc64" + ], + "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ] }, "node_modules/@rollup/rollup-linux-riscv64-gnu": { - "version": "4.53.3", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.53.3.tgz", - "integrity": "sha512-4s+Wped2IHXHPnAEbIB0YWBv7SDohqxobiiPA1FIWZpX+w9o2i4LezzH/NkFUl8LRci/8udci6cLq+jJQlh+0g==", + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.60.0.tgz", + "integrity": "sha512-3a3qQustp3COCGvnP4SvrMHnPQ9d1vzCakQVRTliaz8cIp/wULGjiGpbcqrkv0WrHTEp8bQD/B3HBjzujVWLOA==", "cpu": [ "riscv64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ] }, "node_modules/@rollup/rollup-linux-riscv64-musl": { - "version": "4.53.3", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-musl/-/rollup-linux-riscv64-musl-4.53.3.tgz", - "integrity": "sha512-68k2g7+0vs2u9CxDt5ktXTngsxOQkSEV/xBbwlqYcUrAVh6P9EgMZvFsnHy4SEiUl46Xf0IObWVbMvPrr2gw8A==", + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-musl/-/rollup-linux-riscv64-musl-4.60.0.tgz", + "integrity": "sha512-pjZDsVH/1VsghMJ2/kAaxt6dL0psT6ZexQVrijczOf+PeP2BUqTHYejk3l6TlPRydggINOeNRhvpLa0AYpCWSQ==", "cpu": [ "riscv64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ] }, "node_modules/@rollup/rollup-linux-s390x-gnu": { - "version": "4.53.3", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.53.3.tgz", - "integrity": "sha512-VYsFMpULAz87ZW6BVYw3I6sWesGpsP9OPcyKe8ofdg9LHxSbRMd7zrVrr5xi/3kMZtpWL/wC+UIJWJYVX5uTKg==", + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.60.0.tgz", + "integrity": "sha512-3ObQs0BhvPgiUVZrN7gqCSvmFuMWvWvsjG5ayJ3Lraqv+2KhOsp+pUbigqbeWqueGIsnn+09HBw27rJ+gYK4VQ==", "cpu": [ "s390x" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ] }, "node_modules/@rollup/rollup-linux-x64-gnu": { - "version": "4.53.3", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.53.3.tgz", - "integrity": "sha512-3EhFi1FU6YL8HTUJZ51imGJWEX//ajQPfqWLI3BQq4TlvHy4X0MOr5q3D2Zof/ka0d5FNdPwZXm3Yyib/UEd+w==", + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.60.0.tgz", + "integrity": "sha512-EtylprDtQPdS5rXvAayrNDYoJhIz1/vzN2fEubo3yLE7tfAw+948dO0g4M0vkTVFhKojnF+n6C8bDNe+gDRdTg==", "cpu": [ "x64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ] }, "node_modules/@rollup/rollup-linux-x64-musl": { - "version": "4.53.3", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.53.3.tgz", - "integrity": "sha512-eoROhjcc6HbZCJr+tvVT8X4fW3/5g/WkGvvmwz/88sDtSJzO7r/blvoBDgISDiCjDRZmHpwud7h+6Q9JxFwq1Q==", + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.60.0.tgz", + "integrity": "sha512-k09oiRCi/bHU9UVFqD17r3eJR9bn03TyKraCrlz5ULFJGdJGi7VOmm9jl44vOJvRJ6P7WuBi/s2A97LxxHGIdw==", "cpu": [ "x64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ] }, + "node_modules/@rollup/rollup-openbsd-x64": { + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-openbsd-x64/-/rollup-openbsd-x64-4.60.0.tgz", + "integrity": "sha512-1o/0/pIhozoSaDJoDcec+IVLbnRtQmHwPV730+AOD29lHEEo4F5BEUB24H0OBdhbBBDwIOSuf7vgg0Ywxdfiiw==", + "cpu": [ + "x64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "openbsd" + ] + }, "node_modules/@rollup/rollup-openharmony-arm64": { - "version": "4.53.3", - "resolved": "https://registry.npmjs.org/@rollup/rollup-openharmony-arm64/-/rollup-openharmony-arm64-4.53.3.tgz", - "integrity": "sha512-OueLAWgrNSPGAdUdIjSWXw+u/02BRTcnfw9PN41D2vq/JSEPnJnVuBgw18VkN8wcd4fjUs+jFHVM4t9+kBSNLw==", + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-openharmony-arm64/-/rollup-openharmony-arm64-4.60.0.tgz", + "integrity": "sha512-pESDkos/PDzYwtyzB5p/UoNU/8fJo68vcXM9ZW2V0kjYayj1KaaUfi1NmTUTUpMn4UhU4gTuK8gIaFO4UGuMbA==", "cpu": [ "arm64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "openharmony" ] }, "node_modules/@rollup/rollup-win32-arm64-msvc": { - "version": "4.53.3", - "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.53.3.tgz", - "integrity": "sha512-GOFuKpsxR/whszbF/bzydebLiXIHSgsEUp6M0JI8dWvi+fFa1TD6YQa4aSZHtpmh2/uAlj/Dy+nmby3TJ3pkTw==", + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.60.0.tgz", + "integrity": "sha512-hj1wFStD7B1YBeYmvY+lWXZ7ey73YGPcViMShYikqKT1GtstIKQAtfUI6yrzPjAy/O7pO0VLXGmUVWXQMaYgTQ==", "cpu": [ "arm64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "win32" ] }, "node_modules/@rollup/rollup-win32-ia32-msvc": { - "version": "4.53.3", - "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.53.3.tgz", - "integrity": "sha512-iah+THLcBJdpfZ1TstDFbKNznlzoxa8fmnFYK4V67HvmuNYkVdAywJSoteUszvBQ9/HqN2+9AZghbajMsFT+oA==", + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.60.0.tgz", + "integrity": "sha512-SyaIPFoxmUPlNDq5EHkTbiKzmSEmq/gOYFI/3HHJ8iS/v1mbugVa7dXUzcJGQfoytp9DJFLhHH4U3/eTy2Bq4w==", "cpu": [ "ia32" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "win32" ] }, "node_modules/@rollup/rollup-win32-x64-gnu": { - "version": "4.53.3", - "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-gnu/-/rollup-win32-x64-gnu-4.53.3.tgz", - "integrity": "sha512-J9QDiOIZlZLdcot5NXEepDkstocktoVjkaKUtqzgzpt2yWjGlbYiKyp05rWwk4nypbYUNoFAztEgixoLaSETkg==", + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-gnu/-/rollup-win32-x64-gnu-4.60.0.tgz", + "integrity": "sha512-RdcryEfzZr+lAr5kRm2ucN9aVlCCa2QNq4hXelZxb8GG0NJSazq44Z3PCCc8wISRuCVnGs0lQJVX5Vp6fKA+IA==", "cpu": [ "x64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "win32" ] }, "node_modules/@rollup/rollup-win32-x64-msvc": { - "version": "4.53.3", - "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.53.3.tgz", - "integrity": "sha512-UhTd8u31dXadv0MopwGgNOBpUVROFKWVQgAg5N1ESyCz8AuBcMqm4AuTjrwgQKGDfoFuz02EuMRHQIw/frmYKQ==", + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.60.0.tgz", + "integrity": "sha512-PrsWNQ8BuE00O3Xsx3ALh2Df8fAj9+cvvX9AIA6o4KpATR98c9mud4XtDWVvsEuyia5U4tVSTKygawyJkjm60w==", "cpu": [ "x64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "win32" @@ -2794,10 +2859,11 @@ } }, "node_modules/ajv": { - "version": "8.17.1", - "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.17.1.tgz", - "integrity": "sha512-B/gBuNg5SiMTrPkC+A2+cW0RszwxYmn6VYxB/inlBStS5nx6xHIt/ehKRhIMhqusl7a8LjQoZnjCs5vhwxOQ1g==", + "version": "8.18.0", + "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.18.0.tgz", + "integrity": "sha512-PlXPeEWMXMZ7sPYOHqmDyCJzcfNrUr3fGNKtezX14ykXOEIvyK81d+qydx89KY5O71FKMPaQ2vBfBFI5NHR63A==", "dev": true, + "license": "MIT", "dependencies": { "fast-deep-equal": "^3.1.3", "fast-uri": "^3.0.1", @@ -3498,10 +3564,11 @@ } }, "node_modules/cosmiconfig/node_modules/yaml": { - "version": "1.10.2", - "resolved": "https://registry.npmjs.org/yaml/-/yaml-1.10.2.tgz", - "integrity": "sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==", + "version": "1.10.3", + "resolved": "https://registry.npmjs.org/yaml/-/yaml-1.10.3.tgz", + "integrity": "sha512-vIYeF1u3CjlhAFekPPAk2h/Kv4T3mAkMox5OymRiJQB0spDP10LHvt+K7G9Ny6NuuMAb25/6n1qyUjAcGNf/AA==", "dev": true, + "license": "ISC", "engines": { "node": ">= 6" } @@ -3770,10 +3837,11 @@ } }, "node_modules/diff": { - "version": "4.0.2", - "resolved": "https://registry.npmjs.org/diff/-/diff-4.0.2.tgz", - "integrity": "sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==", + "version": "4.0.4", + "resolved": "https://registry.npmjs.org/diff/-/diff-4.0.4.tgz", + "integrity": "sha512-X07nttJQkwkfKfvTPG/KSnE2OMdcUCao6+eXF3wmnIQRn2aPAHH3VxDbDOdegkd6JbPsXqShpvEOHfAT+nCNwQ==", "dev": true, + "license": "BSD-3-Clause", "engines": { "node": ">=0.3.1" } @@ -4315,10 +4383,11 @@ } }, "node_modules/flatted": { - "version": "3.3.3", - "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.3.3.tgz", - "integrity": "sha512-GX+ysw4PBCz0PzosHDepZGANEuFCMLrnRTiEy9McGjmkCQYwRq4A/X786G/fjM/+OjsWSU1ZrY5qyARZmO/uwg==", - "dev": true + "version": "3.4.2", + "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.4.2.tgz", + "integrity": "sha512-PjDse7RzhcPkIJwy5t7KPWQSZ9cAbzQXcafsetQoD7sOJRQlGikNbx7yZp2OotDnJyrDcbyRq3Ttb18iYOqkxA==", + "dev": true, + "license": "ISC" }, "node_modules/form-data": { "version": "4.0.5", @@ -4819,10 +4888,11 @@ } }, "node_modules/immutable": { - "version": "5.1.4", - "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.1.4.tgz", - "integrity": "sha512-p6u1bG3YSnINT5RQmx/yRZBpenIl30kVxkTLDyHLIMk0gict704Q9n+thfDI7lTRm9vXdDYutVzXhzcThxTnXA==", - "dev": true + "version": "5.1.5", + "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.1.5.tgz", + "integrity": "sha512-t7xcm2siw+hlUM68I+UEOK+z84RzmN59as9DZ7P1l0994DKUWV7UXBMQZVxaoMSRQ+PBZbHCOoBt7a2wxOMt+A==", + "dev": true, + "license": "MIT" }, "node_modules/import-fresh": { "version": "3.3.1", @@ -5981,10 +6051,11 @@ } }, "node_modules/lodash": { - "version": "4.17.21", - "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz", - "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==", - "dev": true + "version": "4.17.23", + "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.23.tgz", + "integrity": "sha512-LgVTMpQtIopCi79SJeDiP0TfWi5CNEc/L/aRdTh3yIvmZXTnheWpKjSZhnvMl8iXbC1tFg9gdHHDMLoV7CnG+w==", + "dev": true, + "license": "MIT" }, "node_modules/lodash.get": { "version": "4.4.2", @@ -6227,10 +6298,11 @@ } }, "node_modules/minimatch": { - "version": "3.1.2", - "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz", - "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==", + "version": "3.1.5", + "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.5.tgz", + "integrity": "sha512-VgjWUsnnT6n+NUk6eZq77zeFdpW2LWDzP6zFGrCbHXiYNul5Dzqk2HHQ5uFH2DNW5Xbp8+jVzaeNt94ssEEl4w==", "dev": true, + "license": "ISC", "dependencies": { "brace-expansion": "^1.1.7" }, @@ -6670,10 +6742,11 @@ "dev": true }, "node_modules/picomatch": { - "version": "2.3.1", - "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz", - "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==", + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.2.tgz", + "integrity": "sha512-V7+vQEJ06Z+c5tSye8S+nHUfI51xoXIXjHQ99cQtKUkQqqO1kO/KCJUfZXuB47h/YBlDhah2H3hdUGXn8ie0oA==", "dev": true, + "license": "MIT", "engines": { "node": ">=8.6" }, @@ -7200,10 +7273,11 @@ } }, "node_modules/rollup": { - "version": "4.53.3", - "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.53.3.tgz", - "integrity": "sha512-w8GmOxZfBmKknvdXU1sdM9NHcoQejwF/4mNgj2JuEEdRaHwwF12K7e9eXn1nLZ07ad+du76mkVsyeb2rKGllsA==", + "version": "4.60.0", + "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.60.0.tgz", + "integrity": "sha512-yqjxruMGBQJ2gG4HtjZtAfXArHomazDHoFwFFmZZl0r7Pdo7qCIXKqKHZc8yeoMgzJJ+pO6pEEHa+V7uzWlrAQ==", "dev": true, + "license": "MIT", "dependencies": { "@types/estree": "1.0.8" }, @@ -7215,28 +7289,31 @@ "npm": ">=8.0.0" }, "optionalDependencies": { - "@rollup/rollup-android-arm-eabi": "4.53.3", - "@rollup/rollup-android-arm64": "4.53.3", - "@rollup/rollup-darwin-arm64": "4.53.3", - "@rollup/rollup-darwin-x64": "4.53.3", - "@rollup/rollup-freebsd-arm64": "4.53.3", - "@rollup/rollup-freebsd-x64": "4.53.3", - "@rollup/rollup-linux-arm-gnueabihf": "4.53.3", - "@rollup/rollup-linux-arm-musleabihf": "4.53.3", - "@rollup/rollup-linux-arm64-gnu": "4.53.3", - "@rollup/rollup-linux-arm64-musl": "4.53.3", - "@rollup/rollup-linux-loong64-gnu": "4.53.3", - "@rollup/rollup-linux-ppc64-gnu": "4.53.3", - "@rollup/rollup-linux-riscv64-gnu": "4.53.3", - "@rollup/rollup-linux-riscv64-musl": "4.53.3", - "@rollup/rollup-linux-s390x-gnu": "4.53.3", - "@rollup/rollup-linux-x64-gnu": "4.53.3", - "@rollup/rollup-linux-x64-musl": "4.53.3", - "@rollup/rollup-openharmony-arm64": "4.53.3", - "@rollup/rollup-win32-arm64-msvc": "4.53.3", - "@rollup/rollup-win32-ia32-msvc": "4.53.3", - "@rollup/rollup-win32-x64-gnu": "4.53.3", - "@rollup/rollup-win32-x64-msvc": "4.53.3", + "@rollup/rollup-android-arm-eabi": "4.60.0", + "@rollup/rollup-android-arm64": "4.60.0", + "@rollup/rollup-darwin-arm64": "4.60.0", + "@rollup/rollup-darwin-x64": "4.60.0", + "@rollup/rollup-freebsd-arm64": "4.60.0", + "@rollup/rollup-freebsd-x64": "4.60.0", + "@rollup/rollup-linux-arm-gnueabihf": "4.60.0", + "@rollup/rollup-linux-arm-musleabihf": "4.60.0", + "@rollup/rollup-linux-arm64-gnu": "4.60.0", + "@rollup/rollup-linux-arm64-musl": "4.60.0", + "@rollup/rollup-linux-loong64-gnu": "4.60.0", + "@rollup/rollup-linux-loong64-musl": "4.60.0", + "@rollup/rollup-linux-ppc64-gnu": "4.60.0", + "@rollup/rollup-linux-ppc64-musl": "4.60.0", + "@rollup/rollup-linux-riscv64-gnu": "4.60.0", + "@rollup/rollup-linux-riscv64-musl": "4.60.0", + "@rollup/rollup-linux-s390x-gnu": "4.60.0", + "@rollup/rollup-linux-x64-gnu": "4.60.0", + "@rollup/rollup-linux-x64-musl": "4.60.0", + "@rollup/rollup-openbsd-x64": "4.60.0", + "@rollup/rollup-openharmony-arm64": "4.60.0", + "@rollup/rollup-win32-arm64-msvc": "4.60.0", + "@rollup/rollup-win32-ia32-msvc": "4.60.0", + "@rollup/rollup-win32-x64-gnu": "4.60.0", + "@rollup/rollup-win32-x64-msvc": "4.60.0", "fsevents": "~2.3.2" } }, @@ -8077,10 +8154,11 @@ } }, "node_modules/tinyglobby/node_modules/picomatch": { - "version": "4.0.3", - "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz", - "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==", + "version": "4.0.4", + "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.4.tgz", + "integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==", "dev": true, + "license": "MIT", "engines": { "node": ">=12" }, @@ -8380,10 +8458,11 @@ } }, "node_modules/vite/node_modules/picomatch": { - "version": "4.0.3", - "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz", - "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==", + "version": "4.0.4", + "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.4.tgz", + "integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==", "dev": true, + "license": "MIT", "engines": { "node": ">=12" }, @@ -8722,10 +8801,11 @@ "dev": true }, "node_modules/yaml": { - "version": "2.8.1", - "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.8.1.tgz", - "integrity": "sha512-lcYcMxX2PO9XMGvAJkJ3OsNMw+/7FKes7/hgerGUYWIoWu5j/+YQqcZr5JnPZWzOsEBgMbSbiSTn/dv/69Mkpw==", + "version": "2.8.3", + "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.8.3.tgz", + "integrity": "sha512-AvbaCLOO2Otw/lW5bmh9d/WEdcDFdQp2Z2ZUH3pX9U2ihyUY0nvLv7J6TrWowklRGPYbB/IuIMfYgxaCPg5Bpg==", "dev": true, + "license": "ISC", "optional": true, "peer": true, "bin": { @@ -8733,6 +8813,9 @@ }, "engines": { "node": ">= 14.6" + }, + "funding": { + "url": "https://github.com/sponsors/eemeli" } }, "node_modules/yargs": { diff --git a/package.json b/package.json index aebda906fc..ffc8ac6e62 100644 --- a/package.json +++ b/package.json @@ -23,7 +23,7 @@ "@linthtml/linthtml": "^0.9.6", "@mate-academy/bemlint": "latest", "@mate-academy/linthtml-config": "latest", - "@mate-academy/scripts": "^2.1.2", + "@mate-academy/scripts": "^2.1.3", "@mate-academy/stylelint-config": "latest", "jest": "^29.7.0", "jest-environment-jsdom": "^29.7.0", diff --git a/src/scripts/main.js b/src/scripts/main.js index ad9a93a7c1..eb109abbed 100644 --- a/src/scripts/main.js +++ b/src/scripts/main.js @@ -1 +1,2 @@ 'use strict'; + diff --git a/src/styles/_fonts.scss b/src/styles/_fonts.scss deleted file mode 100644 index 45cdd54008..0000000000 --- a/src/styles/_fonts.scss +++ /dev/null @@ -1,6 +0,0 @@ -@font-face { - font-family: Roboto, Arial, Helvetica, sans-serif; - src: url('../fonts/Roboto-Regular-webfont.woff') format('woff'); - font-weight: normal; - font-style: normal; -} diff --git a/src/styles/_typography.scss b/src/styles/_typography.scss deleted file mode 100644 index 1837eb46e2..0000000000 --- a/src/styles/_typography.scss +++ /dev/null @@ -1,3 +0,0 @@ -h1 { - @extend %h1; -} diff --git a/src/styles/_utils.scss b/src/styles/_utils.scss deleted file mode 100644 index 3280c3fe10..0000000000 --- a/src/styles/_utils.scss +++ /dev/null @@ -1,3 +0,0 @@ -@import 'utils/vars'; -@import 'utils/mixins'; -@import 'utils/extends'; diff --git a/src/styles/blocks/_agency.scss b/src/styles/blocks/_agency.scss new file mode 100644 index 0000000000..e2d6c9dfdb --- /dev/null +++ b/src/styles/blocks/_agency.scss @@ -0,0 +1,93 @@ +@use '../utils/index' as *; + +.agency { + @include section-padding; + + position: relative; + z-index: 2; + background-color: $color-white; + + &__container { + @include container; + + display: grid; + grid-template-columns: 1fr 1fr; + gap: 60px; + align-items: center; + + @media (max-width: 900px) { + grid-template-columns: 1fr; + text-align: center; + } + } + + &__content { + display: flex; + flex-direction: column; + gap: 24px; + } + + &__title { + @include title-main; + } + + &__description { + font-size: 18px; + line-height: 1.7; + opacity: 0.85; + } + + &__slider { + position: relative; + z-index: 2; + overflow: hidden; + } + + &__image { + display: block; + + width: 100%; + max-height: 420px; + border-radius: 12px; + + object-fit: cover; + } + + &__arrows { + position: absolute; + z-index: 3; + right: 20px; + bottom: 20px; + + display: flex; + gap: 12px; + } + + &__arrow { + cursor: pointer; + + display: flex; + align-items: center; + justify-content: center; + + width: 44px; + height: 44px; + border: none; + border-radius: 50%; + + background: $color-white; + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); + + &:hover { + background: $color-gray-light; + } + + img { + width: 20px; + } + } + + &__arrow--left { + transform: rotate(180deg); + } +} diff --git a/src/styles/blocks/_contact.scss b/src/styles/blocks/_contact.scss new file mode 100644 index 0000000000..713ab92194 --- /dev/null +++ b/src/styles/blocks/_contact.scss @@ -0,0 +1,93 @@ +@use '../utils/index' as *; + +.contact { + padding: 120px 0; + + &__top { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 60px; + margin-bottom: 60px; + + @media (max-width: 768px) { + grid-template-columns: 1fr; + text-align: center; + } + } + + &__title { + margin-bottom: 24px; + font-size: 42px; + font-weight: 700; + } + + &__text { + margin-bottom: 24px; + font-size: 18px; + opacity: 0.85; + } + + &__details { + display: flex; + flex-direction: column; + gap: 16px; + } + + &__detail { + display: flex; + gap: 12px; + align-items: center; + font-size: 16px; + + img { + width: 20px; + } + } + + &__image-img { + width: 100%; + height: 420px; + border-radius: 12px; + object-fit: cover; + } + + &__form { + display: flex; + flex-direction: column; + gap: 20px; + max-width: 600px; + + @media (max-width: 768px) { + margin: 0 auto; + } + } + + &__input, + &__textarea { + width: 100%; + padding: 16px; + border: 1px solid #ddd; + border-radius: 8px; + + font-size: 16px; + } + + &__textarea { + resize: none; + height: 160px; + } + + &__btn { + padding: 16px; + border-radius: 8px; + + font-weight: 600; + color: #fff; + + background: #111; + + &:hover { + opacity: 0.8; + } + } +} diff --git a/src/styles/blocks/_expertise.scss b/src/styles/blocks/_expertise.scss new file mode 100644 index 0000000000..67333b6d22 --- /dev/null +++ b/src/styles/blocks/_expertise.scss @@ -0,0 +1,53 @@ +@use '../utils/index' as *; + +.expertise { + padding: 120px 0; + background: #f8f8f8; + + &__title { + margin-bottom: 48px; + font-size: 42px; + font-weight: 700; + text-align: center; + } + + &__cards { + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: 40px; + + @media (max-width: 768px) { + grid-template-columns: 1fr; + } + } + + &__card { + padding: 40px 30px; + border-radius: 12px; + + background: #fff; + box-shadow: 0 6px 20px rgba(0, 0, 0, 0.06); + + transition: 0.3s; + + &:hover { + transform: translateY(-6px); + } + } + + &__icon { + width: 60px; + margin-bottom: 20px; + } + + &__card-title { + margin-bottom: 12px; + font-size: 24px; + font-weight: 600; + } + + &__card-text { + font-size: 16px; + opacity: 0.8; + } +} diff --git a/src/styles/blocks/_footer.scss b/src/styles/blocks/_footer.scss new file mode 100644 index 0000000000..7f777e0212 --- /dev/null +++ b/src/styles/blocks/_footer.scss @@ -0,0 +1,50 @@ +@use '../utils/index' as *; + +.footer { + padding: 80px 0; + color: #fff; + background: #111; + + &__container { + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: 60px; + + @media (max-width: 768px) { + grid-template-columns: 1fr; + text-align: center; + } + } + + &__logo { + width: 140px; + margin-bottom: 20px; + } + + &__description { + font-size: 16px; + opacity: 0.8; + } + + &__title { + margin-bottom: 20px; + font-size: 20px; + font-weight: 600; + } + + &__list { + display: flex; + flex-direction: column; + gap: 12px; + } + + &__link { + color: #fff; + opacity: 0.8; + transition: 0.3s; + + &:hover { + opacity: 1; + } + } +} diff --git a/src/styles/blocks/_header.scss b/src/styles/blocks/_header.scss new file mode 100644 index 0000000000..39f1abdace --- /dev/null +++ b/src/styles/blocks/_header.scss @@ -0,0 +1,39 @@ +@use '../utils/index' as *; + +.header { + position: relative; + z-index: 10; + + padding: 24px 0; + border-bottom: 1px solid $color-gray-border; + + background-color: $color-white; + + &__container { + @include container; + + display: flex; + align-items: center; + justify-content: space-between; + } + + &__logo { + width: 140px; + } + + &__list { + display: flex; + gap: 32px; + } + + &__link { + font-size: 16px; + font-weight: 500; + color: $color-black; + transition: 0.3s; + + &:hover { + opacity: 0.7; + } + } +} diff --git a/src/styles/blocks/_hero.scss b/src/styles/blocks/_hero.scss new file mode 100644 index 0000000000..8ee9bc3a1a --- /dev/null +++ b/src/styles/blocks/_hero.scss @@ -0,0 +1,51 @@ +@use '../utils/index' as *; + +.hero { + position: relative; + z-index: 1; + + overflow: hidden; + + padding: 160px 0 140px; + + color: $color-white; + + background-color: $color-black; + + &__container { + @include container; + + position: relative; + z-index: 3; + max-width: 700px; + } + + &__title { + font-size: 64px; + font-weight: 700; + line-height: 1.1; + } + + &__subtitle { + font-size: 24px; + opacity: 0.9; + } + + &__button { + display: inline-block; + + padding: 16px 32px; + border-radius: 8px; + + font-weight: 600; + color: $color-black; + + background: $color-white; + + transition: 0.3s; + + &:hover { + background: color.adjust($color-white, $lightness: 10%); + } + } +} diff --git a/src/styles/blocks/_message.scss b/src/styles/blocks/_message.scss new file mode 100644 index 0000000000..1ce4b07e55 --- /dev/null +++ b/src/styles/blocks/_message.scss @@ -0,0 +1,52 @@ +@use '../utils/index' as *; + +.message { + padding: 120px 0; + + &__container { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 60px; + align-items: center; + + @media (max-width: 768px) { + grid-template-columns: 1fr; + text-align: center; + } + } + + &__title { + margin-bottom: 24px; + font-size: 42px; + font-weight: 700; + } + + &__text { + margin-bottom: 32px; + font-size: 18px; + opacity: 0.85; + } + + &__btn { + display: inline-block; + + padding: 14px 28px; + border-radius: 8px; + + font-weight: 600; + color: #fff; + + background: #111; + + &:hover { + opacity: 0.8; + } + } + + &__image-img { + width: 100%; + height: 420px; + border-radius: 12px; + object-fit: cover; + } +} diff --git a/src/styles/blocks/_portfolio.scss b/src/styles/blocks/_portfolio.scss new file mode 100644 index 0000000000..50f4943176 --- /dev/null +++ b/src/styles/blocks/_portfolio.scss @@ -0,0 +1,61 @@ +@use '../utils/index' as *; + +.portfolio { + @include section-padding; + + &__container { + text-align: center; + } + + &__title { + @include title-main; + + margin-bottom: 48px; + } + + &__grid { + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: 32px; + + @media (max-width: 992px) { + grid-template-columns: repeat(2, 1fr); + } + + @media (max-width: 600px) { + grid-template-columns: 1fr; + } + } + + &__item { + overflow: hidden; + + border-radius: 12px; + + background: #fff; + box-shadow: 0 6px 20px rgba(0, 0, 0, 0.06); + + transition: + transform 0.3s ease, + box-shadow 0.3s ease; + + &:hover { + transform: translateY(-6px); + box-shadow: 0 12px 28px rgba(0, 0, 0, 0.12); + } + } + + &__image { + display: block; + width: 100%; + height: 260px; + object-fit: cover; + } + + &__name { + padding: 20px; + font-size: 20px; + font-weight: 600; + text-align: center; + } +} diff --git a/src/styles/blocks/_process.scss b/src/styles/blocks/_process.scss new file mode 100644 index 0000000000..04632aeeb2 --- /dev/null +++ b/src/styles/blocks/_process.scss @@ -0,0 +1,74 @@ +@use '../utils/index' as *; + +.process { + padding: 120px 0; + + &__title { + margin-bottom: 48px; + font-size: 42px; + font-weight: 700; + text-align: center; + } + + &__cards { + display: grid; + grid-template-columns: repeat(4, 1fr); + gap: 40px; + + @media (max-width: 992px) { + grid-template-columns: repeat(2, 1fr); + } + + @media (max-width: 600px) { + grid-template-columns: 1fr; + } + } + + &__card { + padding: 40px 30px; + border-radius: 12px; + + background: #fafafa; + box-shadow: 0 6px 20px rgba(0, 0, 0, 0.05); + + transition: 0.3s; + + &:hover { + transform: translateY(-6px); + } + } + + &__icon { + width: 60px; + margin-bottom: 20px; + } + + &__card-title { + margin-bottom: 12px; + font-size: 24px; + font-weight: 600; + } + + &__card-text { + margin-bottom: 20px; + font-size: 16px; + opacity: 0.8; + } + + &__learn { + display: inline-flex; + gap: 10px; + align-items: center; + + font-weight: 600; + color: #111; + + img { + width: 18px; + } + + &:hover { + opacity: 0.7; + } + } +} diff --git a/src/styles/blocks/_testimonials.scss b/src/styles/blocks/_testimonials.scss new file mode 100644 index 0000000000..b6a9910071 --- /dev/null +++ b/src/styles/blocks/_testimonials.scss @@ -0,0 +1,58 @@ +@use '../utils/index' as *; + +.testimonials { + padding: 120px 0; + background: #fff; + + &__title { + margin-bottom: 48px; + font-size: 42px; + font-weight: 700; + text-align: center; + } + + &__cards { + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: 40px; + + @media (max-width: 768px) { + grid-template-columns: 1fr; + } + } + + &__card { + padding: 40px 30px; + border-radius: 12px; + + text-align: center; + + background: #fafafa; + box-shadow: 0 6px 20px rgba(0, 0, 0, 0.05); + } + + &__photo { + width: 90px; + height: 90px; + margin-bottom: 20px; + border-radius: 50%; + + object-fit: cover; + } + + &__text { + margin-bottom: 20px; + font-size: 18px; + font-style: italic; + } + + &__name { + font-size: 20px; + font-weight: 600; + } + + &__role { + font-size: 14px; + opacity: 0.7; + } +} diff --git a/src/styles/blocks/_vision.scss b/src/styles/blocks/_vision.scss new file mode 100644 index 0000000000..556999fb39 --- /dev/null +++ b/src/styles/blocks/_vision.scss @@ -0,0 +1,77 @@ +@use '../utils/index' as *; + +.vision { + padding: 120px 0; + background: #f8f8f8; + + &__container { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 60px; + align-items: center; + + @media (max-width: 768px) { + grid-template-columns: 1fr; + text-align: center; + } + } + + &__title { + margin-bottom: 24px; + font-size: 42px; + font-weight: 700; + } + + &__text { + margin-bottom: 24px; + font-size: 18px; + opacity: 0.85; + } + + &__list { + display: flex; + flex-direction: column; + gap: 12px; + margin-bottom: 32px; + } + + &__item { + position: relative; + padding-left: 28px; + font-size: 18px; + + &::before { + content: '✔'; + + position: absolute; + top: 0; + left: 0; + + font-weight: 700; + color: #111; + } + } + + &__btn { + display: inline-block; + + padding: 14px 28px; + border-radius: 8px; + + font-weight: 600; + color: #fff; + + background: #111; + + &:hover { + opacity: 0.8; + } + } + + &__image-img { + width: 100%; + height: 420px; + border-radius: 12px; + object-fit: cover; + } +} diff --git a/src/styles/blocks/_who.scss b/src/styles/blocks/_who.scss new file mode 100644 index 0000000000..4404a20d67 --- /dev/null +++ b/src/styles/blocks/_who.scss @@ -0,0 +1,39 @@ +@use '../utils/index' as *; + +.who { + padding: 120px 0; + + &__container { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 60px; + align-items: center; + + @media (max-width: 768px) { + grid-template-columns: 1fr; + text-align: center; + } + } + + &__title { + margin-bottom: 24px; + font-size: 48px; + font-weight: 700; + } + + &__text { + margin-bottom: 20px; + font-size: 18px; + line-height: 1.7; + opacity: 0.85; + } + + &__image-img { + width: 100%; + height: 420px; + border-radius: 12px; + + object-fit: cover; + box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08); + } +} diff --git a/src/styles/main.scss b/src/styles/main.scss index fb9195d128..d146d71671 100644 --- a/src/styles/main.scss +++ b/src/styles/main.scss @@ -1,7 +1,13 @@ -@import 'utils'; -@import 'fonts'; -@import 'typography'; +@use './utils/index' as *; -body { - background: $c-gray; -} +@use './blocks/header'; +@use './blocks/agency'; +@use './blocks/who'; +@use './blocks/expertise'; +@use './blocks/process'; +@use './blocks/testimonials'; +@use './blocks/vision'; +@use './blocks/message'; +@use './blocks/contact'; +@use './blocks/footer'; +@use './blocks/portfolio'; diff --git a/src/styles/utils/_base.scss b/src/styles/utils/_base.scss new file mode 100644 index 0000000000..8b506be101 --- /dev/null +++ b/src/styles/utils/_base.scss @@ -0,0 +1,32 @@ +*, +*::before, +*::after { + box-sizing: border-box; +} + +html { + scroll-behavior: smooth; +} + +body { + margin: 0; + font-family: $font-family-base; + color: $color-black; + background-color: $color-white; +} + +img { + display: block; + max-width: 100%; +} + +a { + color: inherit; + text-decoration: none; +} + +ul { + margin: 0; + padding: 0; + list-style: none; +} diff --git a/src/styles/utils/_extends.scss b/src/styles/utils/_extends.scss index d7201e7b3e..be8ff373cc 100644 --- a/src/styles/utils/_extends.scss +++ b/src/styles/utils/_extends.scss @@ -1,4 +1,11 @@ -%h1 { - font-family: Roboto, sans-serif; - font-weight: 400; +@use './vars' as *; + +%title { + font-weight: 700; + line-height: 1.2; +} + +%text { + font-size: 1rem; + line-height: 1.5; } diff --git a/src/styles/utils/_fonts.scss b/src/styles/utils/_fonts.scss new file mode 100644 index 0000000000..f94c8c80e4 --- /dev/null +++ b/src/styles/utils/_fonts.scss @@ -0,0 +1,9 @@ +@font-face { + font-family: Inter; + font-weight: 400; + font-style: normal; + font-display: swap; + src: local('Inter'), local('Inter-Regular'); +} + +/* Se não tiver Inter, o fallback já está nas variáveis */ diff --git a/src/styles/utils/_index.scss b/src/styles/utils/_index.scss new file mode 100644 index 0000000000..f425922cc9 --- /dev/null +++ b/src/styles/utils/_index.scss @@ -0,0 +1,6 @@ +@forward 'vars'; +@forward 'mixins'; +@forward 'utils'; +@forward 'extends'; +@forward 'fonts'; +@forward 'typography'; diff --git a/src/styles/utils/_mixins.scss b/src/styles/utils/_mixins.scss index 80c79780dc..abb2ecae21 100644 --- a/src/styles/utils/_mixins.scss +++ b/src/styles/utils/_mixins.scss @@ -1,6 +1,12 @@ -@mixin hover($_property, $_toValue) { - transition: #{$_property} 0.3s; - &:hover { - #{$_property}: $_toValue; - } +@use './vars' as *; + +@mixin flex-center { + display: flex; + align-items: center; + justify-content: center; +} + +@mixin container { + width: min(100% - 2rem, 1200px); + margin-inline: auto; } diff --git a/src/styles/utils/_typography.scss b/src/styles/utils/_typography.scss new file mode 100644 index 0000000000..01caae1b27 --- /dev/null +++ b/src/styles/utils/_typography.scss @@ -0,0 +1,21 @@ +body { + font-size: 16px; + line-height: 1.6; +} + +h1, +h2, +h3, +h4 { + margin: 0; + font-weight: 700; +} + +p { + margin: 0; +} + +a { + color: inherit; + text-decoration: none; +} diff --git a/src/styles/utils/_utils.scss b/src/styles/utils/_utils.scss new file mode 100644 index 0000000000..4248c1401e --- /dev/null +++ b/src/styles/utils/_utils.scss @@ -0,0 +1,8 @@ +@mixin section-padding { + padding: 120px 0; +} + +@mixin title-main { + font-size: 42px; + font-weight: 700; +} diff --git a/src/styles/utils/_vars.scss b/src/styles/utils/_vars.scss index aeb006ffbb..557e545a28 100644 --- a/src/styles/utils/_vars.scss +++ b/src/styles/utils/_vars.scss @@ -1 +1,13 @@ -$c-gray: #eee; +$font-family-base: + 'Inter', + system-ui, + -apple-system, + BlinkMacSystemFont, + 'Segoe UI', + sans-serif; +$color-black: #111; +$color-white: #fff; +$color-gray-light: #f8f8f8; +$color-gray-border: #eee; +$container-width: 1200px; +$container-padding: 20px;