ammar/syncrow-web
1
0
Fork 0
mirror of https://github.com/SyncrowIOT/web.git synced 2025-07-09 22:57:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

added fonts, fixed alignment, and responsivness for the web

Browse Source
This commit is contained in:
ashrafzarkanisala
2024-08-27 01:55:11 +03:00
parent f3c5c2c489
commit f14320ea92
15 changed files with 178 additions and 94 deletions
Download Patch File Download Diff File Expand all files Collapse all files

110
lib/web_layout/menu_sidebar.dart
View File

@ -1,59 +1,75 @@
import 'package:flutter/material.dart';
import 'package:syncrow_web/utils/color_manager.dart';
import 'package:syncrow_web/utils/style.dart';
import 'package:syncrow_web/pages/common/text_field/custom_web_textfield.dart';
import 'package:syncrow_web/utils/helpers/responsice_layout_helper/responsive_layout_helper.dart';
class MenuSidebar extends StatelessWidget {
class MenuSidebar extends StatelessWidget with HelperResponsiveLayout {
const MenuSidebar({super.key});
@override
Widget build(BuildContext context) {
return Expanded(
child: Container(
decoration: const BoxDecoration(
shape: BoxShape.rectangle,
boxShadow: [
BoxShadow(
color: Colors.black26,
offset: Offset(4, 0),
blurRadius: 10,
)
],
color: ColorsManager.whiteColors,
),
width: 200,
child: Padding(
padding: const EdgeInsets.all(15.0),
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const Text(
'Community',
style: TextStyle(fontSize: 20),
),
CircleAvatar(
backgroundColor: Colors.grey.shade200,
child: IconButton(
color: ColorsManager.onSecondaryColor,
onPressed: () {},
icon: const Icon(Icons.add)),
)
],
),
const SizedBox(
height: 20,
),
TextFormField(
controller: TextEditingController(),
decoration: textBoxDecoration(suffixIcon: true)),
Container(
height: 100,
return LayoutBuilder(
builder: (context, constraints) {
double sidebarWidth;
if (isLargeScreenSize(context)) {
sidebarWidth = 250;
} else if (isMediumScreenSize(context)) {
sidebarWidth = 230;
} else {
sidebarWidth = 200;
}
return Container(
width: sidebarWidth,
decoration: const BoxDecoration(
shape: BoxShape.rectangle,
boxShadow: [
BoxShadow(
color: Colors.black26,
offset: Offset(4, 0),
blurRadius: 10,
)
],
color: Colors.white,
),
),
),
child: Padding(
padding: const EdgeInsets.all(15.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const Text(
'Community',
style: TextStyle(fontSize: 20),
),
CircleAvatar(
backgroundColor: Colors.grey.shade200,
child: IconButton(
color: Colors.grey,
onPressed: () {},
icon: const Icon(Icons.add),
),
),
],
),
const SizedBox(height: 20),
SizedBox(
height: 100,
child: CustomWebTextField(
isRequired: false,
textFieldName: '',
controller: TextEditingController(),
hintText: 'Search...',
),
),
const Spacer(),
],
),
),
);
},
);
}
}

6
lib/web_layout/web_scaffold.dart
View File

@ -1,10 +1,11 @@
import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:syncrow_web/utils/constants/assets.dart';
import 'package:syncrow_web/utils/helpers/responsice_layout_helper/responsive_layout_helper.dart';
import 'package:syncrow_web/web_layout/web_app_bar.dart';
import 'menu_sidebar.dart';
class WebScaffold extends StatelessWidget {
class WebScaffold extends StatelessWidget with HelperResponsiveLayout {
final bool enableMenuSideba;
final Widget? appBarTitle;
final List<Widget>? appBarBody;
@ -17,6 +18,7 @@ class WebScaffold extends StatelessWidget {
this.enableMenuSideba = true});
@override
Widget build(BuildContext context) {
final isSmall = isSmallScreenSize(context);
return Scaffold(
body: Stack(
children: [
@ -43,7 +45,7 @@ class WebScaffold extends StatelessWidget {
Expanded(
child: Row(
children: [
if (enableMenuSideba) const MenuSidebar(),
if (enableMenuSideba && !isSmall) const MenuSidebar(),
Expanded(flex: 5, child: scaffoldBody!)
],
),