The structure of the stairs is already ready. All that remains is to specify the width of the steps.
The width of the bottom step must be the same as the width of the screen.
The second step from the bottom should be 0.75 times the width of the screen.
The third step from the bottom must be 0.5 times the width of the screen.
The top step must be 0.25 of the screen width.
The height of each step should be 0.25 of the viewport height.
Use the Dimensions module to complete the task.

This task is part of the Full-Stack JavaScript Course
If you have any issues with it, you can ask for community help below the post
Feel free to help others if you’ve already solved the task

App.js

import React from 'react';
import { View } from 'react-native';

export default function App() {
  return (
    <View style={{ flex: 1, alignItems: 'flex-end' }}>
      <View style={{ backgroundColor: '#5B37B6' }} />
      <View style={{ backgroundColor: '#C8379D' }} />
      <View style={{ backgroundColor: '#E39A28' }} />
      <View style={{ backgroundColor: '#1A8AAD' }} />
    </View>
  );
}

app.json

{
  "expo": {
    "name": "1",
    "slug": "1",
    "version": "1.0.0",
    "orientation": "portrait",
    "icon": "./assets/icon.png",
    "splash": {
      "image": "./assets/splash.png",
      "resizeMode": "contain",
      "backgroundColor": "#ffffff"
    },
    "updates": {
      "fallbackToCacheTimeout": 0
    },
    "assetBundlePatterns": [
      "**/*"
    ],
    "ios": {
      "supportsTablet": true
    },
    "android": {
      "adaptiveIcon": {
        "foregroundImage": "./assets/adaptive-icon.png",
        "backgroundColor": "#FFFFFF"
      }
    },
    "web": {
      "favicon": "./assets/favicon.png"
    }
  }
}