mirror of
https://github.com/wekan/wekan.git
synced 2026-02-21 15:34:07 +01:00
Text and icon from fixed sized to scaleable sizes. Thanks to xet7.
This commit is contained in:
Lauri Ojansivu
parent
2f5670e830
commit
9737884c4b
18 changed files with 315 additions and 315 deletions
|
|
@ -1,27 +1,27 @@
|
|||
.my-cards-board-wrapper {
|
||||
border-radius: 0 0 4px 4px;
|
||||
min-width: 400px;
|
||||
margin-bottom: 2rem;
|
||||
border-radius: 0 0 0.5vw 0.5vw;
|
||||
min-width: min(400px, 52vw);
|
||||
margin-bottom: 2.5vh;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
border-width: 2px;
|
||||
border-width: 0.3vw;
|
||||
border-style: solid;
|
||||
border-color: #a2a2a2;
|
||||
}
|
||||
.my-cards-board-title {
|
||||
font-size: 1.4rem;
|
||||
font-size: clamp(1.2rem, 3vw, 1.6rem);
|
||||
font-weight: bold;
|
||||
padding: 0.5rem;
|
||||
padding: 0.7vh 0.7vw;
|
||||
background-color: #808080;
|
||||
color: #fff;
|
||||
}
|
||||
.my-cards-swimlane-title {
|
||||
font-size: 1.1rem;
|
||||
font-size: clamp(1rem, 2.5vw, 1.3rem);
|
||||
font-weight: bold;
|
||||
padding: 0.5rem;
|
||||
padding-bottom: 0.4rem;
|
||||
padding: 0.7vh 0.7vw;
|
||||
padding-bottom: 0.5vh;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0.5rem;
|
||||
margin-bottom: 0.7vh;
|
||||
text-align: center;
|
||||
}
|
||||
.swimlane-default-color {
|
||||
|
|
@ -29,23 +29,23 @@
|
|||
}
|
||||
.my-cards-list-title {
|
||||
font-weight: bold;
|
||||
font-size: 1.1rem;
|
||||
font-size: clamp(1rem, 2.5vw, 1.3rem);
|
||||
text-align: center;
|
||||
margin-bottom: 0.7rem;
|
||||
margin-bottom: 0.9vh;
|
||||
}
|
||||
.my-cards-list-wrapper {
|
||||
margin: 1rem;
|
||||
border-radius: 5px;
|
||||
margin: 1.3vh 1.3vw;
|
||||
border-radius: 0.7vw;
|
||||
display: inline-grid;
|
||||
min-width: 250px;
|
||||
max-width: 350px;
|
||||
min-width: min(250px, 32vw);
|
||||
max-width: min(350px, 45vw);
|
||||
}
|
||||
.my-cards-card-wrapper {
|
||||
margin-top: 0;
|
||||
margin-bottom: 10px;
|
||||
margin-bottom: 1.3vh;
|
||||
}
|
||||
.my-cards-dueat-list-wrapper {
|
||||
max-width: 500px;
|
||||
max-width: min(500px, 65vw);
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,15 +1,15 @@
|
|||
.broken-cards-card-wrapper {
|
||||
margin-top: 0;
|
||||
margin-bottom: 10px;
|
||||
border-width: 3px !important;
|
||||
margin-bottom: 1.3vh;
|
||||
border-width: 0.4vw !important;
|
||||
border-color: #808080 !important;
|
||||
border-style: solid;
|
||||
border-radius: 5px;
|
||||
padding: 1.5rem;
|
||||
border-radius: 0.7vw;
|
||||
padding: 2vh 2vw;
|
||||
background-color: #fff;
|
||||
}
|
||||
.broken-cards-wrapper {
|
||||
max-width: 500px;
|
||||
max-width: min(500px, 65vw);
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
.due-cards-dueat-list-wrapper {
|
||||
max-width: 500px;
|
||||
max-width: min(500px, 65vw);
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -52,8 +52,8 @@ input,
|
|||
select,
|
||||
textarea,
|
||||
button {
|
||||
font: 14px Roboto, Poppins, "Helvetica Neue", Arial, Helvetica, sans-serif;
|
||||
line-height: 18px;
|
||||
font: clamp(12px, 2.5vw, 16px) Roboto, Poppins, "Helvetica Neue", Arial, Helvetica, sans-serif;
|
||||
line-height: 1.3;
|
||||
color: #4d4d4d;
|
||||
}
|
||||
html {
|
||||
|
|
@ -85,8 +85,8 @@ body {
|
|||
margin-top: 30vh;
|
||||
}
|
||||
#content > .wrapper {
|
||||
margin-top: 10px;
|
||||
padding: 15px;
|
||||
margin-top: 1vh;
|
||||
padding: 2vh 2vw;
|
||||
}
|
||||
#modal {
|
||||
position: absolute;
|
||||
|
|
@ -99,56 +99,56 @@ body {
|
|||
overflow-y: auto;
|
||||
}
|
||||
#modal .modal-content {
|
||||
width: 500px;
|
||||
min-height: 160px;
|
||||
margin: 42px auto;
|
||||
padding: 12px;
|
||||
border-radius: 4px;
|
||||
width: min(500px, 90vw);
|
||||
min-height: 20vh;
|
||||
margin: 5vh auto;
|
||||
padding: 2vh 2vw;
|
||||
border-radius: 0.5vw;
|
||||
background: #dedede;
|
||||
z-index: 110;
|
||||
}
|
||||
#modal .modal-content h2 {
|
||||
margin-bottom: 25px;
|
||||
margin-bottom: 3vh;
|
||||
}
|
||||
#modal .modal-content .modal-close-btn {
|
||||
display: block;
|
||||
float: right;
|
||||
font-size: 24px;
|
||||
font-size: clamp(18px, 4vw, 24px);
|
||||
}
|
||||
#modal .modal-content-wide {
|
||||
width: 800px;
|
||||
width: min(800px, 95vw);
|
||||
min-height: 0px;
|
||||
margin: 42px auto;
|
||||
padding: 12px;
|
||||
border-radius: 4px;
|
||||
margin: 5vh auto;
|
||||
padding: 2vh 2vw;
|
||||
border-radius: 0.5vw;
|
||||
background: #dedede;
|
||||
z-index: 110;
|
||||
}
|
||||
#modal .modal-content-wide h2 {
|
||||
margin-bottom: 25px;
|
||||
margin-bottom: 3vh;
|
||||
}
|
||||
#modal .modal-content-wide .modal-close-btn {
|
||||
display: block;
|
||||
float: right;
|
||||
font-size: 24px;
|
||||
font-size: clamp(18px, 4vw, 24px);
|
||||
}
|
||||
h1 {
|
||||
font-size: 22px;
|
||||
font-size: clamp(18px, 4vw, 24px);
|
||||
line-height: 1.2em;
|
||||
margin: 0 0 10px;
|
||||
margin: 0 0 1vh;
|
||||
}
|
||||
h2 {
|
||||
font-size: 18px;
|
||||
font-size: clamp(16px, 3.5vw, 20px);
|
||||
line-height: 1.2em;
|
||||
margin: 0 0 9px;
|
||||
margin: 0 0 0.8vh;
|
||||
}
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-size: 16px;
|
||||
font-size: clamp(14px, 3vw, 18px);
|
||||
line-height: 1.25em;
|
||||
margin: 0 0 6px;
|
||||
margin: 0 0 0.6vh;
|
||||
}
|
||||
.quiet,
|
||||
.quiet a {
|
||||
|
|
@ -160,14 +160,14 @@ h6 {
|
|||
}
|
||||
.no-items-message {
|
||||
color: #666;
|
||||
margin: 30px 0;
|
||||
margin: 4vh 0;
|
||||
text-align: center;
|
||||
}
|
||||
.warning {
|
||||
background: #f0ecdb;
|
||||
border-radius: 3px;
|
||||
border-radius: 0.4vw;
|
||||
color: #aa8f09;
|
||||
padding: 6px 8px;
|
||||
padding: 1vh 1.2vw;
|
||||
}
|
||||
.warning a {
|
||||
color: #aa8f09;
|
||||
|
|
@ -194,7 +194,7 @@ strong {
|
|||
p {
|
||||
-webkit-user-select: text;
|
||||
user-select: text;
|
||||
|
||||
|
||||
|
||||
}
|
||||
p a {
|
||||
|
|
@ -203,12 +203,12 @@ p a {
|
|||
}
|
||||
table,
|
||||
p {
|
||||
margin-bottom: 8px;
|
||||
margin-bottom: 1vh;
|
||||
}
|
||||
pre {
|
||||
margin: 15px 0;
|
||||
margin: 2vh 0;
|
||||
white-space: pre;
|
||||
max-height: 516px;
|
||||
max-height: 60vh;
|
||||
}
|
||||
pre,
|
||||
code,
|
||||
|
|
@ -217,10 +217,10 @@ tt {
|
|||
line-height: 1.3em;
|
||||
}
|
||||
blockquote {
|
||||
margin: 8px 0 8px 8px;
|
||||
margin: 1vh 0 1vh 1vw;
|
||||
border-left: 1px solid #ccc;
|
||||
color: #666;
|
||||
padding: 0 0 0 8px;
|
||||
padding: 0 0 0 1vw;
|
||||
}
|
||||
hr {
|
||||
height: 1px;
|
||||
|
|
@ -229,7 +229,7 @@ hr {
|
|||
width: 100%;
|
||||
background: #dbdbdb;
|
||||
color: #dbdbdb;
|
||||
margin: 15px 0;
|
||||
margin: 2vh 0;
|
||||
padding: 0;
|
||||
}
|
||||
table,
|
||||
|
|
@ -241,7 +241,7 @@ th {
|
|||
}
|
||||
td,
|
||||
th {
|
||||
padding: 5px;
|
||||
padding: 0.8vh 0.8vw;
|
||||
border-right: 1px solid #ccc;
|
||||
border-bottom: 1px solid #ccc;
|
||||
}
|
||||
|
|
@ -257,20 +257,20 @@ tbody {
|
|||
}
|
||||
dl,
|
||||
dt {
|
||||
margin-bottom: 8px;
|
||||
margin-bottom: 1vh;
|
||||
}
|
||||
dd {
|
||||
margin: 0 0 16px 24px;
|
||||
margin: 0 0 2vh 3vw;
|
||||
}
|
||||
kbd {
|
||||
padding: 1px 3px;
|
||||
margin: 3px;
|
||||
padding: 0.2vh 0.5vw;
|
||||
margin: 0.5vh;
|
||||
font-weight: bold;
|
||||
background: #fafafa;
|
||||
border-radius: 3px;
|
||||
border-radius: 0.4vw;
|
||||
border: 1px solid #e6e6e6;
|
||||
color: unset;
|
||||
box-shadow: 0px 2px 3px rgba(0,0,0,0.15);
|
||||
box-shadow: 0px 0.3vh 0.5vh rgba(0,0,0,0.15);
|
||||
}
|
||||
.clear {
|
||||
clear: both;
|
||||
|
|
@ -310,7 +310,7 @@ kbd {
|
|||
padding-bottom: 0;
|
||||
}
|
||||
.wrapper {
|
||||
width: calc(100% - 20px);
|
||||
width: calc(100% - 2vw);
|
||||
margin: 0 auto;
|
||||
}
|
||||
.relative {
|
||||
|
|
@ -401,23 +401,23 @@ a:not(.disabled).is-active i.fa {
|
|||
}
|
||||
.big-message {
|
||||
display: block;
|
||||
margin: 75px auto;
|
||||
margin: 10vh auto;
|
||||
text-align: center;
|
||||
max-width: 600px;
|
||||
max-width: min(600px, 90vw);
|
||||
}
|
||||
.big-message h1 {
|
||||
font-size: 26px;
|
||||
margin-bottom: 24px;
|
||||
font-size: clamp(20px, 5vw, 28px);
|
||||
margin-bottom: 3vh;
|
||||
}
|
||||
.big-message p {
|
||||
font-size: 18px;
|
||||
line-height: 22px;
|
||||
font-size: clamp(16px, 3.5vw, 20px);
|
||||
line-height: 1.3;
|
||||
}
|
||||
.gutter {
|
||||
margin-left: 38px;
|
||||
margin-left: 5vw;
|
||||
}
|
||||
.viewer {
|
||||
min-height: 18px;
|
||||
min-height: 2.5vh;
|
||||
display: block;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
|
@ -427,13 +427,13 @@ a:not(.disabled).is-active i.fa {
|
|||
}
|
||||
.viewer ol {
|
||||
list-style-type: decimal;
|
||||
padding-left: 20px;
|
||||
padding-bottom: 10px;
|
||||
padding-left: 3vw;
|
||||
padding-bottom: 1.5vh;
|
||||
}
|
||||
.viewer ul {
|
||||
list-style-type: initial;
|
||||
padding-left: 20px;
|
||||
padding-bottom: 10px;
|
||||
padding-left: 3vw;
|
||||
padding-bottom: 1.5vh;
|
||||
}
|
||||
.viewer em {
|
||||
font-style: italic;
|
||||
|
|
|
|||
|
|
@ -1,27 +1,27 @@
|
|||
.my-cards-board-wrapper {
|
||||
border-radius: 0 0 4px 4px;
|
||||
min-width: 400px;
|
||||
margin-bottom: 2rem;
|
||||
border-radius: 0 0 0.5vw 0.5vw;
|
||||
min-width: min(400px, 52vw);
|
||||
margin-bottom: 2.5vh;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
border-width: 2px;
|
||||
border-width: 0.3vw;
|
||||
border-style: solid;
|
||||
border-color: #a2a2a2;
|
||||
}
|
||||
.my-cards-board-title {
|
||||
font-size: 1.4rem;
|
||||
font-size: clamp(1.2rem, 3vw, 1.6rem);
|
||||
font-weight: bold;
|
||||
padding: 0.5rem;
|
||||
padding: 0.7vh 0.7vw;
|
||||
background-color: #808080;
|
||||
color: #fff;
|
||||
}
|
||||
.my-cards-swimlane-title {
|
||||
font-size: 1.1rem;
|
||||
font-size: clamp(1rem, 2.5vw, 1.3rem);
|
||||
font-weight: bold;
|
||||
padding: 0.5rem;
|
||||
padding-bottom: 0.4rem;
|
||||
padding: 0.7vh 0.7vw;
|
||||
padding-bottom: 0.5vh;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0.5rem;
|
||||
margin-bottom: 0.7vh;
|
||||
text-align: center;
|
||||
}
|
||||
.swimlane-default-color {
|
||||
|
|
@ -29,23 +29,23 @@
|
|||
}
|
||||
.my-cards-list-title {
|
||||
font-weight: bold;
|
||||
font-size: 1.1rem;
|
||||
font-size: clamp(1rem, 2.5vw, 1.3rem);
|
||||
text-align: center;
|
||||
margin-bottom: 0.7rem;
|
||||
margin-bottom: 0.9vh;
|
||||
}
|
||||
.my-cards-list-wrapper {
|
||||
margin: 1rem;
|
||||
border-radius: 5px;
|
||||
margin: 1.3vh 1.3vw;
|
||||
border-radius: 0.7vw;
|
||||
display: inline-grid;
|
||||
min-width: 250px;
|
||||
max-width: 350px;
|
||||
min-width: min(250px, 32vw);
|
||||
max-width: min(350px, 45vw);
|
||||
}
|
||||
.my-cards-card-wrapper {
|
||||
margin-top: 0;
|
||||
margin-bottom: 10px;
|
||||
margin-bottom: 1.3vh;
|
||||
}
|
||||
.my-cards-dueat-list-wrapper {
|
||||
max-width: 500px;
|
||||
max-width: min(500px, 65vw);
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,16 +1,16 @@
|
|||
.pop-over {
|
||||
background: #fff;
|
||||
border-radius: 3px;
|
||||
border-radius: 0.4vw;
|
||||
border: 1px solid #dbdbdb;
|
||||
border-bottom-color: #c2c2c2;
|
||||
box-shadow: 0 1px 6px rgba(0,0,0,0.3);
|
||||
box-shadow: 0 0.2vh 0.8vh rgba(0,0,0,0.3);
|
||||
position: absolute;
|
||||
width: 300px;
|
||||
width: min(300px, 40vw);
|
||||
z-index: 99999;
|
||||
margin-top: 5px;
|
||||
margin-top: 0.7vh;
|
||||
}
|
||||
.pop-over hr {
|
||||
margin: 4px 0px;
|
||||
margin: 0.5vh 0px;
|
||||
}
|
||||
.pop-over p,
|
||||
.pop-over textarea,
|
||||
|
|
@ -22,27 +22,27 @@
|
|||
}
|
||||
.pop-over select {
|
||||
width: 100%;
|
||||
margin-bottom: 14px;
|
||||
margin-bottom: 1.8vh;
|
||||
}
|
||||
.pop-over textarea {
|
||||
height: 72px;
|
||||
height: 9vh;
|
||||
}
|
||||
.pop-over form a span {
|
||||
padding: 0 0.5rem;
|
||||
padding: 0 0.7vw;
|
||||
}
|
||||
.pop-over .header {
|
||||
height: 36px;
|
||||
height: 4.5vh;
|
||||
position: relative;
|
||||
margin-bottom: 8px;
|
||||
margin-bottom: 1vh;
|
||||
background: #f7f7f7;
|
||||
border-bottom: 1px solid #dcdcdc;
|
||||
color: #666;
|
||||
}
|
||||
.pop-over .header .header-title {
|
||||
display: block;
|
||||
line-height: 32px;
|
||||
padding-top: 4px;
|
||||
margin: 0 10px;
|
||||
line-height: 4vh;
|
||||
padding-top: 0.5vh;
|
||||
margin: 0 1.3vw;
|
||||
font-weight: bold;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
|
|
@ -51,18 +51,18 @@
|
|||
.pop-over .header .back-btn {
|
||||
float: left;
|
||||
overflow: hidden;
|
||||
width: 30px;
|
||||
width: 4vw;
|
||||
transition: width 0.2s;
|
||||
}
|
||||
.pop-over .header .back-btn i.fa {
|
||||
margin: 10px;
|
||||
margin-top: 12px;
|
||||
margin: 1.3vw;
|
||||
margin-top: 1.5vh;
|
||||
}
|
||||
.pop-over .header .back-btn.is-hidden {
|
||||
width: 0;
|
||||
}
|
||||
.pop-over .header .close-btn {
|
||||
padding: 10px 10px 10px 4px;
|
||||
padding: 1.3vh 1.3vw 1.3vh 0.5vw;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
|
|
@ -76,23 +76,23 @@
|
|||
}
|
||||
.pop-over .content-container {
|
||||
width: 5000px;
|
||||
max-height: 550px;
|
||||
max-height: 70vh;
|
||||
transition: transform 0.2s;
|
||||
}
|
||||
.pop-over .content-container .content {
|
||||
width: 280px;
|
||||
padding: 0 10px 10px;
|
||||
width: min(280px, 37vw);
|
||||
padding: 0 1.3vw 1.3vh;
|
||||
float: left;
|
||||
}
|
||||
.pop-over .content-container .content.no-height {
|
||||
height: 20px;
|
||||
height: 2.5vh;
|
||||
}
|
||||
.pop-over .quiet {
|
||||
/* padding: 6px 6px 4px;*/
|
||||
}
|
||||
.pop-over.search-over {
|
||||
background: #f0f0f0;
|
||||
min-height: 114px;
|
||||
min-height: 14vh;
|
||||
}
|
||||
.pop-over.search-over .header {
|
||||
display: none;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue