Reduce instance title size on small screens

This commit is contained in:
yflory 2023-09-21 17:26:48 +02:00
parent 3a9505465f
commit c3479b327b
3 changed files with 8 additions and 21 deletions

View File

@ -134,19 +134,7 @@ define([
// instance title
var instanceTitleText = Pages.Instance.name;
var instanceTitle;
var words = instanceTitleText.split(/(\.|:|\/|-| )/); // Split on ., :, /, -, or space
var elements = words.map(function (word) {
if (word === '.' || word === ':' || word === '/' || word === '-') {
return h('span.separator', word); // Apply a class to separators for styling
} else if (word.trim() !== '') {
return h('span', word);
}
return ' '; // Preserve spaces as-is
});
instanceTitle = h('h1.cp-instance-title', elements);
var instanceTitle = h('h1.cp-instance-title', Pages.Instance.name);
// instance location
var locationBlock;

View File

@ -144,7 +144,7 @@
display: flex;
> * {
overflow:auto;
overflow: auto;
width: 100%;
min-width: 260px;
max-width: 500px;

View File

@ -1,4 +1,5 @@
@import (reference) "../include/infopages.less";
@import (reference) "../include/browser.less";
@import (reference) "../include/colortheme-all.less";
&.cp-page-index {
@ -31,20 +32,18 @@
color: @cryptpad_text_col;
}
h1.cp-instance-title {
text-align: center;
font-family: "IBM Plex Mono";
font-weight: 500;
color: @cryptpad_color_brand;
font-size: 2.8rem;
font-size: 2.8rem; // Not used
word-wrap: break-word;
word-break: break-word;
white-space: pre-line;
span{
display: inline-block;
white-space: nowrap;
}
@media screen and (max-width: @browser_media-medium-screen) {
&.html h1.cp-instance-title {
font-size: 2.5em;
}
}