Add styles to make login page resemble mastodon's
[akkoma] / lib / pleroma / web / templates / layout / app.html.eex
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset=utf-8 />
5 <title>Pleroma</title>
6 <style>
7 body {
8 background-color: #282c37;
9 font-family: sans-serif;
10 color:white;
11 }
12
13 .container {
14 margin: 50px auto;
15 max-width: 320px;
16 padding: 0;
17 padding: 40px 40px 40px 40px;
18 background-color: #313543;
19 border-radius: 4px;
20 }
21
22 h1 {
23 margin: 0;
24 }
25
26 h2 {
27 color: #9baec8;
28 font-weight: normal;
29 font-size: 20px;
30 margin-bottom: 40px;
31 }
32
33 form {
34 width: 100%;
35 }
36
37 input {
38 box-sizing: padding-box;
39 width: 100%;
40 padding: 10px;
41 margin-top: 20px;
42 background-color: rgba(0,0,0,.1);
43 color: white;
44 border: 0;
45 border-bottom: 2px solid #9baec8;
46 font-size: 14px;
47 }
48
49 input:focus {
50 border-bottom: 2px solid #4b8ed8;
51 }
52
53 button {
54 width: 100%;
55 color: white;
56 background-color: #419bdd;
57 border-radius: 4px;
58 border: none;
59 padding: 10px;
60 margin-top: 30px;
61 text-transform: uppercase;
62 font-weight: 500;
63 font-size: 16px;
64 }
65 </style>
66 </head>
67 <body>
68 <div class="container">
69 <h1>Pleroma</h1>
70 <%= render @view_module, @view_template, assigns %>
71 </div>
72 </body>
73 </html>