mirror of
https://github.com/icecoder/ICEcoder.git
synced 2026-03-03 07:13:59 +01:00
Close icon added for 4 x tools
This commit is contained in:
@@ -9,9 +9,7 @@ body {overflow: hidden;
|
||||
h1 {font-size: 36px; font-weight: normal; color: #888; margin-bottom: 20px}
|
||||
h2 {font-size: 18px; font-weight: normal; color: #fff}
|
||||
|
||||
.icon {position: absolute; margin-left: 2px}
|
||||
.icon-tabler {width: 24px; height: 24px; stroke-width: 1.25; color: #888}
|
||||
|
||||
.icon-tabler {width: 24px; height: 24px; stroke-width: 1.25}
|
||||
.blackMask {position: fixed; display: table; width: 100%; height: 100%; top: 0; left: 0; visibility: hidden; background-color: rgba(0,0,0,0.8); text-align: center; z-index: 100}
|
||||
.blackMask .popupVCenter {#position: absolute; display: table-cell; #top: 50%; vertical-align: middle; text-align: center}
|
||||
.popupVCenter .popup {#position: relative; #top: -50%; text-align: center; color: #fff; font-size: 10px}
|
||||
@@ -151,6 +149,8 @@ h2 {font-size: 18px; font-weight: normal; color: #fff}
|
||||
.fileMenu hr {border: 0; height: 1px; padding: 0; margin: 0; background: #444}
|
||||
|
||||
.tooltip {position: absolute; top: 0; left: 0; padding: 5px; background: #444; color: #bbb}
|
||||
.closeIcon {position: fixed; display: inline-block; top: 10px; right: 10px; width: 24px; height: 24px; color: #888; cursor: pointer; z-index: 101}
|
||||
.closeIcon:hover {color: #ddd}
|
||||
|
||||
.screenContainer {position: absolute; display: table; width: 100%; height: 100%; top: 0; left: 0; text-align: center}
|
||||
.screenContainer .screenVCenter {#position: absolute; display: table-cell; #top: 50%; vertical-align: middle; text-align: center}
|
||||
@@ -163,3 +163,4 @@ h2 {font-size: 18px; font-weight: normal; color: #fff}
|
||||
.screenCenter .password:focus {outline: none; background: rgba(0,198,255,0.5); color: #fff}
|
||||
.screenCenter .button {border: 0; background: #444; color: #eee; height: 22px; cursor: pointer}
|
||||
.screenCenter .button:hover {background: #2187e7; color: #eee}
|
||||
.screenCenter .iconCapsLock {position: absolute; margin-left: 2px; color: #888}
|
||||
|
||||
5
assets/images/icons/x.svg
Normal file
5
assets/images/icons/x.svg
Normal file
@@ -0,0 +1,5 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-x" width="44" height="44" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path stroke="none" d="M0 0h24v24H0z"/>
|
||||
<line x1="18" y1="6" x2="6" y2="18" />
|
||||
<line x1="6" y1="6" x2="18" y2="18" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 360 B |
@@ -332,6 +332,14 @@ var ICEcoder = {
|
||||
|
||||
// Note which tool we're showing
|
||||
this.showingTool = this.showingTool !== tool ? tool : false;
|
||||
|
||||
// Display and make close icon clickable to close this tool
|
||||
setTimeout(function() {
|
||||
get('closeIcon').style.display = ICEcoder.showingTool !== false ? "inline-block" : "none";
|
||||
get('closeIcon').onclick = function() {
|
||||
ICEcoder.toolShowHideToggle(ICEcoder.showingTool);
|
||||
}
|
||||
}, this.showingTool !== false ? 200 : 0);
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
@@ -385,6 +385,8 @@ if (true === $havePrettier && true === file_exists(dirname(__FILE__) . "/plugins
|
||||
|
||||
<div id="tooltip" class="tooltip" style="display: none"></div>
|
||||
|
||||
<div class="closeIcon" style="display: none" id="closeIcon"><?php echo file_get_contents(dirname(__FILE__) . "/assets/images/icons/x.svg");?></div>
|
||||
|
||||
<script>
|
||||
ICEcoder.initAliases();
|
||||
ICEcoder.setLayout(false);
|
||||
|
||||
@@ -39,7 +39,7 @@ echo $settingPW ? "Setup" : "Login";
|
||||
} else {
|
||||
?> onkeyup="checkCase(event)"<?php
|
||||
}
|
||||
?>><div class="icon" style="display: none" id="capsLockDisplay" title="Caps lock on"><?php echo file_get_contents("../assets/images/icons/alert-triangle.svg");?></div><br>
|
||||
?>><div class="iconCapsLock" style="display: none" id="iconCapsLock" title="Caps lock on"><?php echo file_get_contents(dirname(__FILE__) . "/../assets/images/icons/alert-triangle.svg");?></div><br>
|
||||
<?php
|
||||
if ($settingPW) {
|
||||
echo '<div id="pwReqs">'.
|
||||
@@ -117,7 +117,7 @@ const checkCase = function(evt) {
|
||||
|
||||
// Not caps lock key
|
||||
if (20 !== key) {
|
||||
get("capsLockDisplay").style.display = true === evt.getModifierState("CapsLock")
|
||||
get("iconCapsLock").style.display = true === evt.getModifierState("CapsLock")
|
||||
? "inline-block"
|
||||
: "none";
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user