micord/ervu-lkrp-ul
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge remote-tracking branch 'origin/feature/new-design-test'

Browse source
This commit is contained in:
Булат Хайруллин 2024-06-21 17:20:51 +03:00
commit 107ecbde76
6 changed files with 140 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

2
frontend/index.html
View file

@ -19,6 +19,6 @@
</script>
</head>
<body webbpm class="webbpm ervu_lkrp_ul">
<div class="progress"></div>
<div class="loader"></div>
</body>
</html>

2
frontend/index.webpack.html
View file

@ -7,6 +7,6 @@
<link rel="icon" type="image/png" href="src/resources/img/logo.png"/>
</head>
<body webbpm class="webbpm ervu_lkrp_ul">
<div class="progress"></div>
<div class="loader"></div>
</body>
</html>

2
frontend/preview.html
View file

@ -19,6 +19,6 @@
</script>
</head>
<body preview-container id="webbpm-angular-application-container ervu_lkrp_ul" class="webbpm">
<div class="progress"></div>
<div class="loader"></div>
</body>
</html>

98
frontend/src/resources/css/components-lkrp.css
View file

@ -21,6 +21,38 @@
}
}
.webbpm.ervu_lkrp_ul .mute {
color: var(--border-light);
font-size: var(--size-text-secondary);
}
.webbpm.ervu_lkrp_ul .file-name {
font-size: var(--size-text-secondary);
}
.webbpm.ervu_lkrp_ul .progress-bar {
display: flex;
justify-content: flex-start;
width: 100%;
height: 15px;
margin-bottom: var(--indent-small);
border-radius: 10px;
background: #fff3e5;
& > div {
width: 100%;
height: 15px;
border-radius: 10px;
background: var(--color-link);
-webkit-animation: progress-line 10s infinite;
animation: progress-line 10s infinite;
}
}
@keyframes progress-line {
from {width: 0px;}
to {width: 100%;}
}
.webbpm.ervu_lkrp_ul .title {
font-size: var(--size-text-title);
font-family: 'InterSB';
@ -81,7 +113,8 @@
}
}
.webbpm.ervu_lkrp_ul .btn {
.webbpm.ervu_lkrp_ul .btn,
.webbpm.ervu_lkrp_ul .modal.show button-component.btn-main:not(.info):not(.link) .btn {
font-size: var(--size-text-secondary);
font-family: 'Inter';
color: var(--white);
@ -183,8 +216,9 @@
&:not(:disabled):not(.disabled):hover,
&:not(:disabled):not(.disabled):active,
&:not(:disabled):not(.disabled):focus {
color: var(--color-link-hover);
color: var(--color-link-hover) !important;
border-color: var(--color-link-hover);
background-color: transparent !important;
}
}
}
@ -467,6 +501,66 @@
button-component:not(.info):not(.link) {
margin: var(--indent-small) 0 0;
}
.subtitle {
font-size: var(--size-text-primary);
}
.warning-group {
font-size: var(--size-text-secondary);
padding-left: calc(24px + 16px*2);
margin-bottom: var(--indent-small);
&::before {
position: absolute;
content: "";
left: 16px;
width: 24px;
height: 24px;
background: url(../img/svg/info.svg) no-repeat;
}
hyper-link {
padding-top: 0;
margin-top: 8px;
border: 0;
.link {
color: var(--color-link);
padding-left: 0;
background: none;
}
}
}
.warning-message {
display: block;
font-size: var(--size-text-secondary);
padding-left: calc(24px + 16px);
&::before {
position: absolute;
content: "";
left: 0;
width: 24px;
height: 24px;
background: url(../img/svg/info.svg) no-repeat;
}
& + .warning-message {
margin-top: 16px;
}
.form-group {
margin-bottom: 0;
}
}
/*
file-upload {
label {
display: none;
}
.file-upload {
display: flex !important;
flex-direction: column;
}
}
*/
.paragraph-list > .vertical-container > * {
position: relative;
padding-left: var(--indent-small);

40
frontend/src/resources/css/inbox-lkrp.css
View file

@ -193,3 +193,43 @@ body {
display: none;
}
}
.webbpm.ervu_lkrp_ul .loader {
font-size: 16px;
left: 50%;
top: 50%;
width: 0.8em;
height: 0.8em;
border-radius: 50%;
position: relative;
text-indent: -9999em;
animation: loader-pin 1.1s infinite ease;
transform: translateZ(0);
}
@keyframes loader-pin {
0%,
100% {
box-shadow: 0em -2.6em 0em 0em #ffffff, 1.8em -1.8em 0 0em rgba(198, 78, 27, 0.3), 2.5em 0em 0 0em rgba(198, 78, 27, 0.3), 1.75em 1.75em 0 0em rgba(198, 78, 27, 0.3), 0em 2.5em 0 0em rgba(198, 78, 27, 0.3), -1.8em 1.8em 0 0em rgba(198, 78, 27, 0.3), -2.6em 0em 0 0em rgba(198, 78, 27, 0.7), -1.8em -1.8em 0 0em rgba(198, 78, 27, 1);
}
12.5% {
box-shadow: 0em -2.6em 0em 0em rgba(198, 78, 27, 1), 1.8em -1.8em 0 0em #ffffff, 2.5em 0em 0 0em rgba(198, 78, 27, 0.3), 1.75em 1.75em 0 0em rgba(198, 78, 27, 0.3), 0em 2.5em 0 0em rgba(198, 78, 27, 0.3), -1.8em 1.8em 0 0em rgba(198, 78, 27, 0.3), -2.6em 0em 0 0em rgba(198, 78, 27, 0.3), -1.8em -1.8em 0 0em rgba(198, 78, 27, 0.7);
}
25% {
box-shadow: 0em -2.6em 0em 0em rgba(198, 78, 27, 0.7), 1.8em -1.8em 0 0em rgba(198, 78, 27, 1), 2.5em 0em 0 0em #ffffff, 1.75em 1.75em 0 0em rgba(198, 78, 27, 0.3), 0em 2.5em 0 0em rgba(198, 78, 27, 0.3), -1.8em 1.8em 0 0em rgba(198, 78, 27, 0.3), -2.6em 0em 0 0em rgba(198, 78, 27, 0.3), -1.8em -1.8em 0 0em rgba(198, 78, 27, 0.3);
}
37.5% {
box-shadow: 0em -2.6em 0em 0em rgba(198, 78, 27, 0.3), 1.8em -1.8em 0 0em rgba(198, 78, 27, 0.7), 2.5em 0em 0 0em rgba(198, 78, 27, 1), 1.75em 1.75em 0 0em #ffffff, 0em 2.5em 0 0em rgba(198, 78, 27, 0.3), -1.8em 1.8em 0 0em rgba(198, 78, 27, 0.3), -2.6em 0em 0 0em rgba(198, 78, 27, 0.3), -1.8em -1.8em 0 0em rgba(198, 78, 27, 0.3);
}
50% {
box-shadow: 0em -2.6em 0em 0em rgba(198, 78, 27, 0.3), 1.8em -1.8em 0 0em rgba(198, 78, 27, 0.3), 2.5em 0em 0 0em rgba(198, 78, 27, 0.7), 1.75em 1.75em 0 0em rgba(198, 78, 27, 1), 0em 2.5em 0 0em #ffffff, -1.8em 1.8em 0 0em rgba(198, 78, 27, 0.3), -2.6em 0em 0 0em rgba(198, 78, 27, 0.3), -1.8em -1.8em 0 0em rgba(198, 78, 27, 0.3);
}
62.5% {
box-shadow: 0em -2.6em 0em 0em rgba(198, 78, 27, 0.3), 1.8em -1.8em 0 0em rgba(198, 78, 27, 0.3), 2.5em 0em 0 0em rgba(198, 78, 27, 0.3), 1.75em 1.75em 0 0em rgba(198, 78, 27, 0.7), 0em 2.5em 0 0em rgba(198, 78, 27, 1), -1.8em 1.8em 0 0em #ffffff, -2.6em 0em 0 0em rgba(198, 78, 27, 0.3), -1.8em -1.8em 0 0em rgba(198, 78, 27, 0.3);
}
75% {
box-shadow: 0em -2.6em 0em 0em rgba(198, 78, 27, 0.3), 1.8em -1.8em 0 0em rgba(198, 78, 27, 0.3), 2.5em 0em 0 0em rgba(198, 78, 27, 0.3), 1.75em 1.75em 0 0em rgba(198, 78, 27, 0.3), 0em 2.5em 0 0em rgba(198, 78, 27, 0.7), -1.8em 1.8em 0 0em rgba(198, 78, 27, 1), -2.6em 0em 0 0em #ffffff, -1.8em -1.8em 0 0em rgba(198, 78, 27, 0.3);
}
87.5% {
box-shadow: 0em -2.6em 0em 0em rgba(198, 78, 27, 0.3), 1.8em -1.8em 0 0em rgba(198, 78, 27, 0.3), 2.5em 0em 0 0em rgba(198, 78, 27, 0.3), 1.75em 1.75em 0 0em rgba(198, 78, 27, 0.3), 0em 2.5em 0 0em rgba(198, 78, 27, 0.3), -1.8em 1.8em 0 0em rgba(198, 78, 27, 0.7), -2.6em 0em 0 0em rgba(198, 78, 27, 1), -1.8em -1.8em 0 0em #ffffff;
}
}

2
frontend/src/resources/template/app/component/progress-indication.html
View file

@ -1,3 +1,3 @@
<div class="modal-body">
<div class="progress"></div>
<div class="loader"></div>
</div>