font fixes, view fixes

This commit is contained in:
DieMyst 2020-12-08 13:22:21 +03:00
parent 6fe522a5a0
commit d3b5f2105e
7 changed files with 32 additions and 20 deletions

View File

@ -3,7 +3,7 @@
<head>
<link rel="favicon" type="image/ico" href="images/favicon.ico" />
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@100;200&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@200;400;500&display=swap" rel="stylesheet">
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">

View File

@ -37,9 +37,9 @@ viewService : BlueprintInfo -> Html msg
viewService blueprint =
div [ classes "fl w-100 w-third-ns pr3 lucida" ]
[ a [ attribute "href" ("/blueprint/" ++ blueprint.id), classes "fl w-100 bg-white black mw6 mr3 mb3 hide-child pv3 pl4 br3 element-box ba b--white bw1 no-underline" ]
[ div [ classes "w-100 mb3 pt1 b f4" ] [ text blueprint.name ]
, div [ classes "w-100 mb4" ] [ text "By ", span [classes "b lucida-in"] [text blueprint.author] ]
, div [ classes "w-100 mt1" ] [ instancesText blueprint.instanceNumber ]
[ div [ classes "w-100 mb3 pt1 b f3" ] [ text blueprint.name ]
, div [ classes "w-100 mb4 fw4 gray-font" ] [ text "By ", span [classes "lucida-in normal"] [text blueprint.author] ]
, div [ classes "w-100 mt1 lucida-in" ] [ instancesText blueprint.instanceNumber ]
]
]

View File

@ -1,7 +1,7 @@
module HubPage.View exposing (..)
import Blueprints.View
import Html exposing (Html, a, div, h1, h2, span, text)
import Html exposing (Html, a, div, h2, span, text)
import Html.Attributes exposing (attribute)
import Instances.View
import Model exposing (Model)
@ -11,21 +11,21 @@ import Palette exposing (classes, redFont)
view : Model -> Html msg
view model =
div []
[ h1 [ redFont, classes "f2 lh-copy" ] [ text "Developer Hub" ]
div [ classes "pt4" ]
[ div [ redFont, classes "f2 fw4 pt4 pb3" ] [ text "Developer Hub" ]
, welcomeText
, h2 [ classes "mt4 pt4 mb3 lucida-in f4" ] [ text "Featured Blueprints" ]
, h2 [ classes "mt4 pt4 mb3 f3 fw5" ] [ text "Featured Blueprints" ]
, Blueprints.View.view model
, h2 [ classes "mt3 pt3 mb3 lucida-in f4" ] [ text "Featured Modules" ]
, h2 [ classes "mt3 pt3 mb3 f3 fw5" ] [ text "Featured Modules" ]
, Modules.View.view model
, h2 [ classes "mt3 pt3 mb3 lucida-in f4" ] [ text "Service Instances" ]
, h2 [ classes "mt3 pt3 mb3 f3 fw5" ] [ text "Service Instances" ]
, Tuple.second (Instances.View.view model (\_ -> True))
]
welcomeText : Html msg
welcomeText =
div [ classes "w-two-thirds lucida welcome-text" ]
div [ classes "w-two-thirds lucida welcome-text pt2" ]
[ span []
[ text "Welcome to the Fluence Developer Hub! Start building with composing existing services or explore featured modules to create your custom services. Learn more about how to build applications in "
, a [ attribute "href" "https://fluence-labs.readme.io/docs" ] [ text "Documentation" ]

View File

@ -46,10 +46,10 @@ viewTable instances =
[ table [ classes "f6 w-100 center ws-normal-ns", attribute "cellspacing" "0", style "word-break" "break-all" ]
[ thead []
[ tr [ classes "" ]
[ th [ classes "fw6 tl pa3 gray" ] [ text "SERVICE" ]
, th [ classes "fw6 tl pa3 gray" ] [ text "INSTANCE" ]
, th [ classes "fw6 tl pa3 gray" ] [ text "NODE" ]
, th [ classes "fw6 tl pa3 gray" ] [ text "IP" ]
[ th [ classes "fw5 tl pa3 gray-font" ] [ text "SERVICE" ]
, th [ classes "fw5 tl pa3 gray-font" ] [ text "INSTANCE" ]
, th [ classes "fw5 tl pa3 gray-font" ] [ text "NODE" ]
, th [ classes "fw5 tl pa3 gray-font" ] [ text "IP" ]
]
]
, tbody [ classes "lucida" ] (instances |> List.map viewInstance)

View File

@ -1,7 +1,7 @@
module Modules.View exposing (..)
import Dict exposing (Dict)
import Html exposing (Html, a, b, div, p, text)
import Html exposing (Html, a, div, p, text)
import Html.Attributes exposing (attribute)
import Maybe.Extra
import Model exposing (Model, PeerData)
@ -60,7 +60,7 @@ view modules =
viewService : ModuleShortInfo -> Html msg
viewService moduleInfo =
div [ classes "fl w-100 w-third-ns pr3" ]
[ a [ attribute "href" ("/module/" ++ moduleInfo.moduleInfo.name), classes "fl w-100 bg-white black mw6 mr2 mb3 hide-child pa2 element-box ba b--white bw1" ]
[ p [ classes "tl di" ] [ div [ classes "fl b w-100 mb1" ] [ b [classes ""] [text moduleInfo.moduleInfo.name ] ], div [ classes "fl w-100 mt1 lucida gray" ] [ instancesText moduleInfo.instanceNumber ] ]
[ a [ attribute "href" ("/module/" ++ moduleInfo.moduleInfo.name), classes "fl w-100 bg-white black mw6 mr2 mb3 hide-child pa2 element-box ba b--white bw1 pl3" ]
[ p [ classes "tl di" ] [ div [ classes "fl b w-100 mb1 fw5" ] [ text moduleInfo.moduleInfo.name ], div [ classes "fl w-100 mt1 lucida gray-font2" ] [ instancesText moduleInfo.instanceNumber ] ]
]
]

View File

@ -17,7 +17,7 @@ limitations under the License.
-}
import Browser exposing (Document, UrlRequest(..))
import Html exposing (Html, a, b, div, header, img, p, text)
import Html exposing (Html, a, div, header, img, p, text)
import Html.Attributes exposing (attribute, style)
import Model exposing (Model, Route(..))
import Msg exposing (..)
@ -47,7 +47,7 @@ body model =
[ img [ classes "v-mid dib mw-100 h-auto", attribute "src" "/images/logo_new.svg" ] []
]
]
, div [ classes "fl pl5 h-100" ] [ p [ classes "mv2" ] [ b [] [text "Developer Hub" ]] ]
, div [ classes "fl pl5 h-100" ] [ p [ classes "h-100 mv3 fw4 v-mid" ] [ text "Developer Hub" ] ]
]
]
]

View File

@ -9,9 +9,12 @@
height: inherit;
}
html { font-size: 87.5%; }
body {
font-family: 'Roboto Mono', monospace;
background-color: #F4F4F4;
font-size: 1rem;
}
h1 {
@ -22,12 +25,21 @@ h1 {
border-color: #E11E5A;
}
.gray-font {
color: #7d7d7d;
}
.gray-font2 {
color: #898989;
}
.lucida {
font-family: 'Lucida Grande', Lucida, Tahoma, Verdana, Arial, sans-serif;
}
.lucida-in {
font-family: 'Lucida Grande', Lucida, Tahoma, Verdana, Arial, sans-serif;
color: black;
}
.welcome-text {