Merge branch 'master' of https://github.com/mdgriffith/elm-ui

.github/ISSUE_TEMPLATE/bug-unexpected-behavior-report.md

@@ -8,7 +8,7 @@ about: Capture any unexpected behavior or bugs you've found with this library
 
 If you can, please put together a [Short, Self Contained, Correct, Example](http://sscce.org/) of what you're encountering.  It really helps if the example is as succinct as possible.
 
-Here's a basic template in [ellie](https://ellie-app.com/3fhCyrxjLw3a1) to get you started!
+Here's a basic template in [ellie](https://www.ellie-app.com/3fhCyrxjLw3a1) to get you started!
 
 **Expected behavior**
 A clear and concise description of what you expected to happen.

.github/workflows/label-issues-from-body.yml

@@ -0,0 +1,14 @@
+name: "Label issue from body keyword"
+on:
+  issues:
+    types: [opened, edited]
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: Naturalclar/issue-action@v1.0.0
+        with:
+          keywords: '["https://ellie-app.com/"]'
+          labels: '["has-ellie"]'
+          github-token: "${{ secrets.GITHUB_TOKEN }}"

.github/workflows/label-issues-from-comments.yml

@@ -1,4 +1,4 @@
-name: "Set Issue Label"
+name: "Label issue from comment keyword"
 on:
   issue_comment:
     types: [created, edited]
@@ -19,10 +19,9 @@ jobs:
           github-token: "${{ secrets.GITHUB_TOKEN }}"
       - uses: Amwam/issue-comment-action@v1.3.1
         with:
-          keywords: '["#has-ellie"]'
+          keywords: '["#has-ellie", "https://ellie-app.com/"]'
           labels: '["has-ellie"]'
           github-token: "${{ secrets.GITHUB_TOKEN }}"
-
       - uses: Amwam/issue-comment-action@v1.3.1
         with:
           keywords: '["#no-ellie"]'

notes/classifying-issues.md

@@ -19,8 +19,8 @@ If you add a comment to an issue that references a label, that label will be ass
   - **Has Test** - `#has-test` - Once we have an ellie for the problem, we want a version of that code in the codebase so I can easily take a look.
     - The thing to do is to open a PR that copies that ellie into the [`tests-rendering/cases/open`](https://github.com/mdgriffith/elm-ui/tree/master/tests-rendering/cases/open) directory.  Give it a succinct, human name.
     - Rename the `Element.*` imports as `Testable.Element.*`
-    - Add a link to the issue, the title of the issue, and the body of the issue to the module comment.  [Here's an example](https://github.com/mdgriffith/elm-ui/tree/master/tests-rendering/cases/open/InFrontSize)
-  - Test is compiling - Optionally you can see if the test is compiling by first `cd tests-rendering` and then running `elm make cases/open/{The file}.elm --open --dir=view -- --output=view/elm.js --debug` 
+    - Add a link to the issue, the title of the issue, and the body of the issue to the module comment.  [Here's an example](https://github.com/mdgriffith/elm-ui/tree/master/tests-rendering/cases/open/InFrontSize.elm)
+  - Test is compiling - Optionally you can see if the test is compiling by first `cd tests-rendering` and then running `elm-live cases/open/{The file}.elm --open --dir=view -- --output=view/elm.js --debug` 
     - If it does not compile, flag the issue as `#test-not-compiling`.  Don't worry about fixing it unless it's really obvious what needs to happen.
   - Check if the test passes.  Do that by opening `tests-rendering/cases/view/view.html` after running the above compilation.  If it says all passes, likely you should flag the issue as `#test-incorrectly-passing`.
   - If it's failing, you can flag as `#test-failing`

tests-rendering/cases/open/FocusStylePrecedingElements.elm

@@ -0,0 +1,38 @@
+module FocusStylePrecedingElements exposing (main)
+
+{-|
+
+
+# `focused` style applied to an element when any element with a lower tab index is focused
+
+<https://github.com/mdgriffith/elm-ui/issues/198>
+
+When I add a focused attribute, the styles therein are applied not only when
+the element is focused, but also when any element with a lower tab index is focused.
+This behaviour is not browser-specific.
+
+To reproduce, tab through to the buttons in the Ellie below. As soon as the first
+button has focus, the third button (which is the only one with a focused attribute)
+is highlighted as well.
+
+I narrowed down the reason for this behaviour to this CSS selector:
+.s:focus ~ .fc-250-50-50-255-fs:not(.focus)
+
+Disabling it produces the correct focus behaviour.
+
+-}
+
+import Testable.Element exposing (..)
+import Testable.Element.Font as Font
+import Testable.Element.Input as Input
+
+
+main =
+    layout [] <|
+        column []
+            [ Input.button [] { onPress = Nothing, label = text "Button" }
+            , Input.button [] { onPress = Nothing, label = text "Button" }
+            , Input.button [ focused [ Font.color <| rgb255 250 50 50 ] ] { onPress = Nothing, label = text "Button" }
+            , Input.button [] { onPress = Nothing, label = text "Button" }
+            , Input.button [] { onPress = Nothing, label = text "Button" }
+            ]