MaDgIK
/
openaire-theme
13
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

[develop | DONE | ADDED] add new 'small' progress-semicircle size and icon-background (without shadow)

This commit is contained in:
Alex Martzios 2024-04-08 19:09:26 +03:00
parent 43ed7e2679
commit 9171ec2a63
2 changed files with 28 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
less/icon.less
View File

@ -3,6 +3,7 @@
@icon-button-xsmall-size: 24px;
@icon-bg-background: @global-background;
@icon-bg-size: @icon-button-size;
@icon-bg-size-small: @icon-button-size*0.5;
@icon-bg-size-medium: @icon-button-size*1.5;
@icon-bg-size-large: @icon-button-size*2;
@ -80,6 +81,23 @@
}
/* Default circle element for SVGs */
.uk-icon-bg {
border-radius: 100px;
width: @icon-bg-size;
height: @icon-bg-size;
display: flex;
align-items: center;
justify-content: center;
background-color: @icon-bg-background;
}
.uk-icon-bg-small {
width: @icon-bg-size-small;
height: @icon-bg-size-small;
}
/**/
/* Default circle element for SVGs with shadow*/
.uk-icon-bg-shadow {
border-radius: 100px;
width: @icon-button-size;

10
less/progress.less
View File

@ -15,9 +15,11 @@
@progress-circle-background-open-access: conic-gradient(@progress-bar-background-open-access calc(var(--percentage) * 1%), @progress-background-open-access 0);
@progress-semicircle-size: 120px;
@progress-semicircle-size-small: 80px;
@progress-semicircle-color: @global-primary-background;
@progress-semicircle-text-font-weight: @text-bold-weight;
@progress-semicircle-text-font-size: @global-large-font-size;
@progress-semicircle-text-font-size-small: @global-font-size;
@progress-semicircle-background: conic-gradient(from 0.75turn at 50% 100%, @progress-bar-background calc(var(--percentage) * 1% / 2), @progress-background calc(var(--percentage) * 1% / 2 + 0.1%));
@progress-semicircle-background-open-access: conic-gradient(from 0.75turn at 50% 100%, @progress-bar-background-open-access calc(var(--percentage) * 1% / 2), @progress-background-open-access calc(var(--percentage) * 1% / 2 + 0.1%));
@ -110,6 +112,14 @@
}
}
}
.uk-progress-semicircle-small[percentage] {
width: @progress-semicircle-size-small;
&::after {
font-size: @progress-semicircle-text-font-size-small;
}
}
}
@inverse-progress-background: @inverse-global-color;