Some more stuff to the settings div.

This commit is contained in:
deepjyoti30
2020-05-14 12:14:04 +05:30
parent 4f028a77c6
commit 57b2057eab
3 changed files with 58 additions and 8 deletions

View File

@@ -101,12 +101,21 @@ body {
display: none;
position: fixed;
z-index: 1;
width: 100%;
height: 100%;
width: 80vw;
height: 80vh;
overflow: auto;
background: #fff; }
background: #fff;
color: #212121;
padding: 15px; }
.settings-modal .modal-content {
border: 1px solid red; }
width: 100%;
height: 100%; }
.settings-modal .settings-container .row {
padding: 15px 10px; }
.settings-modal .settings-container .row .col {
vertical-align: top;
display: inline-block;
padding: 10px 15px; }
.settings-modal .close {
color: #aaa;
float: right;

View File

@@ -11,7 +11,34 @@
<div id="settings" class="settings-modal">
<div class="modal-content">
<span class="close">&times;</span>
<p>Testing</p>
<h2>Settings</h2>
<div class="settings-container">
<div class="row">
<div class="col">
Username <input type="text" id="username">
</div>
<div class="col">
Search Engine
<select id="search-engine">
<option value="DuckDuckGo">DuckDuckGo</option>
<option value="Google">Google</option>
<option value="Bing">Bing</option>
<option value="Yahoo">Yahoo</option>
</select>
</div>
</div>
<div class="row">
<div class="col">
<b>Hide</b> Welcome Message <input type="checkbox" id="disabel-message">
</div>
<div class="col">
<b>Hide</b> date and time <input type="checkbox" id="disabel-date">
</div>
<div class="col">
<b>Hide</b> Search Bar <input type="checkbox" id="disabel-bar">
</div>
</div>
</div>
</div>
</div>
<div id="main" class="main">

View File

@@ -182,13 +182,27 @@ body {
display: none;
position: fixed;
z-index: 1;
width: 100%;
height: 100%;
width: 80vw;
height: 80vh;
overflow: auto;
background: $foreground;
color: #212121;
padding: 15px;
.modal-content {
border: 1px solid red;
width: 100%;
height: 100%;
}
.settings-container {
.row {
padding: 15px 10px;
.col {
vertical-align: top;
display: inline-block;
padding: 10px 15px;
}
}
}
.close {