mirror of https://github.com/xwiki-labs/cryptpad
Apply style rules for admin/customize section
This commit is contained in:
parent
6ffa61126b
commit
f233d6d248
|
@ -72,7 +72,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
textarea, div.cp-textarea {
|
textarea, div.cp-textarea {
|
||||||
padding: 8px;
|
padding: 8px @alertify_padding-base;
|
||||||
&[readonly] {
|
&[readonly] {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
resize: none;
|
resize: none;
|
||||||
|
|
|
@ -8,7 +8,8 @@
|
||||||
@import (reference) "/customize/src/less2/include/leftside-menu.less";
|
@import (reference) "/customize/src/less2/include/leftside-menu.less";
|
||||||
@import (reference) "/customize/src/less2/include/browser.less";
|
@import (reference) "/customize/src/less2/include/browser.less";
|
||||||
|
|
||||||
@sidebar_button-width: 25rem;;
|
@sidebar_block-width: 25rem;;
|
||||||
|
@sidebar_base-margin: 0.5rem;
|
||||||
|
|
||||||
.sidebar-layout_main() {
|
.sidebar-layout_main() {
|
||||||
--LessLoader_require: LessLoader_currentFile();
|
--LessLoader_require: LessLoader_currentFile();
|
||||||
|
@ -113,22 +114,53 @@
|
||||||
flex-flow: column;
|
flex-flow: column;
|
||||||
align-items: baseline;
|
align-items: baseline;
|
||||||
}
|
}
|
||||||
input {
|
label {
|
||||||
max-width: 25rem;
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
input, textarea {
|
||||||
|
font-family: inherit;
|
||||||
|
}
|
||||||
|
input, textarea {
|
||||||
|
max-width: @sidebar_block-width;
|
||||||
|
}
|
||||||
|
[type="color"] {
|
||||||
|
width: @sidebar_block-width/5;
|
||||||
|
}
|
||||||
|
.cp-labelled-input {
|
||||||
|
margin-top: @sidebar_base-margin;
|
||||||
|
max-width: ~"min(100%, 25rem)";
|
||||||
|
width: @sidebar_block-width;
|
||||||
|
label {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
nav {
|
nav {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: baseline;
|
align-items: baseline;
|
||||||
.btn.btn-primary {
|
margin-top: @sidebar_base-margin;
|
||||||
margin: 5px 0.5rem 0 0;
|
.btn {
|
||||||
|
margin-top: 0;
|
||||||
|
margin-bottom: 0;
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.cp-sidebar-flex-block {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
nav {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
nav, .cp-sidebar-flex-block {
|
||||||
|
& > * {
|
||||||
|
margin-right: @sidebar_base-margin;
|
||||||
|
&:last-child {
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.cp-sidebar-bigger-alert {
|
.cp-sidebar-bigger-alert {
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
}
|
|
||||||
label {
|
|
||||||
margin-bottom: 0;
|
|
||||||
margin-top: 0.5rem;
|
|
||||||
}
|
}
|
||||||
th {
|
th {
|
||||||
max-width: 60vw;
|
max-width: 60vw;
|
||||||
|
@ -140,7 +172,7 @@
|
||||||
margin-right: 2px;
|
margin-right: 2px;
|
||||||
}
|
}
|
||||||
.cp-checkmark {
|
.cp-checkmark {
|
||||||
padding: 0.5rem;
|
padding: @sidebar_base-margin;
|
||||||
}
|
}
|
||||||
.cp-broadcast-container {
|
.cp-broadcast-container {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
@ -161,7 +193,7 @@
|
||||||
}
|
}
|
||||||
.cp-sidebar-input-block {
|
.cp-sidebar-input-block {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
width: @sidebar_button-width;
|
width: @sidebar_block-width;
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
input {
|
input {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
|
@ -192,7 +224,7 @@
|
||||||
.cp-sidebarlayout-description {
|
.cp-sidebarlayout-description {
|
||||||
display: block;
|
display: block;
|
||||||
color: @cp_sidebar-hint;
|
color: @cp_sidebar-hint;
|
||||||
margin-bottom: 0.5rem;
|
margin-bottom: @sidebar_base-margin;
|
||||||
p {
|
p {
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
|
@ -221,7 +253,7 @@
|
||||||
}
|
}
|
||||||
.cp-sidebarlayout-input-block {
|
.cp-sidebarlayout-input-block {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
width: @sidebar_button-width;
|
width: @sidebar_block-width;
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
input {
|
input {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
|
@ -243,7 +275,7 @@
|
||||||
margin: 10px 0;
|
margin: 10px 0;
|
||||||
}
|
}
|
||||||
button.btn {
|
button.btn {
|
||||||
margin: 0 0.5rem 0 0;
|
margin: 0 @sidebar_base-margin 0 0;
|
||||||
&:last-child {
|
&:last-child {
|
||||||
margin-right: 0;
|
margin-right: 0;
|
||||||
}
|
}
|
||||||
|
@ -260,7 +292,7 @@
|
||||||
padding-bottom: 20px;
|
padding-bottom: 20px;
|
||||||
.cp-sidebarlayout-categories {
|
.cp-sidebarlayout-categories {
|
||||||
.cp-sidebarlayout-category {
|
.cp-sidebarlayout-category {
|
||||||
margin: 0 0 0.5rem 0;
|
margin: 0 0 @sidebar_base-margin 0;
|
||||||
span.cp-sidebar-layout-category-name {
|
span.cp-sidebar-layout-category-name {
|
||||||
display: inline !important; // override "narrow" mode
|
display: inline !important; // override "narrow" mode
|
||||||
}
|
}
|
||||||
|
|
|
@ -18,7 +18,7 @@
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
[type="text"] {
|
[type="text"] {
|
||||||
width: @sidebar_button-width;
|
width: @sidebar_block-width;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
hr {
|
hr {
|
||||||
|
@ -26,8 +26,8 @@
|
||||||
}
|
}
|
||||||
textarea {
|
textarea {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
width: 2*@sidebar_button-width;
|
width: 2*@sidebar_block-width !important;
|
||||||
max-width: 100%;
|
max-width: 100% !important;
|
||||||
padding: 10px 15px;
|
padding: 10px 15px;
|
||||||
height: 300px;
|
height: 300px;
|
||||||
}
|
}
|
||||||
|
|
|
@ -19,5 +19,18 @@
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-flow: column;
|
flex-flow: column;
|
||||||
font: @colortheme_app-font;
|
font: @colortheme_app-font;
|
||||||
|
|
||||||
|
.cp-admin-customize-logo {
|
||||||
|
padding: 1em;
|
||||||
|
img {
|
||||||
|
max-height: 250px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.cp-admin-color-current {
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
border-radius: 5px;
|
||||||
|
background-color: @cryptpad_color_brand;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -776,7 +776,7 @@ define([
|
||||||
'aria-labelledby': 'cp-admin-logo'
|
'aria-labelledby': 'cp-admin-logo'
|
||||||
});
|
});
|
||||||
|
|
||||||
var currentContainer = blocks.block();
|
var currentContainer = blocks.block([], 'cp-admin-customize-logo');
|
||||||
let redraw = () => {
|
let redraw = () => {
|
||||||
var current = h('img', {src: '/api/logo?'+(+new Date())});
|
var current = h('img', {src: '/api/logo?'+(+new Date())});
|
||||||
$(currentContainer).empty().append(current);
|
$(currentContainer).empty().append(current);
|
||||||
|
@ -856,14 +856,10 @@ define([
|
||||||
let current = blocks.block([], 'cp-admin-color-current');
|
let current = blocks.block([], 'cp-admin-color-current');
|
||||||
let labelCurrent = blocks.labelledInput(Messages.admin_colorCurrent, current);
|
let labelCurrent = blocks.labelledInput(Messages.admin_colorCurrent, current);
|
||||||
let preview = blocks.block([
|
let preview = blocks.block([
|
||||||
blocks.block([
|
blocks.link('CryptPad', '/admin/#customize'),
|
||||||
blocks.link('CryptPad', '/admin/#customize')
|
blocks.button('primary', 'fa-floppy-o', Messages.settings_save),
|
||||||
]),
|
blocks.button('secondary', 'fa-floppy-o', Messages.settings_save),
|
||||||
blocks.nav([
|
], 'cp-admin-color-preview cp-sidebar-flex-block');
|
||||||
blocks.button('primary', 'fa-floppy-o', Messages.settings_save),
|
|
||||||
blocks.button('secondary', 'fa-floppy-o', Messages.settings_save),
|
|
||||||
])
|
|
||||||
], 'cp-admin-color-preview');
|
|
||||||
let labelPreview = blocks.labelledInput(Messages.admin_colorPreview, preview);
|
let labelPreview = blocks.labelledInput(Messages.admin_colorPreview, preview);
|
||||||
let $preview = $(preview);
|
let $preview = $(preview);
|
||||||
|
|
||||||
|
|
|
@ -56,11 +56,7 @@
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
width: 2*@sidebar_button-width;
|
width: 2*@sidebar_block-width;
|
||||||
input {
|
|
||||||
//width: @sidebar_button-width !important;
|
|
||||||
//max-width: @sidebar_button-width;
|
|
||||||
}
|
|
||||||
textarea {
|
textarea {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
height: 5rem;
|
height: 5rem;
|
||||||
|
|
|
@ -59,7 +59,7 @@
|
||||||
display: inline;
|
display: inline;
|
||||||
}
|
}
|
||||||
button.btn {
|
button.btn {
|
||||||
width: @sidebar_button-width;
|
width: @sidebar_block-width;
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
margin: 0 !important;
|
margin: 0 !important;
|
||||||
}
|
}
|
||||||
|
@ -85,7 +85,7 @@
|
||||||
}
|
}
|
||||||
.cp-settings-info-block {
|
.cp-settings-info-block {
|
||||||
[type="text"] {
|
[type="text"] {
|
||||||
width: @sidebar_button-width;
|
width: @sidebar_block-width;
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -105,7 +105,7 @@
|
||||||
margin-top:0.5rem;
|
margin-top:0.5rem;
|
||||||
}
|
}
|
||||||
[type="password"], [type="text"] {
|
[type="password"], [type="text"] {
|
||||||
//width: @sidebar_button-width;
|
//width: @sidebar_block-width;
|
||||||
flex: unset;
|
flex: unset;
|
||||||
}
|
}
|
||||||
button {
|
button {
|
||||||
|
|
Loading…
Reference in New Issue