Проработаем экран Lists. Он должен возвращать фрагмент с двумя элементами SafeAreaView.
Первый должен иметь стили: flex: 1, backgroundColor: colors.blue.
Второй: flex: 0, backgroundColor: colors.blue1.
Дальше все элементы будет добавлять внутри первого SafeAreaView.
Первым будет компонент NavigationHeader со свойством barStyle равным light.
После него добавь элемент View со стилями: flex - 0.5, paddingBottom - 25, paddingLeft - 20.
Назовем это View хедером. Внутри хедера добавь еще один View - инфо блок.
Стили инфо блока - flex: 1, flexDirection: row, height: 40, maxHeight: 40.
Внутри инфо блока добавить два View (блок list и блок word) с двумя Text элементами в каждом (count и label).
Стили блока list - width - 66, alignItems - center, justifyContent: center. Стили блока word - width-81, alignItems-center, justifyContent: center, borderLeftWidth: 2, borderColor: colors.white. Стили первого текстового элемента каждого блок list и word: fontSize-22, color-colors.white, fontFamily-RobotoBold. Стили второго текстового элемента каждого блок list и word: fontSize-12, color-colors.blue2, fontFamily-RobotoRegular. Первый label должен отображать текст Lists, второй - Words. После хедера добавим тело экрана - элемент Viewсо стилями:flex-8, backgroundColor-colors.blue1, borderTopLeftRadius-15, borderTopRightRadius-15. Первым дочерним элементом должен быть текст My dictionaryсо следующими стилями: fontSize-20, color-colors.black, fontFamily-RobotoRegular, marginTop-26, marginLeft-16. После этого текста должен идти элемент FlatListсо стилемmarginVertical-21. И после FlatListдобавь компонентRadialButton`.
Эта задача — часть курса по Full-Stack JavaScript.
Ты можешь задать свой вопрос в комментариях под постом.
Если ты уже решил задачу, то не стесняйся помочь другим.