Some more stuff to the settings div.
This commit is contained in:
17
css/main.css
17
css/main.css
@@ -101,12 +101,21 @@ body {
|
|||||||
display: none;
|
display: none;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
width: 100%;
|
width: 80vw;
|
||||||
height: 100%;
|
height: 80vh;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
background: #fff; }
|
background: #fff;
|
||||||
|
color: #212121;
|
||||||
|
padding: 15px; }
|
||||||
.settings-modal .modal-content {
|
.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 {
|
.settings-modal .close {
|
||||||
color: #aaa;
|
color: #aaa;
|
||||||
float: right;
|
float: right;
|
||||||
|
|||||||
29
index.html
29
index.html
@@ -11,7 +11,34 @@
|
|||||||
<div id="settings" class="settings-modal">
|
<div id="settings" class="settings-modal">
|
||||||
<div class="modal-content">
|
<div class="modal-content">
|
||||||
<span class="close">×</span>
|
<span class="close">×</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>
|
</div>
|
||||||
<div id="main" class="main">
|
<div id="main" class="main">
|
||||||
|
|||||||
@@ -182,13 +182,27 @@ body {
|
|||||||
display: none;
|
display: none;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
width: 100%;
|
width: 80vw;
|
||||||
height: 100%;
|
height: 80vh;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
background: $foreground;
|
background: $foreground;
|
||||||
|
color: #212121;
|
||||||
|
padding: 15px;
|
||||||
|
|
||||||
.modal-content {
|
.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 {
|
.close {
|
||||||
|
|||||||
Reference in New Issue
Block a user