diff --git a/customize.dist/main.css b/customize.dist/main.css index ff7f2b9e5..9d0b8fbfd 100644 --- a/customize.dist/main.css +++ b/customize.dist/main.css @@ -262,7 +262,48 @@ form.realtime > textarea { form.realtime table { border-collapse: collapse; } -form.realtime table input { +form.realtime table tr td { + padding: 0px; + margin: 0px; +} +form.realtime table tr td div.text-cell { + padding: 0px; + margin: 0px; + height: 100%; +} +form.realtime table tr td div.text-cell input { + width: 90%; + height: 100%; + border: 0px; +} +form.realtime table tr td.checkbox-cell { + margin: 0px; + padding: 0px; +} +form.realtime table tr td.checkbox-cell div.checkbox-contain { + display: block; + height: 100%; + width: 100%; +} +form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"] { + display: none; +} +form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"] ~ label { + font-weight: bold; + background-color: #FF0073; + color: #302B28; + display: block; +} +form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"] ~ label:after { + content: "✖"; +} +form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"] ~ label.yes { + background-color: #46E981; +} +form.realtime table tr td.checkbox-cell div.checkbox-contain input[type="checkbox"] ~ label.yes:after { + content: "✔"; +} +form.realtime table input[type="text"] { height: 100%; width: 90%; border: 3px solid #302B28; diff --git a/customize.dist/src/cryptpad.less b/customize.dist/src/cryptpad.less index a2cae48a1..b24c69081 100644 --- a/customize.dist/src/cryptpad.less +++ b/customize.dist/src/cryptpad.less @@ -318,18 +318,63 @@ form.realtime { border-collapse: collapse; tr { td { - //border: 1px solid white; + padding: 0px; + margin: 0px; + + div.text-cell { + padding: 0px; + margin: 0px; + height: 100%; + input { + width: 90%; + height: 100%; + border: 0px; + } + .remove { + } + } + + &.checkbox-cell { + margin: 0px; + padding: 0px; + + div.checkbox-contain { + display: block; + height: 100%; + width: 100%; + + input { + &[type="checkbox"] { + display: none; + ~ label { + display: block; + font-weight: bold; + + background-color: @cp-red; + color: @base; + &:after { content: "✖"; } + + display: block; + &.yes { + background-color: @cp-green; + &:after { content: "✔"; } + } + } + } + } + } + } } } input { - height: 100%; - width: 90%; - border: 3px solid @base; - //display: table-cell; + &[type="text"] { + height: 100%; + width: 90%; + border: 3px solid @base; + } } - thead { tr { th {