diff options
| author | Kumar Priyansh <[email protected]> | 2020-08-31 00:31:12 +0530 |
|---|---|---|
| committer | Kumar Priyansh <[email protected]> | 2020-08-31 00:31:12 +0530 |
| commit | d18dd924dc52aec85086e8813837afbcfe257ad8 (patch) | |
| tree | 5b00ff55893b32af0b67cbb80b59ee2d56ebd4d8 | |
| parent | 8daea0c6a5f15958886ae9e7c16bc886d00aa74b (diff) | |
| download | dictionary-d18dd924dc52aec85086e8813837afbcfe257ad8.tar.xz dictionary-d18dd924dc52aec85086e8813837afbcfe257ad8.zip | |
Add: basic search ui
| -rw-r--r-- | app/css/style.css | 33 | ||||
| -rw-r--r-- | app/index.html | 7 |
2 files changed, 39 insertions, 1 deletions
diff --git a/app/css/style.css b/app/css/style.css new file mode 100644 index 0000000..a77cec5 --- /dev/null +++ b/app/css/style.css @@ -0,0 +1,33 @@ +body { + margin: 0; + padding: 0; + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; +} + +.dict_ui { + background-color: #204186; + width: 100%; + height: 100vh; + min-height: 100vh; + max-height: 100vh; +} + +.search_box { + position: absolute; + top: 40%; + left: 10%; + width: 80%; +} + +.search { + background: transparent; + font-size: 24px; + border: none; + color: #ffffff; + outline: none; + width: 100%; +} + +.search::placeholder { + color: #c9c9c9; +} diff --git a/app/index.html b/app/index.html index 5fcd6ec..e6a421d 100644 --- a/app/index.html +++ b/app/index.html @@ -4,8 +4,13 @@ <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Dictionary</title> + <link rel="stylesheet" href="css/style.css"> </head> <body> - Renderer + <div class="dict_ui"> + <div class="search_box"> + <input type="text" class="search" placeholder="Search for words..."> + </div> + </div> </body> </html>
\ No newline at end of file |