meditohq/medito-app
1
1
Fork 0
mirror of https://github.com/meditohq/medito-app.git synced 2024-09-19 07:57:33 +03:00
Code Issues Packages Projects Releases Wiki Activity

ui: fixed styling

Browse Source
This commit is contained in:
Osama Asif 2023-05-31 03:18:08 +05:00
parent 51636e08dc
commit 07ea704646
8 changed files with 102 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
assets/images/ic_edit.svg Normal file
View File

@ -0,0 +1,3 @@
<svg width="21" height="21" viewBox="0 0 21 21" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1.71896 19.2799H2.97954L15.6712 6.5798L14.4106 5.31839L1.71896 18.0185V19.2799ZM19.3097 5.34706L15.6426 1.67751L16.8408 0.478508C17.1688 0.150217 17.5764 -0.00915068 18.0634 0.000405447C18.5505 0.00996158 18.9563 0.177194 19.281 0.502102L20.513 1.73484C20.8377 2.05975 21 2.46111 21 2.93892C21 3.41672 20.838 3.81773 20.514 4.14193L19.3097 5.34706ZM0.86885 21C0.622675 21 0.416323 20.9167 0.249794 20.7502C0.0832645 20.5836 0 20.3772 0 20.131V17.6762C0 17.5604 0.0190996 17.4547 0.0572988 17.3591C0.095498 17.2636 0.162347 17.168 0.257844 17.0724L14.4393 2.88158L18.1064 6.55113L3.92497 20.742C3.82947 20.8375 3.7319 20.9044 3.63226 20.9427C3.53259 20.9809 3.42962 21 3.32333 21H0.86885ZM15.0409 5.9491L14.4106 5.31839L15.6712 6.5798L15.0409 5.9491Z" fill="white"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 879 B

3
assets/images/ic_heart.svg Normal file
View File

@ -0,0 +1,3 @@
<svg width="20" height="19" viewBox="0 0 20 19" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10 18.35L8.55 17.03C3.4 12.36 0 9.28 0 5.5C0 2.42 2.42 0 5.5 0C7.24 0 8.91 0.81 10 2.09C11.09 0.81 12.76 0 14.5 0C17.58 0 20 2.42 20 5.5C20 9.28 16.6 12.36 11.45 17.04L10 18.35Z" fill="white"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 307 B

3
assets/images/ic_help_circle.svg Normal file
View File

@ -0,0 +1,3 @@
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10.1 15.825C10.3667 15.825 10.5917 15.7333 10.775 15.55C10.9583 15.3667 11.05 15.1417 11.05 14.875C11.05 14.6083 10.9583 14.3833 10.775 14.2C10.5917 14.0167 10.3667 13.925 10.1 13.925C9.83333 13.925 9.60833 14.0167 9.425 14.2C9.24167 14.3833 9.15 14.6083 9.15 14.875C9.15 15.1417 9.24167 15.3667 9.425 15.55C9.60833 15.7333 9.83333 15.825 10.1 15.825ZM9.225 12.175H10.7C10.7 11.7417 10.7542 11.3458 10.8625 10.9875C10.9708 10.6292 11.3083 10.2167 11.875 9.75C12.3917 9.31667 12.7583 8.89167 12.975 8.475C13.1917 8.05833 13.3 7.6 13.3 7.1C13.3 6.21667 13.0125 5.50833 12.4375 4.975C11.8625 4.44167 11.1 4.175 10.15 4.175C9.33333 4.175 8.6125 4.37917 7.9875 4.7875C7.3625 5.19583 6.90833 5.75833 6.625 6.475L7.95 6.975C8.13333 6.50833 8.40833 6.14583 8.775 5.8875C9.14167 5.62917 9.575 5.5 10.075 5.5C10.6417 5.5 11.1 5.65417 11.45 5.9625C11.8 6.27083 11.975 6.66667 11.975 7.15C11.975 7.51667 11.8667 7.8625 11.65 8.1875C11.4333 8.5125 11.1167 8.85 10.7 9.2C10.2 9.63333 9.82917 10.0625 9.5875 10.4875C9.34583 10.9125 9.225 11.475 9.225 12.175ZM10 20C8.63333 20 7.34167 19.7375 6.125 19.2125C4.90833 18.6875 3.84583 17.9708 2.9375 17.0625C2.02917 16.1542 1.3125 15.0917 0.7875 13.875C0.2625 12.6583 0 11.3667 0 10C0 8.61667 0.2625 7.31667 0.7875 6.1C1.3125 4.88333 2.02917 3.825 2.9375 2.925C3.84583 2.025 4.90833 1.3125 6.125 0.7875C7.34167 0.2625 8.63333 0 10 0C11.3833 0 12.6833 0.2625 13.9 0.7875C15.1167 1.3125 16.175 2.025 17.075 2.925C17.975 3.825 18.6875 4.88333 19.2125 6.1C19.7375 7.31667 20 8.61667 20 10C20 11.3667 19.7375 12.6583 19.2125 13.875C18.6875 15.0917 17.975 16.1542 17.075 17.0625C16.175 17.9708 15.1167 18.6875 13.9 19.2125C12.6833 19.7375 11.3833 20 10 20ZM10 18.5C12.3667 18.5 14.375 17.6708 16.025 16.0125C17.675 14.3542 18.5 12.35 18.5 10C18.5 7.63333 17.675 5.625 16.025 3.975C14.375 2.325 12.3667 1.5 10 1.5C7.65 1.5 5.64583 2.325 3.9875 3.975C2.32917 5.625 1.5 7.63333 1.5 10C1.5 12.35 2.32917 14.3542 3.9875 16.0125C5.64583 17.6708 7.65 18.5 10 18.5Z" fill="white"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.1 KiB

3
assets/images/ic_medito.svg Normal file
View File

@ -0,0 +1,3 @@
<svg width="21" height="11" viewBox="0 0 21 11" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M7.64722 0.0226822C7.18732 0.0895443 6.56431 0.466648 6.15521 0.923986C5.93863 1.16737 5.33434 1.96704 4.95198 2.51799C4.53218 3.12777 4.24341 3.56371 4.05089 3.88465C3.59366 4.64421 3.56425 4.67898 3.42788 4.61479C3.38777 4.59607 3.3343 4.53456 3.30756 4.47839C3.25408 4.37409 3.13376 3.88465 3.01076 3.29626C2.92787 2.89509 2.80487 2.50194 2.70861 2.33345C2.56155 2.06867 2.28882 1.92692 1.98133 1.95367C1.70057 1.97774 1.32356 2.1703 1.06152 2.42438C0.748679 2.72392 0.385035 3.36045 0.227278 3.88465C0.18717 4.01838 0.120323 4.22431 0.0775418 4.34734C0.0347601 4.47037 0 4.58537 0 4.60409C0 4.64154 0.288776 4.80735 0.355623 4.80735C0.382361 4.80735 0.401078 4.84212 0.4091 4.90631C0.462577 5.26469 0.481294 5.43051 0.508032 5.81029C0.598943 7.05928 0.794135 7.83488 1.1551 8.37781C1.64442 9.11062 2.43588 9.37004 3.17921 9.04108C3.66051 8.82712 4.091 8.40723 4.73272 7.52197C4.7862 7.44708 4.86107 7.34545 4.8985 7.29464C4.93593 7.24382 5.04824 7.08068 5.14717 6.93358C5.82098 5.94402 6.14184 5.54819 6.36377 5.43586L6.48944 5.37167L6.52153 5.51075C6.54025 5.58831 6.58838 5.99751 6.63116 6.42542C6.67661 6.85067 6.73009 7.3401 6.75148 7.5086C6.94132 8.91538 7.22208 9.66959 7.72744 10.1376C7.95739 10.3489 8.2114 10.4853 8.48681 10.5415C9.10715 10.6672 9.60448 10.4853 10.182 9.91564C10.3692 9.7311 10.9066 9.11864 10.9842 8.99829C11.0056 8.9662 11.0377 8.92608 11.0564 8.91271C11.0831 8.88864 11.3612 8.54897 12.1848 7.53801C12.4174 7.25184 12.9816 6.6795 13.1554 6.55113C13.4735 6.32112 13.6741 6.27298 13.8666 6.38263C14.019 6.47089 14.1233 6.62066 14.3693 7.09672C14.7517 7.84023 14.9442 8.14245 15.3533 8.65061C15.9255 9.35935 16.4255 9.70703 17.0458 9.82203C17.7464 9.95576 18.4603 9.66156 19.0325 9.00631C19.356 8.63723 19.7036 8.15315 20.1742 7.41499C20.3614 7.12347 20.9389 6.07774 20.9978 5.91994C21.0192 5.86378 20.8828 5.75145 20.7411 5.71401C20.6796 5.69529 20.5031 5.68191 20.348 5.68459C19.9924 5.68459 19.6956 5.74878 19.0111 5.97076C18.348 6.18739 18.0913 6.24088 17.9228 6.20077C17.7597 6.15797 17.6234 6.08576 17.5298 5.99483C17.4362 5.89855 17.2089 5.51877 17.1581 5.36365C17.1341 5.30214 17.0913 5.18178 17.0592 5.10155C16.9843 4.91701 16.7945 4.25106 16.7009 3.84454C16.6608 3.67604 16.6073 3.45941 16.5779 3.36313C16.5485 3.26685 16.4923 3.06358 16.4576 2.90846C16.3212 2.34949 16.134 1.8868 15.9362 1.63005C15.8346 1.499 15.5779 1.30109 15.388 1.21016C15.2597 1.15132 15.1073 1.10585 14.9121 1.07376C14.6367 1.02562 14.6153 1.02562 14.3399 1.07376C14.0163 1.12725 13.8639 1.18876 13.5591 1.384C13.3372 1.52575 12.9281 1.9296 12.7168 2.21309C12.658 2.29333 12.5591 2.41903 12.4976 2.49392C12.4388 2.56613 12.3051 2.73462 12.2061 2.86834C11.9922 3.14649 11.7382 3.47813 11.3692 3.95419C11.2275 4.13873 11.0751 4.33664 11.0296 4.39548C10.5965 4.96248 9.99487 5.66319 9.94674 5.66319C9.93604 5.66319 9.92 5.64715 9.91198 5.62842C9.90395 5.61238 9.85315 5.4947 9.79967 5.369C9.64192 5.00259 9.59111 4.53456 9.54566 3.06626C9.50822 1.87611 9.47614 1.53645 9.35581 1.13527C9.21945 0.669909 8.95474 0.340947 8.5697 0.153732C8.26488 0.00930882 8.00017 -0.0308084 7.64722 0.0226822Z" fill="white"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.2 KiB

4
lib/constants/strings/asset_constants.dart
View File

@ -18,4 +18,8 @@ class AssetConstants {
static const String icStreak = 'assets/images/ic_streak.svg';
static const String icMenu = 'assets/images/ic_menu.svg';
static const String icDownload = 'assets/images/ic_download.svg';
static const String icHelpCircle = 'assets/images/ic_help_circle.svg';
static const String icHeart = 'assets/images/ic_heart.svg';
static const String icEdit = 'assets/images/ic_edit.svg';
static const String icMedito = 'assets/images/ic_medito.svg';
}

4
lib/views/home/home_view.dart
View File

@ -25,7 +25,9 @@ class HomeView extends ConsumerWidget {
mainAxisSize: MainAxisSize.min,
children: [
height8,
HomeHeaderWidget(),
HomeHeaderWidget(
homeMenuModel: data.menu,
),
height16,
Expanded(
child: SingleChildScrollView(

19
lib/views/home/widgets/header/home_header_widget.dart
View File

@ -1,14 +1,19 @@
import 'package:Medito/constants/constants.dart';
import 'package:Medito/models/models.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:go_router/go_router.dart';
import '../menu/menu_bottom_sheet_widget.dart';
class HomeHeaderWidget extends StatelessWidget {
const HomeHeaderWidget({
super.key,
this.streakCount,
required this.homeMenuModel,
});
final String? streakCount;
final List<HomeMenuModel> homeMenuModel;
@override
Widget build(BuildContext context) {
return Padding(
@ -23,7 +28,19 @@ class HomeHeaderWidget extends StatelessWidget {
width16,
_downloadWidget(context),
width16,
SvgPicture.asset(AssetConstants.icMenu),
InkWell(
onTap: () {
showModalBottomSheet<void>(
context: context,
builder: (BuildContext context) {
return MenuBottomSheetWidget(
homeMenuModel: homeMenuModel,
);
},
);
},
child: SvgPicture.asset(AssetConstants.icMenu),
),
],
),
],

65
lib/views/home/widgets/menu/menu_bottom_sheet_widget.dart Normal file
View File

@ -0,0 +1,65 @@
import 'package:Medito/constants/strings/asset_constants.dart';
import 'package:Medito/models/models.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
class MenuBottomSheetWidget extends StatelessWidget {
const MenuBottomSheetWidget({super.key, required this.homeMenuModel});
final List<HomeMenuModel> homeMenuModel;
@override
Widget build(BuildContext context) {
return DraggableScrollableSheet(
initialChildSize: 0.5,
minChildSize: 0.4,
maxChildSize: 1,
expand: false,
builder: (
BuildContext context,
ScrollController scrollController,
) {
return Column(
mainAxisSize: MainAxisSize.min,
children: [
Center(
child: Container(
height: 8,
width: 30,
),
),
Expanded(
child: ListView.builder(
controller: scrollController,
itemCount: homeMenuModel.length,
itemBuilder: (BuildContext context, int index) {
var element = homeMenuModel[index];
return ListTile(
horizontalTitleGap: 0,
leading: SvgPicture.asset(
getLeadingIconPath(element.icon),
height: 14,
),
title: Text('${element.title}'),
);
},
),
),
],
);
},
);
}
String getLeadingIconPath(String path) {
if (path == 'ic_help') {
return AssetConstants.icHelpCircle;
} else if (path == 'ic_email') {
return AssetConstants.icHelpCircle;
} else if (path == 'ic_medito') {
return AssetConstants.icMedito;
}
return AssetConstants.icMedito;
}
}