Skip to content

Commit d208a58

Browse files
committed
feat: customise html styles
1 parent ef3e23f commit d208a58

9 files changed

Lines changed: 164 additions & 110 deletions

File tree

mobile-app/lib/ui/views/learn/block/templates/grid/grid_view.dart

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import 'package:flutter/material.dart';
2+
import 'package:flutter_html/flutter_html.dart';
23
import 'package:flutter_scroll_shadow/flutter_scroll_shadow.dart';
34
import 'package:freecodecamp/models/learn/curriculum_model.dart';
45
import 'package:freecodecamp/ui/theme/fcc_theme.dart';
@@ -83,9 +84,13 @@ class BlockGridView extends StatelessWidget {
8384
),
8485
...parser.parse(
8586
'<p>${block.description.join(' ')}</p>',
86-
fontColor: FccColors.gray05,
87-
removeParagraphMargin: true,
8887
isSelectable: false,
88+
customStyles: {
89+
'*:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6)': Style(
90+
color: FccColors.gray05,
91+
),
92+
'p': Style(margin: Margins.zero),
93+
},
8994
),
9095
Row(
9196
children: [

mobile-app/lib/ui/views/learn/block/templates/link/link_view.dart

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import 'package:flutter/material.dart';
2+
import 'package:flutter_html/flutter_html.dart';
23
import 'package:freecodecamp/models/learn/curriculum_model.dart';
34
import 'package:freecodecamp/ui/theme/fcc_theme.dart';
45
import 'package:freecodecamp/ui/views/learn/block/block_template_viewmodel.dart';
@@ -55,9 +56,13 @@ class BlockLinkView extends StatelessWidget {
5556
),
5657
...parser.parse(
5758
'<p>${block.description.join(' ')}</p>',
58-
fontColor: FccColors.gray05,
59-
removeParagraphMargin: true,
6059
isSelectable: false,
60+
customStyles: {
61+
'*:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6)': Style(
62+
color: FccColors.gray05,
63+
),
64+
'p': Style(margin: Margins.zero),
65+
},
6166
),
6267
Row(
6368
children: [

mobile-app/lib/ui/views/learn/block/templates/list/list_view.dart

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import 'package:flutter/material.dart';
2+
import 'package:flutter_html/flutter_html.dart';
23
import 'package:freecodecamp/models/learn/curriculum_model.dart';
34
import 'package:freecodecamp/ui/theme/fcc_theme.dart';
45
import 'package:freecodecamp/ui/views/learn/block/block_template_viewmodel.dart';
@@ -77,9 +78,13 @@ class BlockListView extends StatelessWidget {
7778
),
7879
...parser.parse(
7980
'<p>${block.description.join(' ')}</p>',
80-
fontColor: FccColors.gray05,
81-
removeParagraphMargin: true,
8281
isSelectable: false,
82+
customStyles: {
83+
'*:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6)': Style(
84+
color: FccColors.gray05,
85+
),
86+
'p': Style(margin: Margins.zero),
87+
},
8388
),
8489
Row(
8590
children: [

mobile-app/lib/ui/views/learn/challenge/challenge_view.dart

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import 'dart:developer';
22

33
import 'package:flutter/material.dart';
4+
import 'package:flutter_html/flutter_html.dart';
45
import 'package:flutter_inappwebview/flutter_inappwebview.dart';
56
import 'package:flutter_scroll_shadow/flutter_scroll_shadow.dart';
67
import 'package:freecodecamp/enums/panel_type.dart';
@@ -485,8 +486,12 @@ class ChallengeView extends StatelessWidget {
485486
final widgets = parser.parse(
486487
test.instruction,
487488
isSelectable: true,
488-
removeParagraphMargin: true,
489-
fontColor: FccColors.gray00,
489+
customStyles: {
490+
'*:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6)': Style(
491+
color: FccColors.gray00,
492+
),
493+
'p': Style(margin: Margins.zero),
494+
},
490495
);
491496
return Column(
492497
crossAxisAlignment: CrossAxisAlignment.start,

mobile-app/lib/ui/views/learn/challenge/templates/english/english_view.dart

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import 'package:flutter/material.dart';
2+
import 'package:flutter_html/flutter_html.dart';
23
import 'package:freecodecamp/models/learn/challenge_model.dart';
34
import 'package:freecodecamp/models/learn/curriculum_model.dart';
45
import 'package:freecodecamp/ui/theme/fcc_theme.dart';
@@ -45,11 +46,17 @@ class EnglishView extends StatelessWidget {
4546
children: [
4647
...parser.parse(
4748
challenge.instructions,
48-
fontColor: FccColors.gray05,
49+
customStyles: {
50+
'*:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6)':
51+
Style(color: FccColors.gray05),
52+
},
4953
),
5054
...parser.parse(
5155
challenge.description,
52-
fontColor: FccColors.gray05,
56+
customStyles: {
57+
'*:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6)':
58+
Style(color: FccColors.gray05),
59+
},
5360
),
5461
],
5562
),

mobile-app/lib/ui/views/learn/challenge/templates/review/review_viewmodel.dart

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import 'package:flutter/widgets.dart';
2+
import 'package:flutter_html/flutter_html.dart';
23
import 'package:freecodecamp/app/app.locator.dart';
34
import 'package:freecodecamp/models/learn/challenge_model.dart';
45
import 'package:freecodecamp/service/learn/learn_service.dart';
@@ -49,12 +50,20 @@ class ReviewViewmodel extends BaseViewModel {
4950

5051
setParsedInstructions = parser.parse(
5152
challenge.instructions,
52-
fontColor: FccColors.gray05,
53+
customStyles: {
54+
'*:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6)': Style(
55+
color: FccColors.gray05,
56+
),
57+
},
5358
);
5459

5560
setParsedDescription = parser.parse(
5661
challenge.description,
57-
fontColor: FccColors.gray05,
62+
customStyles: {
63+
'*:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6)': Style(
64+
color: FccColors.gray05,
65+
),
66+
},
5867
);
5968
}
6069
}

mobile-app/lib/ui/views/learn/widgets/assignment_widget.dart

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import 'package:flutter/material.dart';
2+
import 'package:flutter_html/flutter_html.dart';
23
import 'package:freecodecamp/ui/views/news/html_handler/html_handler.dart';
34

45
class Assignment extends StatelessWidget {
@@ -53,7 +54,14 @@ class Assignment extends StatelessWidget {
5354
children: parser.parse(
5455
label,
5556
isSelectable: false,
56-
fontColor: value ? const Color(0xDEFFFFFF) : null,
57+
customStyles: value
58+
? {
59+
'*:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6)':
60+
Style(
61+
color: const Color(0xDEFFFFFF),
62+
),
63+
}
64+
: {},
5765
),
5866
),
5967
),

mobile-app/lib/ui/views/learn/widgets/quiz_widget.dart

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import 'package:flutter/material.dart';
2+
import 'package:flutter_html/flutter_html.dart';
23
import 'package:freecodecamp/models/learn/challenge_model.dart';
34
import 'package:freecodecamp/ui/theme/fcc_theme.dart';
45
import 'package:freecodecamp/ui/views/learn/widgets/challenge_card.dart';
@@ -129,7 +130,9 @@ class QuizWidget extends StatelessWidget {
129130
children: parser.parse(
130131
answerObj.value.answer,
131132
isSelectable: false,
132-
removeParagraphMargin: true,
133+
customStyles: {
134+
'p': Style(margin: Margins.zero),
135+
},
133136
),
134137
),
135138
),
@@ -175,7 +178,11 @@ class QuizWidget extends StatelessWidget {
175178
feedbackWidgets.addAll(
176179
parser.parse(
177180
feedback,
178-
fontColor: isCorrect == true ? FccColors.green40 : FccColors.red15,
181+
customStyles: {
182+
'*:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6)': Style(
183+
color: isCorrect == true ? FccColors.green40 : FccColors.red15,
184+
),
185+
},
179186
),
180187
);
181188
}

0 commit comments

Comments
 (0)