Spaces:
Sleeping
Sleeping
Commit
•
cfcea39
1
Parent(s):
a3c1cdf
Update modules/templates/translator.html
Browse files
modules/templates/translator.html
CHANGED
|
@@ -5,7 +5,7 @@
|
|
| 5 |
<meta charset="utf-8">
|
| 6 |
<title>Sema Translator</title>
|
| 7 |
<style>
|
| 8 |
-
|
| 9 |
font-family: 'Arial', sans-serif;
|
| 10 |
margin: 0;
|
| 11 |
padding: 0;
|
|
@@ -17,6 +17,7 @@
|
|
| 17 |
justify-content: space-around;
|
| 18 |
align-items: center;
|
| 19 |
margin: 50px 0;
|
|
|
|
| 20 |
}
|
| 21 |
|
| 22 |
.text-box {
|
|
@@ -25,6 +26,8 @@
|
|
| 25 |
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
|
| 26 |
padding: 20px;
|
| 27 |
width: 45%;
|
|
|
|
|
|
|
| 28 |
}
|
| 29 |
|
| 30 |
select,
|
|
@@ -45,8 +48,7 @@ textarea {
|
|
| 45 |
display: flex;
|
| 46 |
align-items: center;
|
| 47 |
justify-content: center;
|
| 48 |
-
|
| 49 |
-
margin: 0;
|
| 50 |
}
|
| 51 |
|
| 52 |
input[type="submit"] {
|
|
@@ -73,11 +75,19 @@ h1 {
|
|
| 73 |
color: #333;
|
| 74 |
}
|
| 75 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 76 |
</style>
|
| 77 |
</head>
|
| 78 |
|
| 79 |
<body>
|
| 80 |
-
<h1>Translate
|
| 81 |
|
| 82 |
<form action="#" method="post" id="translationForm">
|
| 83 |
<div class="container">
|
|
|
|
| 5 |
<meta charset="utf-8">
|
| 6 |
<title>Sema Translator</title>
|
| 7 |
<style>
|
| 8 |
+
body {
|
| 9 |
font-family: 'Arial', sans-serif;
|
| 10 |
margin: 0;
|
| 11 |
padding: 0;
|
|
|
|
| 17 |
justify-content: space-around;
|
| 18 |
align-items: center;
|
| 19 |
margin: 50px 0;
|
| 20 |
+
flex-wrap: wrap; /* Allow flex items to wrap to the next line */
|
| 21 |
}
|
| 22 |
|
| 23 |
.text-box {
|
|
|
|
| 26 |
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
|
| 27 |
padding: 20px;
|
| 28 |
width: 45%;
|
| 29 |
+
margin: 10px; /* Add some margin between the boxes */
|
| 30 |
+
box-sizing: border-box; /* Include padding and border in the width */
|
| 31 |
}
|
| 32 |
|
| 33 |
select,
|
|
|
|
| 48 |
display: flex;
|
| 49 |
align-items: center;
|
| 50 |
justify-content: center;
|
| 51 |
+
margin: 10px 0;
|
|
|
|
| 52 |
}
|
| 53 |
|
| 54 |
input[type="submit"] {
|
|
|
|
| 75 |
color: #333;
|
| 76 |
}
|
| 77 |
|
| 78 |
+
/* Media query for smaller screens */
|
| 79 |
+
@media only screen and (max-width: 768px) {
|
| 80 |
+
.text-box {
|
| 81 |
+
width: 90%; /* Adjust width for smaller screens */
|
| 82 |
+
}
|
| 83 |
+
}
|
| 84 |
+
|
| 85 |
+
|
| 86 |
</style>
|
| 87 |
</head>
|
| 88 |
|
| 89 |
<body>
|
| 90 |
+
<h1>Translate across 200 Languages</h1>
|
| 91 |
|
| 92 |
<form action="#" method="post" id="translationForm">
|
| 93 |
<div class="container">
|