theme implementation done

main_production_RSG
WaseemAbbasi22 4 weeks ago
parent 154187fbaa
commit 0bdd8d779d

@ -1,173 +0,0 @@
import 'package:flutter/material.dart';
import 'package:test_sa/new_views/app_style/app_color.dart';
import 'base_step_delegate.dart';
typedef OnStepReached = void Function(int index);
enum StepShape { circle, rRectangle }
enum BorderType { normal, dotted }
class BaseStep extends StatelessWidget {
const BaseStep({
Key ?key,
required this.step,
required this.isActive,
required this.isFinished,
required this.isAlreadyReached,
required this.radius,
required this.isUnreached,
required this.activeStepBackgroundColor,
required this.unreachedBackgroundColor,
required this.activeStepBorderColor,
required this.unreachedBorderColor,
required this.activeTextColor,
required this.activeIconColor,
required this.unreachedTextColor,
required this.unreachedIconColor,
required this.padding,
required this.stepRadius,
required this.showStepBorder,
required this.lineLength,
required this.enabled,
}) : super(key: key);
final StepModel step;
final bool isActive;
final bool isUnreached;
final bool isFinished;
final bool isAlreadyReached ;
final double radius;
final Color activeStepBackgroundColor;
final Color unreachedBackgroundColor;
final Color activeStepBorderColor;
final Color unreachedBorderColor;
final Color activeTextColor;
final Color activeIconColor;
final Color unreachedTextColor;
final Color unreachedIconColor;
final double padding;
final double stepRadius;
final bool showStepBorder;
final double lineLength;
final bool enabled;
@override
Widget build(BuildContext context) {
return SizedBox(
width: (radius * 2) + (padding),
height: radius * 2.5 + 25,
child: CustomMultiChildLayout(
delegate: BaseStepDelegate(
stepRadius: radius,
topTitle: step.topTitle??false,
direction: Axis.horizontal),
children: [
LayoutId(
id: BaseStepElem.step,
child: Material(
color: Colors.transparent,
clipBehavior: Clip.antiAlias,
borderRadius: BorderRadius.circular(stepRadius),
child: Container(
width: radius * 2,
height: radius * 2,
decoration: BoxDecoration(
shape: BoxShape.circle,
color: _handleColor(context, isFinished, isActive,
isAlreadyReached)),
alignment: Alignment.center,
child: _buildIcon(context),
),
)),
LayoutId(
id: BaseStepElem.title, child: _buildStepTitle(context))
],
),
);
}
Color _handleColor(BuildContext context, bool isFinished, bool isActive,
bool isAlreadyReached) {
if (isActive) {
return activeStepBackgroundColor;
} else {
if (isFinished) {
return AppColor.primary10;
} else if (isAlreadyReached) {
return AppColor.primary10;
} else {
return unreachedBackgroundColor;
}
}
}
Color _handleTitleColor(BuildContext context, bool isFinished, bool isActive,
bool isAlreadyReached) {
if (isActive) {
return activeTextColor;
} else {
if (isFinished) {
return Colors.transparent;
} else if (isAlreadyReached) {
return Colors.transparent;
} else {
return unreachedTextColor;
}
}
}
Widget _buildStepTitle(BuildContext context) {
return SizedBox(
width: (radius * 4.5) +
(padding),
child: step.customTitle,
);
}
SizedBox _buildIcon(BuildContext context) {
return SizedBox(
width: radius * 2,
height: radius * 2,
child: Center(
child: step.customStep ??
Icon(
isActive && step.activeIcon != null
? step.activeIcon!.icon
: isFinished && step.finishIcon != null
? step.finishIcon!.icon
: step.icon!.icon,
size: radius * 0.9,
color: Colors.white,
),
),
);
}
}
class StepModel {
final Icon ?icon;
final Icon ?finishIcon;
final Icon ?activeIcon;
final Widget? customStep;
final String ?title;
final Widget ?customTitle;
final String ?lineText;
final Widget ?customLineWidget;
final bool? topTitle;
final bool? enabled;
const StepModel({
this.icon,
this.finishIcon,
this.activeIcon,
this.title,
this.lineText,
this.customStep,
this.customTitle,
this.customLineWidget,
this.topTitle = false,
this.enabled = true,
});
}

@ -1,51 +0,0 @@
import 'package:flutter/material.dart';
enum BaseStepElem { step, title }
class BaseStepDelegate extends MultiChildLayoutDelegate {
final double stepRadius;
final Axis direction;
final bool topTitle;
BaseStepDelegate({
required this.stepRadius,
required this.direction,
this.topTitle = false,
});
@override
void performLayout(Size size) {
assert(hasChild(BaseStepElem.step));
layoutChild(
BaseStepElem.step,
BoxConstraints.loose(
size), // This just says that the child cannot be bigger than the whole layout.
);
positionChild(
BaseStepElem.step,
Offset(
(size.width - 2 * stepRadius) / 2,
direction == Axis.horizontal
? 0
: (size.height - 2 * stepRadius) / 2));
if (hasChild(BaseStepElem.title)) {
final Size titleSize = layoutChild(
BaseStepElem.title,
const BoxConstraints(),
);
Offset titleOffset = Offset(-titleSize.width / 2 + (size.width / 2),
topTitle ? -(stepRadius + titleSize.height) : (stepRadius * 2.35));
positionChild(BaseStepElem.title, titleOffset);
}
}
@override
bool shouldRelayout(BaseStepDelegate oldDelegate) {
return false;
}
}

@ -1,80 +0,0 @@
import 'package:flutter/material.dart';
class EasyLine extends StatelessWidget {
final double length;
final double width;
final Color color;
final double thickness;
final double spacing;
final LineType? lineType;
final Axis axis;
const EasyLine({
key,
this.length = 50.0,
this.color = Colors.grey,
this.thickness = 3,
this.spacing = 3.0,
this.width = 2.0,
this.lineType = LineType.normal,
this.axis = Axis.horizontal,
}) : super(key: key);
@override
Widget build(BuildContext context) {
return Container(
width: axis == Axis.horizontal
? length
: thickness,
height: axis == Axis.vertical
? length : thickness,
decoration: BoxDecoration(
color: color,
borderRadius: BorderRadius.circular(100),
),
);
}
}
enum LineType {
normal,
dotted,
dashed,
}
class LineStyle {
final Color ?defaultLineColor;
final Color ?unreachedLineColor;
final Color ?activeLineColor;
final Color ?finishedLineColor;
final double lineLength;
final double lineThickness;
final double lineWidth;
final double lineSpace;
final LineType lineType;
final LineType ?unreachedLineType;
final Color ?progressColor;
final double ?progress;
const LineStyle({
Key ?key,
this.lineType = LineType.dotted,
this.defaultLineColor,
this.unreachedLineColor,
this.activeLineColor,
this.finishedLineColor,
this.lineLength = 40,
this.lineWidth = 4,
this.lineThickness = 1,
this.lineSpace = 5,
this.unreachedLineType,
this.progressColor,
this.progress,
}) : assert(
progressColor == null || progress != null,
'progress should be defined to use progressColor',
),
assert(
progress == null || (progress >= 0 && progress <= 1),
'progress value should be between 0 and 1',
);
}

@ -1,271 +0,0 @@
library easy_stepper;
import 'dart:math';
import 'package:flutter/material.dart';
import 'package:test_sa/new_views/app_style/app_color.dart';
import 'components/base_step.dart';
import 'components/custom_line.dart';
class CustomStepper extends StatefulWidget {
final List<StepModel> steps;
final OnStepReached ?onStepReached;
final Color ?unreachedStepBackgroundColor;
final Color ?unreachedStepTextColor;
final Color ?unreachedStepIconColor;
final Color ?unreachedStepBorderColor;
final BorderType ?unreachedStepBorderType;
final Color activeStepBackgroundColor;
final Color? activeStepTextColor;
final Color activeStepIconColor;
final Color activeStepBorderColor;
final BorderType ?activeStepBorderType;
final Color finishedStepBackgroundColor;
final Color ?finishedStepBorderColor;
final Color ?finishedStepTextColor;
final Color ?finishedStepIconColor;
final BorderType ?finishedStepBorderType;
final double stepRadius;
final int activeStep;
final int ?maxReachedStep;
final Set<int>? reachedSteps;
final AlignmentGeometry alignment;
final double internalPadding;
final EdgeInsetsGeometry padding;
final bool titlesAreLargerThanSteps;
final Curve stepAnimationCurve;
final Duration stepAnimationDuration;
final double borderThickness;
final StepShape stepShape;
final double ?stepBorderRadius;
final bool showStepBorder;
final bool showScrollbar;
final bool fitWidth;
final LineStyle ?lineStyle;
const CustomStepper({
Key? key,
required this.activeStep,
required this.steps,
this.reachedSteps,
this.maxReachedStep,
this.onStepReached,
this.unreachedStepBackgroundColor,
this.unreachedStepTextColor,
this.unreachedStepIconColor,
this.unreachedStepBorderColor,
this.activeStepTextColor,
this.activeStepIconColor=AppColor.primary10,
this.activeStepBackgroundColor=AppColor.primary10,
this.activeStepBorderColor=AppColor.primary10,
this.finishedStepBackgroundColor=AppColor.primary10,
this.finishedStepBorderColor,
this.finishedStepIconColor,
this.stepRadius = 20,
this.alignment = Alignment.center,
this.fitWidth = true,
this.showScrollbar = false,
this.padding=EdgeInsetsDirectional.zero,
this.titlesAreLargerThanSteps = false,
this.internalPadding = 8,
this.stepAnimationCurve = Curves.linear,
this.stepAnimationDuration = const Duration(seconds: 1),
this.borderThickness = 1,
this.stepShape = StepShape.circle,
this.stepBorderRadius,
this.unreachedStepBorderType,
this.activeStepBorderType,
this.finishedStepBorderType,
this.showStepBorder = false,
this.lineStyle, this.finishedStepTextColor,
}) : assert(maxReachedStep == null || reachedSteps == null,
'only "maxReachedStep" or "reachedSteps" allowed'),
super(key: key);
@override
State<CustomStepper> createState() => _CustomStepperState();
}
class _CustomStepperState extends State<CustomStepper> {
late ScrollController _scrollController;
int ?_selectedIndex;
LineStyle? lineStyle;
EdgeInsetsGeometry? _padding;
@override
void initState() {
lineStyle = widget.lineStyle ?? const LineStyle();
_selectedIndex = widget.activeStep;
_scrollController = ScrollController();
_padding = const EdgeInsetsDirectional.all(10);
if (widget.steps.any((element) => element.topTitle??false)) {
_padding = _padding!.add(const EdgeInsetsDirectional.only(top: 45));
}
if (widget.titlesAreLargerThanSteps) {
_padding = _padding!.add(EdgeInsetsDirectional.symmetric(
horizontal: lineStyle!.lineLength / 2));
}
_padding!.add(widget.padding);
super.initState();
}
@override
void didUpdateWidget(CustomStepper oldWidget) {
super.didUpdateWidget(oldWidget);
// Verify that the active step falls within a valid range.
if (widget.activeStep >= 0 && widget.activeStep < widget.steps.length) {
_selectedIndex = widget.activeStep;
}
}
@override
void dispose() {
_scrollController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
lineStyle = widget.lineStyle ?? const LineStyle();
return Align(
alignment: widget.alignment,
child: NotificationListener<OverscrollIndicatorNotification>(
onNotification: (OverscrollIndicatorNotification overscroll) {
overscroll.disallowIndicator();
return false;
},
child: FittedBox(
fit: widget.fitWidth ? BoxFit.fitWidth : BoxFit.none,
child: Row(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.center,
children: _buildEasySteps(),
),
)
),
);
}
List<Widget> _buildEasySteps() {
return List.generate(widget.steps.length, (index) {
return Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
_buildStep(index),
_buildLine(index, Axis.horizontal),
],
);
});
}
BaseStep _buildStep(int index) {
final step = widget.steps[index];
return BaseStep(
step: step,
radius: widget.stepRadius,
isActive: index == widget.activeStep,
isFinished: widget.reachedSteps != null
? index < widget.activeStep && widget.reachedSteps!.contains(index)
: index < widget.activeStep,
isUnreached: index > widget.activeStep,
isAlreadyReached: widget.reachedSteps != null
? widget.reachedSteps!.contains(index)
: widget.maxReachedStep != null
? index <= widget.maxReachedStep!
: false,
activeStepBackgroundColor: widget.activeStepBackgroundColor,
activeStepBorderColor: widget.activeStepBorderColor,
activeTextColor: widget.activeStepTextColor??AppColor.neutral100,
activeIconColor: widget.activeStepIconColor,
unreachedBackgroundColor: widget.unreachedStepBackgroundColor??AppColor.white10,
unreachedBorderColor: widget.unreachedStepBorderColor??AppColor.neutral100,
unreachedTextColor: widget.unreachedStepTextColor??AppColor.neutral100,
unreachedIconColor: widget.unreachedStepIconColor??AppColor.neutral100,
padding: max(widget.internalPadding, 0),
stepRadius: widget.stepBorderRadius??10,
showStepBorder: widget.showStepBorder,
lineLength: lineStyle!.lineLength,
enabled: widget.steps[index].enabled??false,
);
}
// BorderType _handleBorderType(int index) {
// if (index == widget.activeStep) {
// //Active Step
// return widget.activeStepBorderType ?? widget.defaultStepBorderType;
// } else if (index > widget.activeStep) {
// //Unreached Step
// return widget.unreachedStepBorderType ?? widget.defaultStepBorderType;
// } else if (index < widget.activeStep) {
// //Finished Step
// return widget.finishedStepBorderType ?? widget.defaultStepBorderType;
// } else {
// return widget.defaultStepBorderType;
// }
// }
Color _getLineColor(int index) {
Color ?preferredColor;
if (index == widget.activeStep) {
//Active Step
preferredColor = lineStyle!.activeLineColor??AppColor.primary10;
} else if (index > widget.activeStep) {
//Unreached Step
preferredColor = lineStyle!.unreachedLineColor??AppColor.primary10;
} else if (index < widget.activeStep) {
//Finished Step
preferredColor = lineStyle!.finishedLineColor??AppColor.primary10;
}
return preferredColor ??
lineStyle!.defaultLineColor ??
Theme.of(context).colorScheme.primary;
}
Widget _buildLine(int index, Axis axis) {
return index < widget.steps.length - 1
? Column(
children: [
Padding(
padding: EdgeInsets.only(
top: axis == Axis.horizontal
? (widget.stepRadius - lineStyle!.lineThickness)
: 0,
),
child: _buildBaseLine(index, axis),
),
if (axis == Axis.horizontal) ...[
const SizedBox(height: 5),
SizedBox(
width: lineStyle!.lineLength,
child: widget.steps[index].customLineWidget ??
Text(
widget.steps[index].lineText??'',
maxLines: 3,
textAlign: TextAlign.center,
style: Theme.of(context).textTheme.labelSmall,
),
),
],
],
)
: const Offstage();
}
EasyLine _buildBaseLine(int index, Axis axis) {
return EasyLine(
length: lineStyle!.lineLength,
color: _getLineColor(index),
thickness: lineStyle!.lineThickness,
spacing: lineStyle!.lineSpace,
width: lineStyle!.lineWidth,
axis: axis,
lineType:
index > widget.activeStep - 1 && lineStyle!.unreachedLineType != null
? lineStyle!.unreachedLineType
: lineStyle!.lineType,
);
}
}

@ -0,0 +1,31 @@
import 'package:test_sa/config/color_scheme.dart';
import 'package:test_sa/config/color_schemes/default_color_scheme.dart';
import 'package:test_sa/config/color_schemes/red_sea_global_color_scheme.dart';
/// Client configuration
/// Change the active client here to switch color schemes
class ClientConfig {
ClientConfig._();
// 🎨 CHANGE THIS TO SWITCH CLIENTS
// Options: 'default', 'redseaglobal'
static const String activeClient = 'redseaglobal';
/// Get the active color scheme based on client configuration
static ColorScheme getColorScheme() {
switch (activeClient.toLowerCase()) {
case 'redseaglobal':
case 'red_sea_global':
return RedSeaGlobalColorScheme();
case 'default':
default:
return DefaultColorScheme();
}
}
/// Quick access to active scheme
static ColorScheme get colors => getColorScheme();
/// Check if dark theme is supported for current client
static bool get supportsDarkTheme => colors.supportsDarkTheme;
}

@ -0,0 +1,28 @@
import 'package:flutter/material.dart';
/// Base class for client color schemes
abstract class ColorScheme {
// Primary colors - the main brand colors
Color get primary10;
Color get primary30;
Color get primary40;
Color get primary50;
Color get primary60;
Color get primary70;
Color get primary80;
Color get primary90;
Color get primary63;
// Background colors
Color get backgroundLight;
Color get backgroundDark;
Color get backgroundTabBarDark;
Color get containerDark;
Color get containerBorderDark;
Color get containerBorderLight;
Color get dropDownDark;
// Whether this client supports dark theme
bool get supportsDarkTheme;
}

@ -0,0 +1,57 @@
import 'package:flutter/material.dart';
import 'package:test_sa/config/color_scheme.dart' as config;
/// Default color scheme - Original client colors
class DefaultColorScheme extends config.ColorScheme {
@override
Color get primary10 => const Color(0xff3DA5E5);
@override
Color get primary30 => const Color(0xffA2E2F8);
@override
Color get primary40 => const Color(0xff75BDE0);
@override
Color get primary50 => const Color(0xff4A8DB7);
@override
Color get primary60 => const Color(0xff3B7097);
@override
Color get primary70 => const Color(0xff163A51);
@override
Color get primary80 => const Color(0xff161D27);
@override
Color get primary90 => const Color(0xff1E95DE);
@override
Color get primary63 => const Color(0xff63A4D1);
@override
Color get backgroundLight => const Color(0xfff5f6fc);
@override
Color get backgroundDark => const Color(0xff080a14);
@override
Color get backgroundTabBarDark => const Color(0xff111427);
@override
Color get containerDark => const Color(0xff161A2D);
@override
Color get containerBorderDark => const Color(0xff3B3F56);
@override
Color get containerBorderLight => const Color(0xffEFEFEF);
@override
Color get dropDownDark => const Color(0xff1F2134);
@override
bool get supportsDarkTheme => true;
}

@ -0,0 +1,61 @@
import 'package:flutter/material.dart';
import 'package:test_sa/config/color_scheme.dart' as config;
/// RedSeaGlobal color scheme
/// Client-specific colors with single theme (no dark mode)
class RedSeaGlobalColorScheme extends config.ColorScheme {
// Main brand color: Serene Blue
@override
Color get primary10 => const Color(0xff14384C);
// Derived from Serene Blue for consistency
@override
Color get primary30 => const Color(0xff7A9FAF);
@override
Color get primary40 => const Color(0xff4E6B7C);
@override
Color get primary50 => const Color(0xff2D4F61);
@override
Color get primary60 => const Color(0xff1E3D4F);
@override
Color get primary70 => const Color(0xff0F2630);
@override
Color get primary80 => const Color(0xff0A1B23);
// Serene Blue - used for selected/active states (bottom nav, etc.)
@override
Color get primary90 => const Color(0xff14384C);
@override
Color get primary63 => const Color(0xff5B8597);
// Gentle White - used for both light and dark backgrounds (single theme)
@override
Color get backgroundLight => const Color(0xffFFFCFA);
@override
Color get backgroundDark => const Color(0xffFFFCFA); // Same as light - single theme only
@override
Color get backgroundTabBarDark => const Color(0xffFFFCFA);
@override
Color get containerDark => const Color(0xffFFFCFA); // Gentle White for container backgrounds
@override
Color get containerBorderDark => const Color(0xffE5E2E0);
@override
Color get containerBorderLight => const Color(0xffE5E2E0);
@override
Color get dropDownDark => const Color(0xffFFFCFA);
@override
bool get supportsDarkTheme => false; // RedSeaGlobal uses single theme only
}

@ -169,7 +169,7 @@ class _DashboardViewState extends State<DashboardView> {
mainAxisAlignment: MainAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.center,
children: [ children: [
'swipe'.toSvgAsset(width: 24, height: 24), 'swipe'.toSvgAsset(width: 24, height: 24,color: AppColor.primary10),
8.height, 8.height,
Text( Text(
("${context.translation.checkIn}\n${userProvider.swipeTransactionModel.swipeTime != null ? SwipeGeneralUtils.instance.formatTimeOnly(userProvider.swipeTransactionModel.swipeTime!) : '--:--'}"), ("${context.translation.checkIn}\n${userProvider.swipeTransactionModel.swipeTime != null ? SwipeGeneralUtils.instance.formatTimeOnly(userProvider.swipeTransactionModel.swipeTime!) : '--:--'}"),

@ -114,7 +114,7 @@ class _AssetDeliveryPageState extends State<AssetDeliveryPage> {
Container( Container(
height: 24, height: 24,
width: 24, width: 24,
decoration: const BoxDecoration( decoration: BoxDecoration(
shape: BoxShape.circle, shape: BoxShape.circle,
color: AppColor.primary10, // or AppColor.blueStatus(context) color: AppColor.primary10, // or AppColor.blueStatus(context)
), ),

@ -970,7 +970,7 @@ class ServiceRequestBottomSheet {
children: [ children: [
InkWell( InkWell(
child: acknowledge child: acknowledge
? const Icon( ? Icon(
Icons.check_box, Icons.check_box,
color: AppColor.primary10, color: AppColor.primary10,
) )

@ -98,7 +98,7 @@ class _WeeklyCalendarFragmentState extends State<WeeklyCalendarFragment> {
shape: RoundedRectangleBorder( shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10), borderRadius: BorderRadius.circular(10),
side: isSelected side: isSelected
? const BorderSide(color: AppColor.primary10, width: 1.5) // Blue border if selected ? BorderSide(color: AppColor.primary10, width: 1.5) // Blue border if selected
: BorderSide.none, : BorderSide.none,
), ),
shadows: [ shadows: [

@ -474,7 +474,7 @@ class _ChatPageState extends State<ChatPage> {
enableSeekGesture: false, enableSeekGesture: false,
continuousWaveform: false, continuousWaveform: false,
waveformType: WaveformType.long, waveformType: WaveformType.long,
playerWaveStyle: const PlayerWaveStyle( playerWaveStyle: PlayerWaveStyle(
fixedWaveColor: AppColor.neutral50, fixedWaveColor: AppColor.neutral50,
liveWaveColor: AppColor.primary10, liveWaveColor: AppColor.primary10,
showSeekLine: true, showSeekLine: true,
@ -679,7 +679,7 @@ class _ChatPageState extends State<ChatPage> {
icon: Selector<ChatProvider, _ChatSendButtonState>( icon: Selector<ChatProvider, _ChatSendButtonState>(
selector: (_, provider) => _ChatSendButtonState(isSending: provider.messageIsSending), selector: (_, provider) => _ChatSendButtonState(isSending: provider.messageIsSending),
builder: (_, sendState, __) => sendState.isSending builder: (_, sendState, __) => sendState.isSending
? const SizedBox( ? SizedBox(
height: 24, height: 24,
width: 24, width: 24,
child: CircularProgressIndicator(color: AppColor.primary10, strokeWidth: 2), child: CircularProgressIndicator(color: AppColor.primary10, strokeWidth: 2),

@ -88,7 +88,7 @@ class _ChatAudioPlayerState extends State<ChatAudioPlayer> {
child: Row( child: Row(
children: [ children: [
if (downloading) if (downloading)
const SizedBox( SizedBox(
height: 24, height: 24,
width: 24, width: 24,
child: CircularProgressIndicator(color: AppColor.primary10, strokeWidth: 2), child: CircularProgressIndicator(color: AppColor.primary10, strokeWidth: 2),
@ -124,7 +124,7 @@ class _ChatAudioPlayerState extends State<ChatAudioPlayer> {
enableSeekGesture: false, enableSeekGesture: false,
continuousWaveform: false, continuousWaveform: false,
waveformType: WaveformType.long, waveformType: WaveformType.long,
playerWaveStyle: const PlayerWaveStyle( playerWaveStyle: PlayerWaveStyle(
fixedWaveColor: AppColor.neutral50, fixedWaveColor: AppColor.neutral50,
liveWaveColor: AppColor.primary10, liveWaveColor: AppColor.primary10,
showSeekLine: true, showSeekLine: true,

@ -59,7 +59,7 @@ class ChatFileViewer extends StatelessWidget {
image: snapshot.hasData ? DecorationImage(fit: BoxFit.contain, image: getImage(snapshot.data!)) : null, image: snapshot.hasData ? DecorationImage(fit: BoxFit.contain, image: getImage(snapshot.data!)) : null,
), ),
child: snapshot.connectionState == ConnectionState.waiting child: snapshot.connectionState == ConnectionState.waiting
? const SizedBox( ? SizedBox(
height: 24, height: 24,
width: 24, width: 24,
child: CircularProgressIndicator(color: AppColor.primary10, strokeWidth: 2), child: CircularProgressIndicator(color: AppColor.primary10, strokeWidth: 2),

@ -119,7 +119,7 @@ class AttachmentFileViewer extends StatelessWidget {
child: SizedBox(width: 24, height: 24, child: CircularProgressIndicator(color: AppColor.loadingColor(context), strokeWidth: 2).center), child: SizedBox(width: 24, height: 24, child: CircularProgressIndicator(color: AppColor.loadingColor(context), strokeWidth: 2).center),
); );
} }
widget = const SizedBox(width: 24, height: 24, child: CircularProgressIndicator(color: AppColor.primary10, strokeWidth: 2)); widget = SizedBox(width: 24, height: 24, child: CircularProgressIndicator(color: AppColor.primary10, strokeWidth: 2));
} else { } else {
if (isImage) { if (isImage) {
widget = Image.file(snapshot.data!, width: 48, height: 48, fit: BoxFit.contain); widget = Image.file(snapshot.data!, width: 48, height: 48, fit: BoxFit.contain);
@ -204,30 +204,7 @@ class AttachmentFileViewer extends StatelessWidget {
color: Colors.white, color: Colors.white,
), ),
child: snapshot.connectionState == ConnectionState.waiting child: snapshot.connectionState == ConnectionState.waiting
? const SizedBox( ? SizedBox(
height: 24,
width: 24,
child: CircularProgressIndicator(color: AppColor.primary10, strokeWidth: 2),
).center
: snapshot.hasData
? Row(
children: [
getImage(snapshot.data!),
getFile(context, snapshot.data!),
],
)
: const Icon(Icons.broken_image_rounded),
);
return Container(
width: double.infinity,
height: 48,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(12),
color: Colors.white,
),
child: snapshot.connectionState == ConnectionState.waiting
? const SizedBox(
height: 24, height: 24,
width: 24, width: 24,
child: CircularProgressIndicator(color: AppColor.primary10, strokeWidth: 2), child: CircularProgressIndicator(color: AppColor.primary10, strokeWidth: 2),

@ -457,7 +457,7 @@ class _CreateLoanRequestPageState extends State<CreateLoanRequestPage> with Tick
Container( Container(
height: 24, height: 24,
width: 24, width: 24,
decoration: const BoxDecoration( decoration: BoxDecoration(
shape: BoxShape.circle, shape: BoxShape.circle,
color: AppColor.primary10, // or AppColor.blueStatus(context) color: AppColor.primary10, // or AppColor.blueStatus(context)
), ),

@ -247,7 +247,7 @@ class _TaskRequestDetailsViewState extends State<TaskRequestDetailsView> {
fontSize: 14.toScreenWidth, fontWeight: FontWeight.w500, fontStyle: FontStyle.normal, decoration: TextDecoration.none, color: context.isDark ? AppColor.neutral10 : AppColor.neutral20), fontSize: 14.toScreenWidth, fontWeight: FontWeight.w500, fontStyle: FontStyle.normal, decoration: TextDecoration.none, color: context.isDark ? AppColor.neutral10 : AppColor.neutral20),
children: [ children: [
TextSpan(text: "$totalHourString ", style: AppTextStyles.bodyText), TextSpan(text: "$totalHourString ", style: AppTextStyles.bodyText),
const WidgetSpan( WidgetSpan(
child: Icon(Icons.info_outline_rounded, color: AppColor.primary10, size: 14), child: Icon(Icons.info_outline_rounded, color: AppColor.primary10, size: 14),
), ),
], ],

@ -440,7 +440,7 @@ class _UpdateTaskRequestState extends State<UpdateTaskRequest> {
children: [ children: [
InkWell( InkWell(
child: taskModel.isUserAcknowledge == true child: taskModel.isUserAcknowledge == true
? const Icon( ? Icon(
Icons.check_box, Icons.check_box,
color: AppColor.primary10, color: AppColor.primary10,
) )

@ -1,21 +1,28 @@
import 'dart:developer';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:test_sa/extensions/context_extension.dart'; import 'package:test_sa/extensions/context_extension.dart';
import 'package:test_sa/config/client_config.dart';
class AppColor { class AppColor {
AppColor._(); AppColor._();
//primary //primary - Now dynamically loaded from ClientConfig
static const Color primary10 = Color(0xff3DA5E5); static Color get primary10 => ClientConfig.colors.primary10;
static const Color primary30 = Color(0xffA2E2F8);
static const Color primary40 = Color(0xff75BDE0); static Color get primary30 => ClientConfig.colors.primary30;
static const Color primary50 = Color(0xff4A8DB7);
static const Color primary60 = Color(0xff3B7097); static Color get primary40 => ClientConfig.colors.primary40;
static const Color primary70 = Color(0xff163A51);
static const Color primary80 = Color(0xff161D27); static Color get primary50 => ClientConfig.colors.primary50;
static const Color primary90 = Color(0xff1E95DE);
static const Color primary63 = Color(0xff63A4D1); static Color get primary60 => ClientConfig.colors.primary60;
static Color get primary70 => ClientConfig.colors.primary70;
static Color get primary80 => ClientConfig.colors.primary80;
static Color get primary90 => ClientConfig.colors.primary90;
static Color get primary63 => ClientConfig.colors.primary63;
//texts //texts
static const Color neutral10 = Color(0xffBCBCBC); static const Color neutral10 = Color(0xffBCBCBC);
@ -38,14 +45,20 @@ class AppColor {
static const Color disableDark = Color(0xff444756); static const Color disableDark = Color(0xff444756);
static const Color switchBgColor = Color(0xff5A5E79); static const Color switchBgColor = Color(0xff5A5E79);
//background //background - Now dynamically loaded from ClientConfig
static const Color backgroundLight = Color(0xfff5f6fc); static Color get backgroundLight => ClientConfig.colors.backgroundLight;
static const Color backgroundDark = Color(0xff080a14);
static const Color backgroundTabBarDark = Color(0xff111427); static Color get backgroundDark => ClientConfig.colors.backgroundDark;
static const Color containerDark = Color(0xff161A2D);
static const Color containerBorderDark = Color(0xff3B3F56); static Color get backgroundTabBarDark => ClientConfig.colors.backgroundTabBarDark;
static const Color containerBorderLight = Color(0xffEFEFEF);
static const Color dropDownDark = Color(0xff1F2134); static Color get containerDark => ClientConfig.colors.containerDark;
static Color get containerBorderDark => ClientConfig.colors.containerBorderDark;
static Color get containerBorderLight => ClientConfig.colors.containerBorderLight;
static Color get dropDownDark => ClientConfig.colors.dropDownDark;
//white //white
static const Color white10 = Color(0xffFFFFFF); static const Color white10 = Color(0xffFFFFFF);
@ -97,9 +110,9 @@ class AppColor {
// new UI colors // new UI colors
static const Color openChartColor = Color(0xff226187); static const Color openChartColor = Color(0xFFD2EBE6);
static const Color inProgressChartColor = Color(0xff3DA5E5); static const Color inProgressChartColor = Color(0xff14384C);
static const Color completeChartColor = Color(0xff92D9F8); static const Color completeChartColor = Color(0xffF2DED0);
static const Color openColor = Color(0xff3DA5E5); static const Color openColor = Color(0xff3DA5E5);
static const Color inProgressColor = Color(0xffFDE19B); static const Color inProgressColor = Color(0xffFDE19B);
static const Color completedColor = Color(0xff54C166); static const Color completedColor = Color(0xff54C166);
@ -145,7 +158,7 @@ class AppColor {
static Color yellowIcon(BuildContext context) => context.isDarkNotListen ? const Color(0xffFFC945) : orange70; static Color yellowIcon(BuildContext context) => context.isDarkNotListen ? const Color(0xffFFC945) : orange70;
static Color background(BuildContext context) => context.isDark ? containerDark : Colors.white; static Color background(BuildContext context) => containerDark;
static Color tabBarBackground(BuildContext context) => context.isDark ? disableDark : neutral90; static Color tabBarBackground(BuildContext context) => context.isDark ? disableDark : neutral90;
@ -198,7 +211,8 @@ class AppColor {
static Color noButtonColor(BuildContext context) => context.isDark ? AppColor.neutral70 : AppColor.white60; static Color noButtonColor(BuildContext context) => context.isDark ? AppColor.neutral70 : AppColor.white60;
static Color filterButtonTextColor(BuildContext context) => context.isDark ? neutral30 : neutral50; static Color filterButtonTextColor(BuildContext context) => context.isDark ? neutral30 : neutral50;
static Color addItemButtonColor(BuildContext context) => context.isDark ? AppColor.neutral60 : AppColor.white10;
static Color addItemButtonColor(BuildContext context) => context.isDark ? AppColor.neutral60 : AppColor.white10;
static Color getRequestStatusTextColorByName(BuildContext context, String? status) { static Color getRequestStatusTextColorByName(BuildContext context, String? status) {
switch ((status ?? "").toLowerCase()) { switch ((status ?? "").toLowerCase()) {
@ -227,7 +241,7 @@ class AppColor {
} }
} }
static Color getHistoryLogStatusTextColorByName(BuildContext context,String status) { static Color getHistoryLogStatusTextColorByName(BuildContext context, String status) {
switch ((status).toLowerCase()) { switch ((status).toLowerCase()) {
case "in progress": case "in progress":
return yellowStatusTextColor; return yellowStatusTextColor;
@ -272,7 +286,7 @@ class AppColor {
} }
} }
static Color getHistoryLogStatusColorByName(BuildContext context,String status) { static Color getHistoryLogStatusColorByName(BuildContext context, String status) {
switch ((status).toLowerCase()) { switch ((status).toLowerCase()) {
case "in progress": case "in progress":
return yellowStatusColor; return yellowStatusColor;
@ -447,13 +461,13 @@ class AppColor {
static Color getEquipmentStatusTextColor(BuildContext context, int id) { static Color getEquipmentStatusTextColor(BuildContext context, int id) {
switch (id) { switch (id) {
case 368: case 368:
//partially Down //partially Down
return greenStatusTextColor; return greenStatusTextColor;
case 369: case 369:
// Completely Down // Completely Down
return redStatusTextColor; return redStatusTextColor;
case 790: case 790:
//UP //UP
return blueStatusTextColor; return blueStatusTextColor;
default: default:
return blueStatusTextColor; return blueStatusTextColor;

@ -5,13 +5,13 @@ import 'package:test_sa/new_views/app_style/app_text_style.dart';
class AppThemes { class AppThemes {
AppThemes._(); AppThemes._();
static ThemeData lightTheme = ThemeData.light().copyWith( static ThemeData get lightTheme => ThemeData.light().copyWith(
textTheme: ThemeData.light().textTheme.apply(fontFamily: AppTextStyle.fontFamily), textTheme: ThemeData.light().textTheme.apply(fontFamily: AppTextStyle.fontFamily),
primaryColor: AppColor.primary50, primaryColor: AppColor.primary50,
indicatorColor: AppColor.primary50, indicatorColor: AppColor.primary50,
scaffoldBackgroundColor: AppColor.backgroundLight, scaffoldBackgroundColor: AppColor.backgroundLight,
colorScheme: const ColorScheme.light(primary: AppColor.primary50, onPrimary: Colors.white, secondary: Colors.white, onSecondary: AppColor.neutral70), colorScheme: ColorScheme.light(primary: AppColor.primary50, onPrimary: Colors.white, secondary: Colors.white, onSecondary: AppColor.neutral70),
floatingActionButtonTheme: const FloatingActionButtonThemeData( floatingActionButtonTheme: FloatingActionButtonThemeData(
elevation: 0, elevation: 0,
iconSize: 46, iconSize: 46,
backgroundColor: AppColor.primary70, backgroundColor: AppColor.primary70,
@ -33,13 +33,13 @@ class AppThemes {
), ),
); );
static ThemeData darkTheme = ThemeData.dark().copyWith( static ThemeData get darkTheme => ThemeData.dark().copyWith(
textTheme: ThemeData.dark().textTheme.apply(fontFamily: AppTextStyle.fontFamily), textTheme: ThemeData.dark().textTheme.apply(fontFamily: AppTextStyle.fontFamily),
primaryColor: AppColor.primary50, primaryColor: AppColor.primary50,
indicatorColor: AppColor.primary50, indicatorColor: AppColor.primary50,
scaffoldBackgroundColor: AppColor.backgroundDark, scaffoldBackgroundColor: AppColor.backgroundDark,
colorScheme: const ColorScheme.light(primary: AppColor.primary50, onPrimary: AppColor.neutral60, secondary: AppColor.neutral60, onSecondary: Colors.white), colorScheme: ColorScheme.light(primary: AppColor.primary50, onPrimary: AppColor.neutral60, secondary: AppColor.neutral60, onSecondary: Colors.white),
floatingActionButtonTheme: const FloatingActionButtonThemeData( floatingActionButtonTheme: FloatingActionButtonThemeData(
elevation: 0, elevation: 0,
iconSize: 46, iconSize: 46,
backgroundColor: AppColor.primary40, backgroundColor: AppColor.primary40,

@ -14,7 +14,7 @@ class AppLazyLoading extends StatelessWidget {
width: 36.toScreenWidth, width: 36.toScreenWidth,
padding: const EdgeInsets.all(8), padding: const EdgeInsets.all(8),
decoration: BoxDecoration(color: AppColor.background(context), shape: BoxShape.circle, boxShadow: [AppStyle.boxShadow]), decoration: BoxDecoration(color: AppColor.background(context), shape: BoxShape.circle, boxShadow: [AppStyle.boxShadow]),
child: const Center(child: CircularProgressIndicator(strokeWidth: 3, color: AppColor.primary10)), child: Center(child: CircularProgressIndicator(strokeWidth: 3, color: AppColor.primary10)),
), ),
); );
} }

@ -58,7 +58,7 @@ class WorkingTimeTile extends StatelessWidget {
], ],
).expanded, ).expanded,
8.width, 8.width,
const Icon(Icons.info_outline_rounded, color: AppColor.primary10), Icon(Icons.info_outline_rounded, color: AppColor.primary10),
], ],
), ),
).onPress(() async { ).onPress(() async {

@ -102,7 +102,7 @@ class _MonthlyFragmentState extends State<MonthlyFragment> {
16.height, 16.height,
Row( Row(
children: [ children: [
const CircleAvatar(backgroundColor: AppColor.primary40, radius: 8), CircleAvatar(backgroundColor: AppColor.primary40, radius: 8),
8.width, 8.width,
context.translation.request.heading6(context), context.translation.request.heading6(context),
], ],

@ -84,7 +84,7 @@ class _LandPageState extends State<LandPage> {
child: (Platform.isAndroid ? "Fingerprint" : "Face ID").addTranslation.heading3(context).custom(fontWeight: FontWeight.w600), child: (Platform.isAndroid ? "Fingerprint" : "Face ID").addTranslation.heading3(context).custom(fontWeight: FontWeight.w600),
), ),
16.height, 16.height,
(Platform.isAndroid ? "fingerprint" : "faceid").toLottieAsset(height: 180), (Platform.isAndroid ? "fingerprint" : "faceid").toLottieAsset(height: 180,),
16.height, 16.height,
Align( Align(
alignment: AlignmentDirectional.centerStart, alignment: AlignmentDirectional.centerStart,

@ -36,7 +36,7 @@ class RequestPaginatedListview extends StatelessWidget {
separatorBuilder: (cxt, index) => 16.height, separatorBuilder: (cxt, index) => 16.height,
itemBuilder: (context, index) { itemBuilder: (context, index) {
if (index == list.length) { if (index == list.length) {
return const ListTile( return ListTile(
title: Row( title: Row(
mainAxisAlignment: MainAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[ children: <Widget>[

@ -416,7 +416,7 @@ class _ProfilePageState extends State<ProfilePage> {
), ),
calendarStyle: CalendarStyle( calendarStyle: CalendarStyle(
isTodayHighlighted: false, isTodayHighlighted: false,
todayDecoration: const BoxDecoration(color: AppColor.primary10, shape: BoxShape.circle), todayDecoration: BoxDecoration(color: AppColor.primary10, shape: BoxShape.circle),
defaultTextStyle: AppTextStyles.bodyText, defaultTextStyle: AppTextStyles.bodyText,
defaultDecoration: BoxDecoration(shape: BoxShape.circle, color: context.isDark ? AppColor.neutral50 : AppColor.neutral30), defaultDecoration: BoxDecoration(shape: BoxShape.circle, color: context.isDark ? AppColor.neutral50 : AppColor.neutral30),
), ),

@ -133,7 +133,7 @@ class ADatePicker extends StatelessWidget {
return Colors.transparent; return Colors.transparent;
}), }),
todayBorder: const BorderSide(color: AppColor.primary10, width: 1), todayBorder: BorderSide(color: AppColor.primary10, width: 1),
// Year selector styling // Year selector styling
yearForegroundColor: WidgetStateColor.resolveWith((states) { yearForegroundColor: WidgetStateColor.resolveWith((states) {
@ -179,7 +179,7 @@ class ADatePicker extends StatelessWidget {
// Input decoration for text field mode // Input decoration for text field mode
inputDecorationTheme: InputDecorationTheme( inputDecorationTheme: InputDecorationTheme(
focusedBorder: const UnderlineInputBorder( focusedBorder: UnderlineInputBorder(
borderSide: BorderSide(color: AppColor.primary10, width: 2), borderSide: BorderSide(color: AppColor.primary10, width: 2),
), ),
enabledBorder: UnderlineInputBorder( enabledBorder: UnderlineInputBorder(

@ -69,7 +69,7 @@ class AssetItemGridView extends StatelessWidget {
style: AppTextStyles.bodyText2.copyWith(color: AppColor.primary10), style: AppTextStyles.bodyText2.copyWith(color: AppColor.primary10),
), ),
4.width, 4.width,
const Icon(Icons.arrow_forward, color: AppColor.primary10, size: 14) Icon(Icons.arrow_forward, color: AppColor.primary10, size: 14)
], ],
), ),
], ],

@ -63,7 +63,7 @@ class AssetItemListView extends StatelessWidget {
style: AppTextStyles.bodyText2.copyWith(color: AppColor.primary10), style: AppTextStyles.bodyText2.copyWith(color: AppColor.primary10),
), ),
4.width, 4.width,
const Icon(Icons.arrow_forward, color: AppColor.primary10, size: 14) Icon(Icons.arrow_forward, color: AppColor.primary10, size: 14)
], ],
)) ))
], ],

@ -79,7 +79,7 @@ class _AssetStatusButtonsState extends State<AssetStatusButtons> {
builder: (context, snapshot, _) { builder: (context, snapshot, _) {
return snapshot.loading return snapshot.loading
? Shimmer( ? Shimmer(
gradient: const LinearGradient(colors: [AppColor.primary40, AppColor.primary50, AppColor.primary60]), gradient: LinearGradient(colors: [AppColor.primary40, AppColor.primary50, AppColor.primary60]),
child: Row( child: Row(
children: [ children: [
const _Skelton().expanded, const _Skelton().expanded,

Loading…
Cancel
Save