From 1a6fb96787ccf55b0f843ea7ba5d676461104ebc Mon Sep 17 00:00:00 2001
From: Laura <L.Spilling@web.de>
Date: Sun, 12 Jul 2020 18:30:11 +0200
Subject: [PATCH] fixed Style Bugs
---
out/main.js | 387 ++++++++++++++++++++++---------------------
res/Stylesheet.css | 13 +-
src/FightingTool.elm | 23 ++-
3 files changed, 217 insertions(+), 206 deletions(-)
diff --git a/out/main.js b/out/main.js
index 63fbdfd..bb45388 100644
--- a/out/main.js
+++ b/out/main.js
@@ -8733,178 +8733,7 @@ var $author$project$Model$CustomEnemy = {$: 'CustomEnemy'};
var $author$project$Model$ShowModal = function (a) {
return {$: 'ShowModal', a: a};
};
-var $rundis$elm_bootstrap$Bootstrap$Internal$Button$Attrs = function (a) {
- return {$: 'Attrs', a: a};
-};
-var $rundis$elm_bootstrap$Bootstrap$Button$attrs = function (attrs_) {
- return $rundis$elm_bootstrap$Bootstrap$Internal$Button$Attrs(attrs_);
-};
-var $rundis$elm_bootstrap$Bootstrap$Internal$Button$Block = {$: 'Block'};
-var $rundis$elm_bootstrap$Bootstrap$Button$block = $rundis$elm_bootstrap$Bootstrap$Internal$Button$Block;
var $elm$html$Html$button = _VirtualDom_node('button');
-var $elm$core$Maybe$andThen = F2(
- function (callback, maybeValue) {
- if (maybeValue.$ === 'Just') {
- var value = maybeValue.a;
- return callback(value);
- } else {
- return $elm$core$Maybe$Nothing;
- }
- });
-var $rundis$elm_bootstrap$Bootstrap$Internal$Button$applyModifier = F2(
- function (modifier, options) {
- switch (modifier.$) {
- case 'Size':
- var size = modifier.a;
- return _Utils_update(
- options,
- {
- size: $elm$core$Maybe$Just(size)
- });
- case 'Coloring':
- var coloring = modifier.a;
- return _Utils_update(
- options,
- {
- coloring: $elm$core$Maybe$Just(coloring)
- });
- case 'Block':
- return _Utils_update(
- options,
- {block: true});
- case 'Disabled':
- var val = modifier.a;
- return _Utils_update(
- options,
- {disabled: val});
- default:
- var attrs = modifier.a;
- return _Utils_update(
- options,
- {
- attributes: _Utils_ap(options.attributes, attrs)
- });
- }
- });
-var $elm$core$Tuple$second = function (_v0) {
- var y = _v0.b;
- return y;
-};
-var $elm$html$Html$Attributes$classList = function (classes) {
- return $elm$html$Html$Attributes$class(
- A2(
- $elm$core$String$join,
- ' ',
- A2(
- $elm$core$List$map,
- $elm$core$Tuple$first,
- A2($elm$core$List$filter, $elm$core$Tuple$second, classes))));
-};
-var $rundis$elm_bootstrap$Bootstrap$Internal$Button$defaultOptions = {attributes: _List_Nil, block: false, coloring: $elm$core$Maybe$Nothing, disabled: false, size: $elm$core$Maybe$Nothing};
-var $elm$json$Json$Encode$bool = _Json_wrap;
-var $elm$html$Html$Attributes$boolProperty = F2(
- function (key, bool) {
- return A2(
- _VirtualDom_property,
- key,
- $elm$json$Json$Encode$bool(bool));
- });
-var $elm$html$Html$Attributes$disabled = $elm$html$Html$Attributes$boolProperty('disabled');
-var $rundis$elm_bootstrap$Bootstrap$Internal$Button$roleClass = function (role) {
- switch (role.$) {
- case 'Primary':
- return 'primary';
- case 'Secondary':
- return 'secondary';
- case 'Success':
- return 'success';
- case 'Info':
- return 'info';
- case 'Warning':
- return 'warning';
- case 'Danger':
- return 'danger';
- case 'Dark':
- return 'dark';
- case 'Light':
- return 'light';
- default:
- return 'link';
- }
-};
-var $rundis$elm_bootstrap$Bootstrap$General$Internal$screenSizeOption = function (size) {
- switch (size.$) {
- case 'XS':
- return $elm$core$Maybe$Nothing;
- case 'SM':
- return $elm$core$Maybe$Just('sm');
- case 'MD':
- return $elm$core$Maybe$Just('md');
- case 'LG':
- return $elm$core$Maybe$Just('lg');
- default:
- return $elm$core$Maybe$Just('xl');
- }
-};
-var $rundis$elm_bootstrap$Bootstrap$Internal$Button$buttonAttributes = function (modifiers) {
- var options = A3($elm$core$List$foldl, $rundis$elm_bootstrap$Bootstrap$Internal$Button$applyModifier, $rundis$elm_bootstrap$Bootstrap$Internal$Button$defaultOptions, modifiers);
- return _Utils_ap(
- _List_fromArray(
- [
- $elm$html$Html$Attributes$classList(
- _List_fromArray(
- [
- _Utils_Tuple2('btn', true),
- _Utils_Tuple2('btn-block', options.block),
- _Utils_Tuple2('disabled', options.disabled)
- ])),
- $elm$html$Html$Attributes$disabled(options.disabled)
- ]),
- _Utils_ap(
- function () {
- var _v0 = A2($elm$core$Maybe$andThen, $rundis$elm_bootstrap$Bootstrap$General$Internal$screenSizeOption, options.size);
- if (_v0.$ === 'Just') {
- var s = _v0.a;
- return _List_fromArray(
- [
- $elm$html$Html$Attributes$class('btn-' + s)
- ]);
- } else {
- return _List_Nil;
- }
- }(),
- _Utils_ap(
- function () {
- var _v1 = options.coloring;
- if (_v1.$ === 'Just') {
- if (_v1.a.$ === 'Roled') {
- var role = _v1.a.a;
- return _List_fromArray(
- [
- $elm$html$Html$Attributes$class(
- 'btn-' + $rundis$elm_bootstrap$Bootstrap$Internal$Button$roleClass(role))
- ]);
- } else {
- var role = _v1.a.a;
- return _List_fromArray(
- [
- $elm$html$Html$Attributes$class(
- 'btn-outline-' + $rundis$elm_bootstrap$Bootstrap$Internal$Button$roleClass(role))
- ]);
- }
- } else {
- return _List_Nil;
- }
- }(),
- options.attributes)));
-};
-var $rundis$elm_bootstrap$Bootstrap$Button$button = F2(
- function (options, children) {
- return A2(
- $elm$html$Html$button,
- $rundis$elm_bootstrap$Bootstrap$Internal$Button$buttonAttributes(options),
- children);
- });
var $rundis$elm_bootstrap$Bootstrap$Table$CellAttr = function (a) {
return {$: 'CellAttr', a: a};
};
@@ -9033,6 +8862,20 @@ var $elm$virtual_dom$VirtualDom$attribute = F2(
_VirtualDom_noJavaScriptOrHtmlUri(value));
});
var $elm$html$Html$Attributes$attribute = $elm$virtual_dom$VirtualDom$attribute;
+var $elm$core$Tuple$second = function (_v0) {
+ var y = _v0.b;
+ return y;
+};
+var $elm$html$Html$Attributes$classList = function (classes) {
+ return $elm$html$Html$Attributes$class(
+ A2(
+ $elm$core$String$join,
+ ' ',
+ A2(
+ $elm$core$List$map,
+ $elm$core$Tuple$first,
+ A2($elm$core$List$filter, $elm$core$Tuple$second, classes))));
+};
var $rundis$elm_bootstrap$Bootstrap$Modal$StartClose = {$: 'StartClose'};
var $rundis$elm_bootstrap$Bootstrap$Modal$getCloseMsg = function (config_) {
var _v0 = config_.withAnimation;
@@ -9235,6 +9078,20 @@ var $rundis$elm_bootstrap$Bootstrap$Modal$display = F2(
]);
}
});
+var $rundis$elm_bootstrap$Bootstrap$General$Internal$screenSizeOption = function (size) {
+ switch (size.$) {
+ case 'XS':
+ return $elm$core$Maybe$Nothing;
+ case 'SM':
+ return $elm$core$Maybe$Just('sm');
+ case 'MD':
+ return $elm$core$Maybe$Just('md');
+ case 'LG':
+ return $elm$core$Maybe$Just('lg');
+ default:
+ return $elm$core$Maybe$Just('xl');
+ }
+};
var $rundis$elm_bootstrap$Bootstrap$Modal$modalClass = function (size) {
var _v0 = $rundis$elm_bootstrap$Bootstrap$General$Internal$screenSizeOption(size);
if (_v0.$ === 'Just') {
@@ -9437,6 +9294,147 @@ var $author$project$Model$RemoveEnemy = function (a) {
var $author$project$Model$ShowAttackModal = function (a) {
return {$: 'ShowAttackModal', a: a};
};
+var $rundis$elm_bootstrap$Bootstrap$Internal$Button$Attrs = function (a) {
+ return {$: 'Attrs', a: a};
+};
+var $rundis$elm_bootstrap$Bootstrap$Button$attrs = function (attrs_) {
+ return $rundis$elm_bootstrap$Bootstrap$Internal$Button$Attrs(attrs_);
+};
+var $elm$core$Maybe$andThen = F2(
+ function (callback, maybeValue) {
+ if (maybeValue.$ === 'Just') {
+ var value = maybeValue.a;
+ return callback(value);
+ } else {
+ return $elm$core$Maybe$Nothing;
+ }
+ });
+var $rundis$elm_bootstrap$Bootstrap$Internal$Button$applyModifier = F2(
+ function (modifier, options) {
+ switch (modifier.$) {
+ case 'Size':
+ var size = modifier.a;
+ return _Utils_update(
+ options,
+ {
+ size: $elm$core$Maybe$Just(size)
+ });
+ case 'Coloring':
+ var coloring = modifier.a;
+ return _Utils_update(
+ options,
+ {
+ coloring: $elm$core$Maybe$Just(coloring)
+ });
+ case 'Block':
+ return _Utils_update(
+ options,
+ {block: true});
+ case 'Disabled':
+ var val = modifier.a;
+ return _Utils_update(
+ options,
+ {disabled: val});
+ default:
+ var attrs = modifier.a;
+ return _Utils_update(
+ options,
+ {
+ attributes: _Utils_ap(options.attributes, attrs)
+ });
+ }
+ });
+var $rundis$elm_bootstrap$Bootstrap$Internal$Button$defaultOptions = {attributes: _List_Nil, block: false, coloring: $elm$core$Maybe$Nothing, disabled: false, size: $elm$core$Maybe$Nothing};
+var $elm$json$Json$Encode$bool = _Json_wrap;
+var $elm$html$Html$Attributes$boolProperty = F2(
+ function (key, bool) {
+ return A2(
+ _VirtualDom_property,
+ key,
+ $elm$json$Json$Encode$bool(bool));
+ });
+var $elm$html$Html$Attributes$disabled = $elm$html$Html$Attributes$boolProperty('disabled');
+var $rundis$elm_bootstrap$Bootstrap$Internal$Button$roleClass = function (role) {
+ switch (role.$) {
+ case 'Primary':
+ return 'primary';
+ case 'Secondary':
+ return 'secondary';
+ case 'Success':
+ return 'success';
+ case 'Info':
+ return 'info';
+ case 'Warning':
+ return 'warning';
+ case 'Danger':
+ return 'danger';
+ case 'Dark':
+ return 'dark';
+ case 'Light':
+ return 'light';
+ default:
+ return 'link';
+ }
+};
+var $rundis$elm_bootstrap$Bootstrap$Internal$Button$buttonAttributes = function (modifiers) {
+ var options = A3($elm$core$List$foldl, $rundis$elm_bootstrap$Bootstrap$Internal$Button$applyModifier, $rundis$elm_bootstrap$Bootstrap$Internal$Button$defaultOptions, modifiers);
+ return _Utils_ap(
+ _List_fromArray(
+ [
+ $elm$html$Html$Attributes$classList(
+ _List_fromArray(
+ [
+ _Utils_Tuple2('btn', true),
+ _Utils_Tuple2('btn-block', options.block),
+ _Utils_Tuple2('disabled', options.disabled)
+ ])),
+ $elm$html$Html$Attributes$disabled(options.disabled)
+ ]),
+ _Utils_ap(
+ function () {
+ var _v0 = A2($elm$core$Maybe$andThen, $rundis$elm_bootstrap$Bootstrap$General$Internal$screenSizeOption, options.size);
+ if (_v0.$ === 'Just') {
+ var s = _v0.a;
+ return _List_fromArray(
+ [
+ $elm$html$Html$Attributes$class('btn-' + s)
+ ]);
+ } else {
+ return _List_Nil;
+ }
+ }(),
+ _Utils_ap(
+ function () {
+ var _v1 = options.coloring;
+ if (_v1.$ === 'Just') {
+ if (_v1.a.$ === 'Roled') {
+ var role = _v1.a.a;
+ return _List_fromArray(
+ [
+ $elm$html$Html$Attributes$class(
+ 'btn-' + $rundis$elm_bootstrap$Bootstrap$Internal$Button$roleClass(role))
+ ]);
+ } else {
+ var role = _v1.a.a;
+ return _List_fromArray(
+ [
+ $elm$html$Html$Attributes$class(
+ 'btn-outline-' + $rundis$elm_bootstrap$Bootstrap$Internal$Button$roleClass(role))
+ ]);
+ }
+ } else {
+ return _List_Nil;
+ }
+ }(),
+ options.attributes)));
+};
+var $rundis$elm_bootstrap$Bootstrap$Button$button = F2(
+ function (options, children) {
+ return A2(
+ $elm$html$Html$button,
+ $rundis$elm_bootstrap$Bootstrap$Internal$Button$buttonAttributes(options),
+ children);
+ });
var $rundis$elm_bootstrap$Bootstrap$Internal$Button$Coloring = function (a) {
return {$: 'Coloring', a: a};
};
@@ -9634,9 +9632,6 @@ var $author$project$FightingTool$displayCharacters = function (chars) {
};
var $rundis$elm_bootstrap$Bootstrap$Table$Hover = {$: 'Hover'};
var $rundis$elm_bootstrap$Bootstrap$Table$hover = $rundis$elm_bootstrap$Bootstrap$Table$Hover;
-var $rundis$elm_bootstrap$Bootstrap$Internal$Button$Light = {$: 'Light'};
-var $rundis$elm_bootstrap$Bootstrap$Button$light = $rundis$elm_bootstrap$Bootstrap$Internal$Button$Coloring(
- $rundis$elm_bootstrap$Bootstrap$Internal$Button$Roled($rundis$elm_bootstrap$Bootstrap$Internal$Button$Light));
var $rundis$elm_bootstrap$Bootstrap$Table$THead = function (a) {
return {$: 'THead', a: a};
};
@@ -10651,7 +10646,11 @@ var $author$project$FightingTool$customEnemy = function (model) {
var ddArmor = _v0.c;
return A2(
$elm$html$Html$div,
- _List_Nil,
+ _List_fromArray(
+ [
+ A2($elm$html$Html$Attributes$style, 'margin-left', '5%'),
+ A2($elm$html$Html$Attributes$style, 'margin-right', '5%')
+ ]),
_List_fromArray(
[
A2(
@@ -10792,7 +10791,11 @@ var $author$project$FightingTool$customEnemy = function (model) {
var $author$project$FightingTool$customHero = function (model) {
return A2(
$elm$html$Html$div,
- _List_Nil,
+ _List_fromArray(
+ [
+ A2($elm$html$Html$Attributes$style, 'margin-left', '5%'),
+ A2($elm$html$Html$Attributes$style, 'margin-right', '5%')
+ ]),
_List_fromArray(
[
A2(
@@ -11513,7 +11516,6 @@ var $rundis$elm_bootstrap$Bootstrap$Tab$link = F2(
return $rundis$elm_bootstrap$Bootstrap$Tab$Link(
{attributes: attributes, children: children});
});
-var $rundis$elm_bootstrap$Bootstrap$Utilities$Spacing$mt3 = $elm$html$Html$Attributes$class('mt-3');
var $rundis$elm_bootstrap$Bootstrap$Tab$Pane = function (a) {
return {$: 'Pane', a: a};
};
@@ -11854,7 +11856,10 @@ var $author$project$FightingTool$viewCustomEnemyModal = function (model) {
pane: A2(
$rundis$elm_bootstrap$Bootstrap$Tab$pane,
_List_fromArray(
- [$rundis$elm_bootstrap$Bootstrap$Utilities$Spacing$mt3]),
+ [
+ $elm$html$Html$Attributes$class('lightCopper'),
+ A2($elm$html$Html$Attributes$style, 'padding', '2%')
+ ]),
_List_fromArray(
[
$author$project$FightingTool$customEnemy(model)
@@ -11873,7 +11878,10 @@ var $author$project$FightingTool$viewCustomEnemyModal = function (model) {
pane: A2(
$rundis$elm_bootstrap$Bootstrap$Tab$pane,
_List_fromArray(
- [$rundis$elm_bootstrap$Bootstrap$Utilities$Spacing$mt3]),
+ [
+ $elm$html$Html$Attributes$class('lightCopper'),
+ A2($elm$html$Html$Attributes$style, 'padding', '2%')
+ ]),
_List_fromArray(
[
$author$project$FightingTool$customHero(model)
@@ -11942,17 +11950,13 @@ var $author$project$FightingTool$body = function (model) {
_List_fromArray(
[
A2(
- $rundis$elm_bootstrap$Bootstrap$Button$button,
+ $elm$html$Html$button,
_List_fromArray(
[
- $rundis$elm_bootstrap$Bootstrap$Button$light,
- $rundis$elm_bootstrap$Bootstrap$Button$block,
- $rundis$elm_bootstrap$Bootstrap$Button$attrs(
- _List_fromArray(
- [
- $elm$html$Html$Events$onClick(
- $author$project$Model$ShowModal($author$project$Model$CustomEnemy))
- ]))
+ $elm$html$Html$Attributes$class('metalButton'),
+ $elm$html$Html$Events$onClick(
+ $author$project$Model$ShowModal($author$project$Model$CustomEnemy)),
+ A2($elm$html$Html$Attributes$style, 'width', '100%')
]),
_List_fromArray(
[
@@ -14887,7 +14891,8 @@ var $author$project$FightingTool$header = A2(
$elm$html$Html$header,
_List_fromArray(
[
- $elm$html$Html$Attributes$class('header animate__animated animate__fadeInDown')
+ $elm$html$Html$Attributes$class('header animate__animated animate__fadeInDown'),
+ A2($elm$html$Html$Attributes$style, 'height', '80%')
]),
_List_fromArray(
[
@@ -14933,7 +14938,8 @@ var $author$project$FightingTool$header = A2(
$elm$html$Html$div,
_List_fromArray(
[
- $elm$html$Html$Attributes$class('item1')
+ $elm$html$Html$Attributes$class('item1'),
+ A2($elm$html$Html$Attributes$style, 'height', '80%')
]),
_List_fromArray(
[
@@ -14963,6 +14969,7 @@ var $author$project$FightingTool$header = A2(
]))
]))
]));
+var $rundis$elm_bootstrap$Bootstrap$Utilities$Spacing$mt3 = $elm$html$Html$Attributes$class('mt-3');
var $author$project$Main$view = function (model) {
return A2(
$elm$html$Html$div,
diff --git a/res/Stylesheet.css b/res/Stylesheet.css
index 01748cc..82e81ea 100644
--- a/res/Stylesheet.css
+++ b/res/Stylesheet.css
@@ -54,6 +54,10 @@ html {
background-color: #e4be9b
}
+.lightCopper{
+ background-color: #efd8c3;
+}
+
.fas:hover {
font-weight: 900;
color: #acacac;
@@ -66,7 +70,7 @@ html {
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
- background-color: #deb187;
+ background-color: #e4be9b;
border-color: #dee2e6 #dee2e6 #fff;
color: black;
}
@@ -82,14 +86,14 @@ html {
}
.btn {
- background-color: #e4be9b;
+ background-color: #deb187;
}
tr:nth-child(even) {background-color: white;}
tr:nth-child(odd) {background-color: #faf2eb;}
.metalButton {
- background-image: repeating-linear-gradient(to right bottom, #acacac , #bfbfbf , #acacac 40% );
+ background-image: repeating-linear-gradient(to right bottom, #999999, #acacac , #999999 40% );
border-radius: 8px;
padding: 8px 28px;
color: white;
@@ -100,7 +104,8 @@ tr:nth-child(odd) {background-color: #faf2eb;}
}
.metalButton:hover{
- background-image: repeating-linear-gradient(to right bottom, #acacac , #bfbfbf 10%, #acacac 40% );
+ background-image: repeating-linear-gradient(to right bottom, #acacac , #999999 10%, #acacac 40% );
+ color: black;
}
.PlayerIcon {
diff --git a/src/FightingTool.elm b/src/FightingTool.elm
index 5da80b4..284888c 100644
--- a/src/FightingTool.elm
+++ b/src/FightingTool.elm
@@ -45,12 +45,11 @@ body model =
(displayCharacters model.enemy ++
[Table.tr []
[ Table.td[Table.cellAttr <| Attr.colspan 10] -- naja um sicher zu gehen
- [ Button.button
- [ Button.light
- , Button.block
- , Button.attrs [onClick <| ShowModal CustomEnemy ]
- ]
- [ text "+"]
+ [ Html.button
+ [ class "metalButton"
+ , onClick <| ShowModal CustomEnemy
+ , style "width" "100%"
+ ][text "+"]
]
]
]
@@ -64,14 +63,14 @@ body model =
header : Html Msg
header =
- Html.header [class "header animate__animated animate__fadeInDown"]
+ Html.header [class "header animate__animated animate__fadeInDown", style "height" "80%"]
[ div [class "grid-container"]
[ Html.figure [ class "image animate__animated animate__rollIn"]
[ Svg.svg
[ SvgAtt.width "100%", style "margin-top" "-18%", style "margin-left" "10%"]
[ Svg.image [ SvgAtt.width "100%", SvgAtt.height "100%", SvgAtt.title "Logo", SvgAtt.xlinkHref "res/P&P Manager Logo 512x512px noBG.png" ] [] ]
]
- , div [class "item1"]
+ , div [class "item1", style "height" "80%"]
[ h1 [class "title", style "margin-left" "2%", style "margin-top" "4px"] [text "Pen & Paper Manager"]
, h2 [class "subtitle", style "margin-left" "2%"] [text "Für \"Das schwarze Auge\" Version 5"]
]
@@ -150,14 +149,14 @@ viewCustomEnemyModal model =
{ id = "enemy"
, link = Tab.link [] [ text "Gegner" ]
, pane =
- Tab.pane [ Spacing.mt3 ]
+ Tab.pane [ class "lightCopper" , style "padding" "2%"]
[ customEnemy model ]
}
, Tab.item
{ id = "hero"
, link = Tab.link [] [ text "Held" ]
, pane =
- Tab.pane [ Spacing.mt3 ]
+ Tab.pane [ class "lightCopper" , style "padding" "2%"]
[ customHero model ]
}
]
@@ -334,7 +333,7 @@ customEnemy model =
Hero _ _ -> (Input.placeholder "", Input.placeholder "", Input.placeholder "")
in
- div []
+ div [style "margin-left" "5%", style "margin-right" "5%"]
[ Form.label [] [text "Name:"]
, Input.text [Input.onInput
(\n ->
@@ -405,7 +404,7 @@ customEnemy model =
customHero : Model -> Html Msg
customHero model =
- div []
+ div [style "margin-left" "5%", style "margin-right" "5%"]
[ Form.label [] [text "Name"]
, Input.text [Input.onInput
(\n ->
--
GitLab