rationalized styling

This commit is contained in:
dcore94 2023-03-28 11:40:00 +02:00
parent 2e96a34f45
commit c2e5d82a4a
5 changed files with 45 additions and 108 deletions

View File

@ -6,6 +6,18 @@
display: none !important;
}
.noselect{
user-select: none;
}
.plexiglass{
position: absolute;
width:100%;
height:100%;
z-index:1000;
background-color: rgba(0,0,0,.1)
}
.ccp-help-icon {
background-color: #ccffff;
border: solid 1px #0099cc;
@ -33,3 +45,36 @@ div.ccp-execution-form form:invalid button{
opacity: 0.3;
pointer-events: none;
}
.ccp-toolbar-header {
display: inline-flex;
align-items: center;
gap: 5px;
padding: 0.2rem;
min-width: 20rem;
}
.ccp-toolbar-right {
position: absolute;
right: 1rem;
}
.ccp-toolbar-button {
font-weight: bold;
padding: 0.3rem;
line-height: .8rem;
cursor: pointer;
}
.ccp-toolbar-button svg {
display: block;
fill: white;
width: 24px;
height: 24px;
pointer-events: none;
}
.ccp-toolbar-button-small {
padding: 0.1rem !important;
line-height: .6rem !important;
}
.ccp-toolbar-button-small svg {
width: 16px !important;
height: 16px !important;
}

View File

@ -48,13 +48,6 @@ class CCPExecutionForm extends HTMLElement{
.ccp-execution-form{
position: relative;
}
.plexiglass{
position: absolute;
width:100%;
height:100%;
z-index:1000;
background-color: rgba(0,0,0,.1)
}
</style>
<template id="EXECUTION_FORM_TEMPLATE">
<div class="ccp-execution-form" name="execution_form">

View File

@ -32,9 +32,6 @@ class CCPExecutionHistory extends HTMLElement {
render(){
this.#rootdoc.innerHTML = `
<style>
.noselect{
user-select: none;
}
.lxd{
background-color: #dd4814;
color: white;
@ -43,38 +40,6 @@ class CCPExecutionHistory extends HTMLElement {
color: white;
background-color: #2496ed;
}
.ccp-toolbar-header {
display: inline-flex;
align-items: center;
gap: 5px;
padding: 0.2rem;
min-width: 20rem;
}
.ccp-toolbar-right {
position: absolute;
right: 1rem;
}
.ccp-toolbar-button {
font-weight: bold;
padding: 0.3rem !important;
line-height: .8rem !important;
cursor: pointer;
}
.ccp-toolbar-button-small {
padding: 0.1rem !important;
line-height: .6rem !important;
}
.ccp-toolbar-button svg {
display: block;
fill: white;
width: 24px;
height: 24px;
pointer-events: none;
}
.ccp-toolbar-button-small svg {
width: 16px !important;
height: 16px !important;
}
.ccp-execution-list {
min-height: 3rem;
}

View File

@ -55,46 +55,12 @@ class CCPMethodEditorController extends HTMLElement{
position: relative;
}
.ccp-toolbar-header {
display: inline-flex;
align-items: center;
gap: 5px;
padding: .2rem;
}
.ccp-toolbar-right {
position:absolute;
right: 1rem;
}
.ccp-toolbar-button {
font-weight: bold;
padding:.3rem;
line-height:.8rem;
cursor: pointer;
}
.ccp-toolbar-button svg {
fill: white;
width:24px;
height:24px;
pointer-events: none;
}
.ccp-option {
background-color:#eeffff;
color:#0099CC;
border:solid 1px #0099CC;
}
.plexiglass{
position: absolute;
width: 100%;
height: 100%;
background-color: rgba(0,0,0,.3);
z-index: 10;
}
ul.author_list, ul.context_list{
list-style: none;
display: flex;

View File

@ -22,38 +22,6 @@ class CCPMethodList2 extends HTMLElement{
this.#rootdoc.innerHTML = `
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<style>
.ccp-toolbar-header {
display: inline-flex;
align-items: center;
gap: 5px;
padding: 0.2rem;
min-width: 20rem;
}
.ccp-toolbar-right {
position: absolute;
right: 1rem;
}
.ccp-toolbar-button {
font-weight: bold;
padding: 0.3rem;
line-height: .8rem;
cursor: pointer;
}
.ccp-toolbar-button svg {
display: block;
fill: white;
width: 24px;
height: 24px;
pointer-events: none;
}
.ccp-toolbar-button-small {
padding: 0.1rem !important;
line-height: .6rem !important;
}
.ccp-toolbar-button-small svg {
width: 16px !important;
height: 16px !important;
}
.ccp-process-category-list{
list-style:none;
padding-left: 0;