Skip to content

Commit 187d2b0

Browse files
author
neurodynamic
committed
improves color styling on buttons and links
1 parent adbdc87 commit 187d2b0

File tree

5 files changed

+60
-44
lines changed

5 files changed

+60
-44
lines changed

‎elm/Main.elm‎

Lines changed: 11 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ import Main.Subscriptions
99
import Main.Update
1010
import Main.View
1111
import Stages.Debugging.Model exposing (HelpTab(..), Page(..))
12+
import Utils.DummyData as DummyData
1213
import Utils.Types.BreakType exposing (BreakType(..))
1314
import Utils.Types.Error as Error
1415

@@ -43,16 +44,16 @@ init flags =
4344
, randomNumbers = numbers
4445
, stage = Intro
4546

46-
-- , stage = DummyData.chooseFileStage
47-
-- , stage = DummyData.gotFileStage
48-
-- , stage = DummyData.debuggingStageStepsPage randomNumbers
49-
-- , stage = DummyData.debuggingStageIDontSeeAnyErrorsPage randomNumbers
50-
-- , stage = DummyData.debuggingStageBugHintsTab randomNumbers
51-
-- , stage = DummyData.debuggingStageTipsTab randomNumbers
52-
-- , stage = DummyData.debuggingStageEncouragementTab randomNumbers
53-
-- , stage = DummyData.debuggingStageShowAnswerTab randomNumbers
54-
-- , stage = DummyData.successfulFinishStage randomNumbers
55-
-- , stage = DummyData.shownAnswerFinishedStage randomNumbers
47+
-- , stage = DummyData.chooseFileStage
48+
-- , stage = DummyData.gotFileStage
49+
-- , stage = DummyData.debuggingStageStepsPage numbers
50+
-- , stage = DummyData.debuggingStageIDontSeeAnyErrorsPage numbers
51+
-- , stage = DummyData.debuggingStageBugHintsTab numbers
52+
-- , stage = DummyData.debuggingStageTipsTab numbers
53+
-- , stage = DummyData.debuggingStageEncouragementTab numbers
54+
-- , stage = DummyData.debuggingStageShowAnswerTab numbers
55+
-- , stage = DummyData.successfulFinishStage numbers
56+
-- , stage = DummyData.shownAnswerFinishedStage numbers
5657
, maybeError = startingError
5758
}
5859
, Cmd.none

‎elm/Main.js‎

Lines changed: 35 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -12488,27 +12488,6 @@ var $author$project$Utils$Pluralize$aOrSome = F2(
1248812488
return (count > 1) ? ('some ' + (term + 's')) : ('a ' + term);
1248912489
});
1249012490
var $author$project$Utils$Constants$appName = 'Debugging Practice';
12491-
var $mdgriffith$elm_ui$Internal$Model$Transparency = F2(
12492-
function (a, b) {
12493-
return {$: 'Transparency', a: a, b: b};
12494-
});
12495-
var $mdgriffith$elm_ui$Internal$Flag$transparency = $mdgriffith$elm_ui$Internal$Flag$flag(0);
12496-
var $mdgriffith$elm_ui$Element$alpha = function (o) {
12497-
var transparency = function (x) {
12498-
return 1 - x;
12499-
}(
12500-
A2(
12501-
$elm$core$Basics$min,
12502-
1.0,
12503-
A2($elm$core$Basics$max, 0.0, o)));
12504-
return A2(
12505-
$mdgriffith$elm_ui$Internal$Model$StyleClass,
12506-
$mdgriffith$elm_ui$Internal$Flag$transparency,
12507-
A2(
12508-
$mdgriffith$elm_ui$Internal$Model$Transparency,
12509-
'transparency-' + $mdgriffith$elm_ui$Internal$Model$floatClass(transparency),
12510-
transparency));
12511-
};
1251212491
var $mdgriffith$elm_ui$Internal$Model$Button = {$: 'Button'};
1251312492
var $elm$json$Json$Encode$bool = _Json_wrap;
1251412493
var $elm$html$Html$Attributes$boolProperty = F2(
@@ -12664,7 +12643,14 @@ var $mdgriffith$elm_ui$Element$Border$color = function (clr) {
1266412643
'border-color',
1266512644
clr));
1266612645
};
12646+
var $mdgriffith$elm_ui$Element$rgba = $mdgriffith$elm_ui$Internal$Model$Rgba;
12647+
var $author$project$Utils$Colors$darkened = function (amount) {
12648+
return A4($mdgriffith$elm_ui$Element$rgba, 0, 0, 0, amount);
12649+
};
1266712650
var $mdgriffith$elm_ui$Element$htmlAttribute = $mdgriffith$elm_ui$Internal$Model$Attr;
12651+
var $author$project$Utils$Colors$lightened = function (amount) {
12652+
return A4($mdgriffith$elm_ui$Element$rgba, 1, 1, 1, amount);
12653+
};
1266812654
var $mdgriffith$elm_ui$Internal$Model$Min = F2(
1266912655
function (a, b) {
1267012656
return {$: 'Min', a: a, b: b};
@@ -12792,8 +12778,6 @@ var $mdgriffith$elm_ui$Element$Border$rounded = function (radius) {
1279212778
};
1279312779
var $elm$virtual_dom$VirtualDom$style = _VirtualDom_style;
1279412780
var $elm$html$Html$Attributes$style = $elm$virtual_dom$VirtualDom$style;
12795-
var $mdgriffith$elm_ui$Element$rgba = $mdgriffith$elm_ui$Internal$Model$Rgba;
12796-
var $author$project$Utils$Colors$transparent = A4($mdgriffith$elm_ui$Element$rgba, 0, 0, 0, 0);
1279712781
var $author$project$Utils$Colors$white = A3($mdgriffith$elm_ui$Element$rgb, 1, 1, 1);
1279812782
var $mdgriffith$elm_ui$Internal$Model$BorderWidth = F5(
1279912783
function (a, b, c, d, e) {
@@ -12824,18 +12808,19 @@ var $author$project$Utils$UI$Buttons$buttonTemplate = function (_v0) {
1282412808
$mdgriffith$elm_ui$Element$Font$color($author$project$Utils$Colors$white),
1282512809
$mdgriffith$elm_ui$Element$Font$center,
1282612810
$mdgriffith$elm_ui$Element$Border$width(2),
12827-
$mdgriffith$elm_ui$Element$Border$color($author$project$Utils$Colors$white),
12811+
$mdgriffith$elm_ui$Element$Border$color(
12812+
$author$project$Utils$Colors$lightened(0.5)),
1282812813
$mdgriffith$elm_ui$Element$width(
1282912814
A2($mdgriffith$elm_ui$Element$minimum, 250, $mdgriffith$elm_ui$Element$shrink)),
1283012815
A2($mdgriffith$elm_ui$Element$paddingXY, 37, 22),
1283112816
$mdgriffith$elm_ui$Element$Border$rounded(8),
1283212817
$mdgriffith$elm_ui$Element$htmlAttribute(
1283312818
A2($elm$html$Html$Attributes$style, 'cursor', 'pointer')),
12834-
$mdgriffith$elm_ui$Element$alpha(1),
1283512819
$mdgriffith$elm_ui$Element$mouseOver(
1283612820
_List_fromArray(
1283712821
[
12838-
$mdgriffith$elm_ui$Element$Border$color($author$project$Utils$Colors$transparent)
12822+
$mdgriffith$elm_ui$Element$Border$color(
12823+
$author$project$Utils$Colors$darkened(0.05))
1283912824
]))
1284012825
]),
1284112826
attrs),
@@ -13570,6 +13555,27 @@ var $mdgriffith$elm_ui$Element$Input$renderBox = function (_v0) {
1357013555
var left = _v0.left;
1357113556
return $elm$core$String$fromInt(top) + ('px ' + ($elm$core$String$fromInt(right) + ('px ' + ($elm$core$String$fromInt(bottom) + ('px ' + ($elm$core$String$fromInt(left) + 'px'))))));
1357213557
};
13558+
var $mdgriffith$elm_ui$Internal$Model$Transparency = F2(
13559+
function (a, b) {
13560+
return {$: 'Transparency', a: a, b: b};
13561+
});
13562+
var $mdgriffith$elm_ui$Internal$Flag$transparency = $mdgriffith$elm_ui$Internal$Flag$flag(0);
13563+
var $mdgriffith$elm_ui$Element$alpha = function (o) {
13564+
var transparency = function (x) {
13565+
return 1 - x;
13566+
}(
13567+
A2(
13568+
$elm$core$Basics$min,
13569+
1.0,
13570+
A2($elm$core$Basics$max, 0.0, o)));
13571+
return A2(
13572+
$mdgriffith$elm_ui$Internal$Model$StyleClass,
13573+
$mdgriffith$elm_ui$Internal$Flag$transparency,
13574+
A2(
13575+
$mdgriffith$elm_ui$Internal$Model$Transparency,
13576+
'transparency-' + $mdgriffith$elm_ui$Internal$Model$floatClass(transparency),
13577+
transparency));
13578+
};
1357313579
var $mdgriffith$elm_ui$Element$Input$charcoal = A3($mdgriffith$elm_ui$Element$rgb, 136 / 255, 138 / 255, 133 / 255);
1357413580
var $mdgriffith$elm_ui$Element$Input$renderPlaceholder = F3(
1357513581
function (_v0, forPlaceholder, on) {
@@ -14436,6 +14442,7 @@ var $mdgriffith$elm_ui$Element$newTabLink = F2(
1443614442
_List_fromArray(
1443714443
[label])));
1443814444
});
14445+
var $author$project$Utils$Colors$veryDarkKickstartCodingBlue = A3($mdgriffith$elm_ui$Element$rgb255, 17, 123, 173);
1443914446
var $author$project$Utils$UI$Link$render = F2(
1444014447
function (attrs, _v0) {
1444114448
var url = _v0.url;
@@ -14449,7 +14456,7 @@ var $author$project$Utils$UI$Link$render = F2(
1444914456
$mdgriffith$elm_ui$Element$mouseOver(
1445014457
_List_fromArray(
1445114458
[
14452-
$mdgriffith$elm_ui$Element$Font$color($author$project$Utils$Colors$darkKickstartCodingBlue)
14459+
$mdgriffith$elm_ui$Element$Font$color($author$project$Utils$Colors$veryDarkKickstartCodingBlue)
1445314460
]))
1445414461
]),
1445514462
attrs),
@@ -15264,9 +15271,6 @@ var $author$project$Stages$Debugging$Model$HelpPage = {$: 'HelpPage'};
1526415271
var $author$project$Stages$Debugging$Model$IDontSeeAnyErrorsPage = {$: 'IDontSeeAnyErrorsPage'};
1526515272
var $author$project$Stages$Debugging$Msg$ISolvedIt = {$: 'ISolvedIt'};
1526615273
var $mdgriffith$elm_ui$Element$Font$alignLeft = A2($mdgriffith$elm_ui$Internal$Model$Class, $mdgriffith$elm_ui$Internal$Flag$fontAlignment, $mdgriffith$elm_ui$Internal$Style$classes.textLeft);
15267-
var $author$project$Utils$Colors$darkened = function (amount) {
15268-
return A4($mdgriffith$elm_ui$Element$rgba, 0, 0, 0, amount);
15269-
};
1527015274
var $author$project$Utils$Pluralize$itIsOrTheyAre = function (count) {
1527115275
return (count > 1) ? 'they are' : 'it is';
1527215276
};
@@ -15466,6 +15470,7 @@ var $elm$core$String$replace = F3(
1546615470
after,
1546715471
A2($elm$core$String$split, before, string));
1546815472
});
15473+
var $author$project$Utils$Colors$transparent = A4($mdgriffith$elm_ui$Element$rgba, 0, 0, 0, 0);
1546915474
var $author$project$Utils$UI$Css$unselectable = $mdgriffith$elm_ui$Element$htmlAttribute(
1547015475
A2($elm$html$Html$Attributes$style, 'user-select', 'none'));
1547115476
var $author$project$Stages$Finished$View$renderCodeLine = F2(

‎elm/Utils/Colors.elm‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,11 +4,13 @@ module Utils.Colors exposing
44
, darkKickstartCodingBlue
55
, darkened
66
, green
7+
, lightened
78
, kickstartCodingBlue
89
, lightGray
910
, purple
1011
, red
1112
, transparent
13+
, veryDarkKickstartCodingBlue
1214
, veryLightGray
1315
, white
1416
)
@@ -26,6 +28,11 @@ darkKickstartCodingBlue =
2628
rgb255 20 140 204
2729

2830

31+
veryDarkKickstartCodingBlue : Color
32+
veryDarkKickstartCodingBlue =
33+
rgb255 17 123 173
34+
35+
2936
purple : Color
3037
purple =
3138
rgb 0.45 0 0.7
@@ -70,6 +77,10 @@ darkened : Float -> Color
7077
darkened amount =
7178
rgba 0 0 0 amount
7279

80+
lightened : Float -> Color
81+
lightened amount =
82+
rgba 1 1 1 amount
83+
7384

7485
transparent : Color
7586
transparent =

‎elm/Utils/UI/Buttons.elm‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -34,13 +34,12 @@ buttonTemplate { label, attrs, msg } =
3434
, Font.color Colors.white
3535
, Font.center
3636
, Border.width 2
37-
, Border.color Colors.white
37+
, Border.color (Colors.lightened 0.5)
3838
, width (minimum 250 shrink)
3939
, paddingXY 37 22
4040
, Border.rounded 8
4141
, htmlAttribute (HtmlAttrs.style "cursor" "pointer")
42-
, alpha 1
43-
, mouseOver [ Border.color Colors.transparent ]
42+
, mouseOver [ Border.color (Colors.darkened 0.05) ]
4443
]
4544
++ attrs
4645
)

‎elm/Utils/UI/Link.elm‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ render : List (Attribute msg) -> { url : String, label : Element msg } -> Elemen
99
render attrs { url, label } =
1010
newTabLink
1111
([ Font.color Colors.kickstartCodingBlue
12-
, mouseOver [ Font.color Colors.darkKickstartCodingBlue ]
12+
, mouseOver [ Font.color Colors.veryDarkKickstartCodingBlue ]
1313
]
1414
++ attrs
1515
)

0 commit comments

Comments
 (0)