Merge pull request #10 from vagos/frontend

Small improvements to frontend
This commit is contained in:
Evangelos Lamprou 2023-10-22 12:00:55 +02:00 committed by GitHub
commit 8f050175f5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 41 additions and 21 deletions

View File

@ -1,11 +1,5 @@
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@200&family=Roboto+Mono:wght@200&family=Roboto:wght@300&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200&family=Roboto+Mono:wght@200&family=Roboto:wght@300&display=swap');
#tilt:hover {
/* box-shadow: 0px 0px 30px rgba(0,0,0, 0.6); */
/* cursor: pointer; */
/* transition: all 0.1s ease-in-out; */
}
.button { .button {
border: none; border: none;
color: white; color: white;

View File

@ -10,13 +10,19 @@ import Element.Events as Events exposing (onClick)
import Element.Font as Font import Element.Font as Font
import Element.Input as Input import Element.Input as Input
import Element.Keyed as Keyed import Element.Keyed as Keyed
import Html exposing (Html, hr)
import Html.Attributes import Html.Attributes
import Html.Parser
import Html.String
import Html.String import Html.String
import Html.Styled.Attributes exposing (css) import Html.Styled.Attributes exposing (css)
import Html exposing (Html, hr) import Html.Styled.Attributes exposing (css)
import Html.Events exposing (on)
import Json.Decode as JD import Json.Decode as JD
import List
import List.Extra import List.Extra
import Set exposing (Set) import Set exposing (Set)
import String.Extra exposing (stripTags)
import Time exposing (Posix) import Time exposing (Posix)
import Ur import Ur
import Ur.Cmd import Ur.Cmd
@ -25,12 +31,6 @@ import Ur.Jam exposing (isSig)
import Ur.Run import Ur.Run
import Ur.Sub import Ur.Sub
import Ur.Types exposing (Noun(..)) import Ur.Types exposing (Noun(..))
import Html.String
import List
import Html.Styled.Attributes exposing (css)
import Html.Parser
import String.Extra exposing (stripTags)
url : String url : String
url = url =
@ -171,17 +171,25 @@ noSearchResultsView = Element.el
We'll try and find you something. We'll try and find you something.
Just come back later.""") Just come back later.""")
subtleLink : String -> String -> Element Msg subtleLinkView : String -> String -> Element Msg
subtleLink text href = subtleLinkView text href =
Element.el Element.el
[ Font.size 15 [ Font.size 15
, pointer , pointer
, mouseOver , mouseOver
[ Font.color (rgb 0.7 0.7 0.7) [ Font.color (rgb 0.1 0.7 0.7)
] ]
] ]
(Element.html (Html.a [ Html.Attributes.href href ] [ Html.text text ])) (Element.html (Html.a [ Html.Attributes.href href ] [ Html.text text ]))
aboutView : Element Msg
aboutView = row [ centerX, padding 10, spacing 10]
[ subtleLinkView "[About]" "https://vagos.github.io/seax"
, subtleLinkView "[Code]" "https://github.com/ilyakooo0/seax"
]
view : Model -> Element Msg view : Model -> Element Msg
view model = view model =
@ -190,6 +198,7 @@ view model =
column [ centerX, centerY, padding 8, spacing 16 ] column [ centerX, centerY, padding 8, spacing 16 ]
[ logoView [ centerX, width (px 510), height (px 161) ] [ logoView [ centerX, width (px 510), height (px 161) ]
, searchView model , searchView model
, aboutView
] ]
Just _ -> Just _ ->
@ -307,17 +316,34 @@ view model =
) )
)) ))
, Element.html (Html.hr [Html.Attributes.style "width" "95%"] []) , Element.html (Html.hr [Html.Attributes.style "width" "95%"] [])
, row [ centerX, padding 10, spacing 10] , aboutView
[ subtleLink "[About]" "https://vagos.github.io/seax"
, subtleLink "[Code]" "https://github.com/ilyakooo0/seax"
] ]
]
onEnter : msg -> Element.Attribute msg
onEnter msg =
Element.htmlAttribute
(Html.Events.on "keyup"
(JD.field "key" JD.string
|> JD.andThen
(\key ->
if key == "Enter" then
JD.succeed msg
else
JD.fail "Not the enter key"
)
)
)
searchView : { a | search : String } -> Element Msg searchView : { a | search : String } -> Element Msg
searchView model = searchView model =
row [ spacing 8 ] row [ spacing 8 ]
[ Input.text [ Html.Attributes.class "shadow" |> htmlAttribute, width (px 400)] [ Input.text
[ Html.Attributes.class "shadow" |> htmlAttribute, width (px 400)
, onEnter (Search model.search)
]
{ onChange = UpdateSearch { onChange = UpdateSearch
, placeholder = Nothing , placeholder = Nothing
, text = model.search , text = model.search