mirror_php/humhub
1
0
Fork 0
mirror of https://github.com/humhub/humhub.git synced 2025-01-16 21:58:17 +01:00
Code Issues Projects Releases Wiki Activity

Enh #3: Source Mode, Text Area Style (#6382)

Browse Source 
* Enh #3: Source Mode, Text Area Style
Fixed dropdown button icons size

* Changed color hash codes in less files to variables.
Changed comment form buttons position.
This commit is contained in:
yuriimaz 2023-06-12 14:56:00 +03:00 committed by GitHub
parent 1760facb13
commit 26c789b2d0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 87 additions and 114 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
static/less/form.less
View File

@ -145,7 +145,7 @@ a.input-field-addon-sm {
}
.timeZoneInputContainer ~ .help-block {
margin: 0px;
margin: 0;
}
// Flatelements
@ -305,7 +305,7 @@ div.form-group {
}
.form-collapsible-fields-label {
margin-bottom: 0px;
margin-bottom: 0;
padding: 12px;
label {
@ -343,16 +343,17 @@ div.form-group {
}
}
// fileupload button
// editor
.content_create,
.content_edit {
.content-create-input-group {
display: flex;
align-items: flex-end;
flex-direction: column;
> .form-group {
flex-grow: 1;
flex-basis: min-content;
width: 100%;
[data-ui-markdown] {
word-break: break-word !important;
@ -369,9 +370,10 @@ div.form-group {
}
}
// fileupload button
.upload-buttons {
white-space: nowrap;
padding-bottom: 6px;
padding-top: 6px;
.btn:not(.dropdown-toggle) {
margin-left: 6px;
@ -393,19 +395,4 @@ div.form-group {
.fileinput-button:active {
box-shadow: none !important;
}
@media (max-width: 414px) {
.content-create-input-group {
flex-direction: column;
> .form-group {
width: 100%;
}
}
.upload-buttons {
padding-bottom: 0 !important;
padding-top: 6px;
}
}
}

1
static/less/markdown.less
View File

@ -89,7 +89,6 @@
padding: 15px 20px;
font-size: 1em;
border-left: 5px solid @primary;
}
dt, dd {

96
static/less/mentioning.less
View File

@ -2,72 +2,50 @@
//Mentioning (uses old atwho style)
//
.atwho-view {
background: @background-color-main;
color: @text-color-soft;
border: 1px solid @background3;
border-radius: 4px;
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
display: none;
font-size: 14px;
font-weight: 400;
margin-top: 18px;
min-width: 120px;
max-width: 265px;
padding: 5px 0;
position: absolute;
top: 0;
left: 0;
display: none;
margin-top: 18px;
background: white;
color: #555555;
font-size: 14px;
font-weight: 400;
border: 1px solid #d7d7d7;
border-radius: 4px;
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
min-width: 120px;
max-width: 265px;
z-index: 11110 !important;
padding: 5px 0;
}
.atwho-view strong, .atwho-view b {
font-weight: normal;
}
.atwho-view ul li.hint {
background: #fff !important;
border-left: 3px solid transparent !important;
font-size: 12px;
color: #999;
}
.atwho-view .cur small {
color: red;
}
.atwho-view strong {
background-color: #f9f0d2;
}
.atwho-view .cur strong {
background-color: #f9f0d2;
}
.atwho-view ul {
/* width: 100px; */
list-style: none;
padding: 0;
margin: auto;
padding: 0;
//width: 100px;
}
.atwho-view ul li {
display: block;
padding: 5px 10px;
//border-top: 1px solid #C8C8C8;
//padding: 5px 10px;
border-left: 3px solid transparent;
padding: 4px 15px 4px 8px;
cursor: pointer;
/* border-top: 1px solid #C8C8C8; */
display: block;
padding: 4px 15px 4px 8px;
}
.atwho-view small {
font-size: smaller;
color: #777;
font-weight: normal;
.atwho-view ul li.hint {
background: @background-color-main !important;
border-left: 3px solid transparent !important;
color: @text-color-soft2;
font-size: 12px;
}
.atwho-input.form-control {
min-height: 36px;
height: auto;
min-height: 36px;
padding-right: 95px;
word-wrap: break-word;
}
@ -78,26 +56,24 @@
}
.atwho-placeholder {
color: #bebebe !important;
color: @text-color-soft3 !important;
}
.atwho-emoji-entry {
float: left;
padding: 4px !important;
margin: 0px !important;
margin: 0 !important;
border: none !important;
}
.atwho-emoji-entry:hover, .atwho-emoji-entry:active, .atwho-emoji-entry:focus {
padding: 4px !important;
margin: 0px !important;
margin: 0 !important;
border: none !important;
background-color: @background-color-secondary !important;
border-radius: 3px;
}
.atwho-view .cur {
border-left: 3px solid @info;
background-color: @background-color-secondary !important;
@ -114,11 +90,25 @@
}
.atwho-view strong {
background-color: #f9f0d2;
background-color: lighten(@warning, 40%);
}
.atwho-view .cur strong {
background-color: #f9f0d2;
background-color: lighten(@warning, 40%);
}
.atwho-view small {
font-size: smaller;
color: @text-color-secondary;
font-weight: normal;
}
.atwho-view .cur small {
color: var(--danger);
}
.atwho-view strong, .atwho-view b {
font-weight: normal;
}
.atwho-view span {

75
static/less/richtext.less
View File

@ -1,9 +1,9 @@
.ProsemirrorEditor.fullscreen {
height: calc(100vh - 3px);
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: calc(100vh - 3px);
z-index: 9998;
.ProseMirror-menubar-wrapper {
@ -15,9 +15,9 @@
}
.ProseMirror {
height: calc(100% - 26px);
position: static;
overflow: auto;
height: calc(100% - 26px);
}
.ProseMirror-menubar {
@ -63,7 +63,7 @@
}
.ProseMirror-menuseparator {
border-right: 1px solid #ddd;
border-right: 1px solid @background3;
margin-right: 3px;
}
@ -73,7 +73,7 @@
.ProseMirror-menuitem {
.ProseMirror-menu-group {
border-right: 1px solid #ddd;
border-right: 1px solid @background3;
}
.ProseMirror-menu-group.last {
@ -85,14 +85,13 @@
}
.seperator {
border-right: 1px solid #ddd;
border-right: 1px solid @background3;
margin-right: 2px;
padding-right: 2px;
}
}
.ProseMirror-menu-dropdown, .ProseMirror-menu-dropdown-menu {
font-size: 90%;
white-space: nowrap;
}
@ -103,7 +102,7 @@
}
.ProseMirror-menu-dropdown-wrap {
padding: 1px 0 1px 0;
padding: 1px 0;
display: inline-block;
position: relative;
}
@ -130,8 +129,8 @@
.ProseMirror-menu-dropdown-menu, .ProseMirror-menu-submenu {
position: absolute;
background: white;
color: #666;
border: 1px solid #aaa;
color: @text-color-soft;
border: 1px solid @text-color-soft2;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
}
@ -154,7 +153,7 @@
}
.ProseMirror-menu-dropdown-item:hover {
background: #f2f2f2;
background: @background-color-secondary;
}
.ProseMirror-menu-submenu-wrap {
@ -180,7 +179,7 @@
}
.ProseMirror-menu-active {
background: #eee;
background: @background-color-page;
border-radius: 4px;
border: 1px solid @background-color-page !important;
}
@ -215,13 +214,13 @@
vertical-align: text-top;
}
.ProseMirror-editor-source{
border: 2px solid #ededed;
.ProseMirror-editor-source {
border: 2px solid @background-color-page;
border-radius: 0 4px 4px 4px;
box-sizing: border-box;
display: block;
min-height: 36px;
resize: vertical;
resize: none;
overflow: auto;
outline: none;
padding: 7px 12px;
@ -229,7 +228,7 @@
}
.ProseMirror-editor-source:focus {
border: 2px solid #0b97c4;
border: 2px solid @info;
}
}
@ -266,12 +265,12 @@
.ProseMirror-menubar {
background-color: @background-color-secondary;
border: 1px solid @background3;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
border: 1px solid #ddd;
color: @text-color-soft;
position: relative;
min-height: 1em;
color: #666;
padding: 1px 6px 1px 0;
top: 0;
left: 0;
@ -286,7 +285,6 @@
* Editor style attached at the top of input only visible on focus
*/
.ProsemirrorEditor.focusMenu {
.form-control:focus {
border-top-left-radius: 0 !important;
}
@ -294,7 +292,7 @@
.ProseMirror-menubar {
display: table;
min-height: 1em;
color: #666;
color: @text-color-soft;
padding: 2px 6px;
top: 0;
left: 0;
@ -343,7 +341,7 @@
}
.ProseMirror-selectednode {
outline: 2px dashed #8cf;
outline: 2px dashed lighten(@info, 30%);
}
/* Make sure li selections wrap around markers */
@ -359,7 +357,7 @@
right: -2px;
top: -2px;
bottom: -2px;
border: 2px solid #8cf;
border: 2px solid lighten(@info, 30%);
pointer-events: none;
}
@ -460,7 +458,7 @@
}
.ProseMirror [data-mention] {
color: @link
color: @link;
}
.ProseMirror {
@ -477,7 +475,7 @@
}
.ProseMirror p {
margin-bottom: 1em
margin-bottom: 1em;
}
.ProseMirror-textblock-dropdown {
@ -499,14 +497,14 @@
}
.ProseMirror .column-resize-handle {
background-color: lighten(@info, 40%);
pointer-events: none;
position: absolute;
right: -2px;
top: 0;
bottom: 0;
width: 4px;
z-index: 20;
background-color: #adf;
pointer-events: none;
}
.ProseMirror.resize-cursor {
@ -517,15 +515,15 @@
/* Give selected cells a blue overlay */
.ProseMirror .selectedCell:after {
z-index: 2;
position: absolute;
background: rgba(200, 200, 255, 0.4);
content: "";
pointer-events: none;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
background: rgba(200, 200, 255, 0.4);
pointer-events: none;
z-index: 2;
}
.ProseMirror-menubar-wrapper {
@ -567,7 +565,7 @@
position: absolute;
left: 2px;
top: 1px;
color: #666;
color: @text-color-soft;
border: none;
background: transparent;
padding: 0;
@ -579,8 +577,8 @@
}
.ProseMirror-invalid {
background: #ffc;
border: 1px solid #cc7;
background: lighten(@warning, 40%);
border: 1px solid lighten(@warning, 10%);
border-radius: 4px;
padding: 5px 10px;
position: absolute;
@ -593,26 +591,26 @@
}
.atwho-view .cur {
border-left: 3px solid #59d6e4;
border-left: 3px solid lighten(@info, 30%);
background-color: @background-color-secondary !important;
}
.atwho-user,
.atwho-space,
.atwho-input a {
color: #59d6e4;
color: @link;
}
.atwho-input a:hover {
color: #59d6e4;
color: @link;
}
.atwho-view strong {
background-color: #f9f0d2;
background-color: lighten(@warning, 40%);
}
.atwho-view .cur strong {
background-color: #f9f0d2;
background-color: lighten(@warning, 40%);
}
[data-emoji-category] {
@ -628,7 +626,7 @@
}
.atwho-emoji-entry.cur {
background-color: #ededed !important;
background-color: @background-color-page !important;
}
}
@ -665,7 +663,6 @@
}
@media screen and (max-width: 768px) {
.ProsemirrorEditor.focusMenu {
.form-control:focus {
border-top-right-radius: 0 !important;

2
themes/HumHub/css/theme.css
View File

File diff suppressed because one or more lines are too long