this repo has no description
lustre frontent oat-ui gleam
1
fork

Configure Feed

Select the types of activity you want to include in your feed.

๐Ÿ’„ simplify logo on smaller screens

+66 -18
+2 -2
src/client.gleam
··· 134 134 layout(model, home.view(session), HomeMsg) 135 135 136 136 // LOGIN PAGE -------------------------------------------------------------- 137 - Model(session:, route: route.Login, page: page.Login(page), ..) -> 138 - layout(model, login.view(session, page), LoginMsg) 137 + Model(session:, route: route.Login, page: page.Login(page), lang:) -> 138 + layout(model, login.view(session, page, lang), LoginMsg) 139 139 140 140 // DASHBOARD PAGE ---------------------------------------------------------- 141 141 Model(session:, route: route.Dashboard, page: page.Dashboard(page), ..) ->
+64 -16
src/client/page/login.gleam
··· 1 1 import client/brand 2 + import client/language 2 3 import client/session 3 4 import gleam/json 4 5 import lustre/attribute.{class} as attr ··· 80 81 } 81 82 } 82 83 83 - pub fn view(_session: session.Session, model: Model) -> element.Element(Msg) { 84 + pub fn view( 85 + _session: session.Session, 86 + model: Model, 87 + lang: language.Language, 88 + ) -> element.Element(Msg) { 84 89 // Wrapper 85 90 let wrapper_attr = [ 86 91 class("mx-auto max-w-lg h-full"), ··· 90 95 html.div(wrapper_attr, [ 91 96 // ๏ฌ Logo with Title --- 92 97 html.section( 93 - [class("p-4 w-full"), class("flex gap-4 justify-center items-center")], 94 98 [ 95 - brand.logo([class("size-12 drop-shadow-md")]), 99 + class("p-4 w-full"), 100 + class("flex gap-2 justify-center items-center sm:gap-4"), 101 + ], 102 + [ 103 + brand.logo([class("size-8 drop-shadow-md sm:size-12")]), 96 104 html.div([], [ 97 105 brand.title([class("my-0 text-xl text-center")]), 98 - html.small([class("text-subtext")], [ 99 - html.text("Soluรงรตes Climรกticas Inteligentes"), 106 + html.small([class("hidden sm:inline text-subtext")], [ 107 + html.text(case lang { 108 + language.BrazillianPortuguese | language.PortugalPortuguese -> 109 + "Soluรงรตes Climรกticas Inteligentes" 110 + _ -> "Smart climate solutions" 111 + }), 100 112 ]), 101 113 ]), 102 114 ], 103 115 ), 104 116 105 117 // Form --- 106 - html.article([class("card")], [ 118 + html.article([class("w-full card @container")], [ 107 119 // Form Header 108 - html.header([], [ 109 - html.h3([class("my-2 font-bold")], [html.text("Entrar na Plataforma")]), 120 + html.header([class("hidden mb-4 @md:inline")], [ 121 + html.h3([class("my-2 font-bold")], [ 122 + html.text(case lang { 123 + language.BrazillianPortuguese | language.PortugalPortuguese -> 124 + "Entrar na Plataforma" 125 + _ -> "Join the Platform" 126 + }), 127 + ]), 110 128 html.p([class("text-subtext")], [ 111 - html.text("Acesse sua conta para gerenciar contratos de energia"), 129 + html.text(case lang { 130 + language.BrazillianPortuguese | language.PortugalPortuguese -> 131 + "Acesse sua conta para gerenciar contratos de energia" 132 + _ -> "Access your account to manage your energy contracts" 133 + }), 112 134 ]), 113 135 ]), 114 136 115 137 // Form input fields 116 - html.div([class("mt-4")], [ 138 + html.div([], [ 117 139 // ๓ฐ‡ฎ Email 118 140 html.label([attr.data("field", ""), class("mt-4")], [ 119 141 html.text("Email"), 120 142 html.input([ 121 143 attr.type_("email"), 122 144 attr.value(model.email), 123 - attr.placeholder("usuario@email.com"), 145 + attr.placeholder(case lang { 146 + language.BrazillianPortuguese | language.PortugalPortuguese -> 147 + "usuario@email.com" 148 + _ -> "user@email.com" 149 + }), 124 150 class("py-1 px-2 bg-gray-100 rounded-md text-subtext"), 125 151 class("placeholder:text-gray-400"), 126 152 class("text-sm font-light"), ··· 129 155 130 156 // ๏€ฃ Password 131 157 html.label([attr.data("field", ""), class("mt-4")], [ 132 - html.text("Senha"), 158 + html.text(case lang { 159 + language.BrazillianPortuguese | language.PortugalPortuguese -> 160 + "Senha" 161 + _ -> "Password" 162 + }), 133 163 html.input([ 134 164 attr.type_("password"), 135 165 attr.value(model.password), ··· 149 179 150 180 // --- 151 181 html.hr([class("my-4")]), 152 - html.div([class("flex justify-around text-sm")], [ 153 - html.a([], [html.text("Esqueci minha senha")]), 154 - html.a([], [html.text("Criar Conta")]), 155 - ]), 182 + html.div( 183 + [ 184 + class("text-sm text-center"), 185 + class("grid grid-cols-1 @xs:gap-2 @xs:grid-cols-2"), 186 + ], 187 + [ 188 + html.a([], [ 189 + html.text(case lang { 190 + language.BrazillianPortuguese | language.PortugalPortuguese -> 191 + "Esqueci a senha" 192 + _ -> "Forgot my password" 193 + }), 194 + ]), 195 + html.a([], [ 196 + html.text(case lang { 197 + language.BrazillianPortuguese | language.PortugalPortuguese -> 198 + "Criar Conta" 199 + _ -> "Create account" 200 + }), 201 + ]), 202 + ], 203 + ), 156 204 ]), 157 205 ]), 158 206 ])