simulacrumparty
/
domain-hacks
Observar 1
Favorito 0
Fork 0
Código Issues 0 Pull requests 0 Versões 0 Wiki Atividade
Ver código fonte

Styles

master
Dylan Baker 5 anos atrás
pai
944d197945
commit
4d052e1291
3 arquivos alterados com 31 adições e 3 exclusões
Visão dividida Mostrar estatísticas do Diff
  1. 7
    1
      src/lib.rs
  2. 1
    0
      www/index.html
  3. 23
    2
      www/style.css

+ 7
- 1
src/lib.rs Ver arquivo 

@@ -94,7 +94,13 @@ impl Component<Msg> for App {
94 94 
                                 ],
95 95 
                                 vec![text(if loading { "Loading..." } else { "Generate" })],
96 96 
                             ),
97 
-                            p(vec![id("result")], output),
97 
+                            p(
98 
+                                vec![
99 
+                                    id("result"),
100 
+                                    class(if output.is_empty() { "empty" } else { "" }),
101 
+                                ],
102 
+                                output,
103 
+                            ),
98 104 
                         ],
99 105 
                     ),
100 106 
                 ],

+ 1
- 0
www/index.html Ver arquivo 

@@ -3,6 +3,7 @@
3 3 
     <meta content="text/html;charset=utf-8" http-equiv="Content-Type" />
4 4 
     <title>Domain Hack Generator</title>
5 5 
     <link rel="stylesheet" href="/style.css" />
6 
+    <meta name="viewport" content="width=device-width" />
6 7 
   </head>
7 8 
   <body>
8 9 
     <script type="module">

+ 23
- 2
www/style.css Ver arquivo 

@@ -14,6 +14,7 @@ body {
14 14 
 .container {
15 15 
   margin: auto;
16 16 
   max-width: 768px;
17 
+  padding: 20px;
17 18 
 }
18 19
19 20 
 .heading {
 
@@ -41,7 +42,27 @@ body {
41 42 
   opacity: 0.5;
42 43 
 }
43 44
44 
-#result {
45 
+#result:not(.empty) {
46 
+  background: #666666;
47 
+  border-radius: 10px;
45 48 
   font-size: 56px;
46 
-  padding: 2.5em;
49 
+  margin-top: 2em;
50 
+  padding: 1em;
51 
+}
52 
+
53 
+@media (max-width: 768px) {
54 
+  .button {
55 
+    font-size: 18px;
56 
+    width: 100%;
57 
+  }
58 
+
59 
+  .heading {
60 
+    padding: 1em;
61 
+  }
62 
+
63 
+  #result:not(.empty) {
64 
+    font-size: 32px;
65 
+    margin-top: 1em;
66 
+    padding: 0.5em;
67 
+  }
47 68 
 }

Escrever Pré-visualização
Carregando…
Cancelar
Salvar