Ubuntu and other Linux variants do not have a Windows like CTRL + ALT + DEL screen, so I figured I'll make one myself. My plan is to make a HTML version, render that with the PyQt Web engine, and then when the keys CTRL + ALT + DEL are pressed the program launches.

Preview it: https://codepen.io/aangeletakis/pen/YzprZxX?editors=1100

How could I improve on it before I start on the application portion?

  --cancel-btn-border-width: 2px;
  outline: none;
  user-select: none;
body {
  background: #005A9E;
  padding: 0px;

.userInterface {color:var(--ui-text-color);}
.center {
  width: var(--interface-width);
  transform: translate(-55%, -65%);
  position: absolute;
  top: 50%;
  left: 50%;
  overflow: auto;
.optionsList {
.optionsList li{margin-left: 0; padding-left: 0;}
.optionsList li button{
  color: inherit;
  outline: none;
  padding-top: var(--optionPadding);
  padding-bottem: var(--optionPadding);
  cursor: pointer;
.optionsList li button:hover{opacity: 0.75;}
.cancelBtn {
  transform:   translate(calc(50%  - var(--interface-width) - 3%), 0%);
  border:      var(--cancel-btn-border-width) solid transparent;
  background:  #337BB1;
  --cancel-btn-lr-padding: 40px;
  padding-right: var(--cancel-btn-lr-padding);
  padding-left:  var(--cancel-btn-lr-padding);
  padding-top: 7px;
  padding-bottom: 7px;
  outline: 0;
.cancelBtn:hover {
  border: var(--cancel-btn-border-width) solid lightblue;
  <div class="userInterface center">
    <ul class="optionsList">
      <li><button>Switch user</button></li>
      <li><button>Sign out</button></li>
      <li><button>System manager</button></li>
    <button class="cancelBtn">Cancel</button>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.