diff --git a/.github/workflows/cicd.yml b/.github/workflows/cicd.yml index 15b7fdc3..d9538699 100644 --- a/.github/workflows/cicd.yml +++ b/.github/workflows/cicd.yml @@ -31,7 +31,7 @@ jobs: npm run test - name: Save screenshots - uses: actions/upload-artifact@v2 + uses: actions/upload-artifact@v4 if: ${{ always() }} with: name: screenshots diff --git a/challenges/stats_preview_card_component/images/image-header-mobile.jpg b/challenges/stats_preview_card_component/images/image-header-mobile.jpg new file mode 100644 index 00000000..73dfe51b Binary files /dev/null and b/challenges/stats_preview_card_component/images/image-header-mobile.jpg differ diff --git a/challenges/stats_preview_card_component/index.html b/challenges/stats_preview_card_component/index.html index 044c9a12..d0b0e9cf 100644 --- a/challenges/stats_preview_card_component/index.html +++ b/challenges/stats_preview_card_component/index.html @@ -28,35 +28,92 @@ - -
+
+ Frontend Mentor challenge +
+
for Optimum BH Internship
+ +
Frontend Mentor challenge -
-
- for - Optimum BH - Internship. -
+ Optimum BH +
+ Source code +
-
- Source code +
+
+ QR Code Image +
+
+
+
+

+ Get insights + that help your business grow. +

+
+ +
+

+ Discover the benefits of data analytics and make better decisions + regarding revenue, customer experience, and overall efficiency. +

+
+ +
+
+

+ 10k+ +

+ +

COMPANIES

+
+
+

+ 314 +

+ +

TEMPLATES

+
+
+

+ 12M+ +

+

QUERIES

+
+
+
diff --git a/challenges/stats_preview_card_component/style.css b/challenges/stats_preview_card_component/style.css index b5c61c95..e8e4d419 100644 --- a/challenges/stats_preview_card_component/style.css +++ b/challenges/stats_preview_card_component/style.css @@ -1,3 +1,37 @@ +@import url('https://fonts.googleapis.com/css2?family=Lexend+Deca:wght@100..900&display=swap'); +@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap'); + @tailwind base; @tailwind components; @tailwind utilities; + +.center-element { + margin: 0 auto; +} + +.mobile-width { + width: 21.875rem; +} + +.inter-font { + font-family: 'Inter', serif; + font-optical-sizing: none; + font-weight: 700; + font-style: normal; +} + +.lexend-font { + font-family: 'Lexend Deca', serif; + font-optical-sizing: none; + font-weight: 400; + font-style: normal; +} + +.limit-character { + max-width: 30ch; +} + +.custom-font-size { + font-size: 1.75rem; + line-height: 2rem; +} diff --git a/challenges/stats_preview_card_component/tailwind.config.js b/challenges/stats_preview_card_component/tailwind.config.js index 9e4a7ff5..f8ea6a4d 100644 --- a/challenges/stats_preview_card_component/tailwind.config.js +++ b/challenges/stats_preview_card_component/tailwind.config.js @@ -6,6 +6,19 @@ module.exports = { 'optimum-blue': '#009efc', 'optimum-darkblue': '#0389e1', }, + + backgroundColor: { + 'custom-blue': 'hsl(233, 47%, 7%)', + 'desaturated-blue': 'hsl(244, 38%, 16%)', + 'overlay-violet': 'hsl(277, 64%, 30%)', + }, + + textColor: { + 'heading-white': 'hsl(0, 0%, 100%)', + 'paragraph-white': ' hsla(0, 0%, 100%, 0.75)', + 'stats-white': 'hsla(0, 0%, 100%, 0.6)', + 'custom-violet': 'hsl(277, 64%, 61%)', + }, }, }, plugins: [],