fix and align (+) icon for mobile

This commit is contained in:
ralf 2024-09-19 14:59:22 +02:00
parent 6dbe75400e
commit c1a4cceee1
3 changed files with 50 additions and 8 deletions

View File

@ -10,7 +10,23 @@
* @version $Id: $
*/
/* bootstrap-icons as font use with content taken from node_modules/bootstrap-icons/font/bootstrap-icons.css
div::before {
.bootstrap-icons;
content: "\f231"; // caret-right-fill
} */
.bootstrap-icons {
display: inline-block;
font-family: bootstrap-icons !important;
font-style: normal;
font-weight: normal !important;
font-variant: normal;
text-transform: none;
line-height: 1;
vertical-align: -.125em;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
@mobile-fontsize-base : 10pt;
.mob-fontsize-xxs {font-size: @mobile-fontsize-base*0.6;}
@ -29,4 +45,4 @@
.mob-bg-applist-header {background-color:#486F93;}
/*border colors*/
/*border colors*/

View File

@ -7,7 +7,6 @@
* @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
* @author Hadi Nategh <hn@stylite.de>
* @package pixelegg
* @version $Id$
*/
/**
* EGroupware: Darkmode theme
@ -8429,6 +8428,16 @@ table.egwGridView_grid img.et2_appicon {
display: block;
}
body et2-button.plus_button {
display: inline-block;
font-family: bootstrap-icons !important;
font-style: normal;
font-weight: normal !important;
font-variant: normal;
text-transform: none;
line-height: 1;
vertical-align: -0.125em;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
position: fixed !important;
right: 15px;
bottom: 15px;
@ -8439,9 +8448,7 @@ table.egwGridView_grid img.et2_appicon {
z-index: 100;
background-color: #0c5da5;
border: none;
background-image: url(../../node_modules/bootstrap-icons/icons/plus-lg.svg) !important;
background-repeat: no-repeat;
background-size: 24px 24px;
margin: 0;
padding: 0;
}
@ -8449,6 +8456,17 @@ table.egwGridView_grid img.et2_appicon {
body et2-button.plus_button:active {
background-color: #0c5da5;
}
body et2-button.plus_button::before {
color: white;
content: "\f64d";
font-size: 32px;
line-height: 60px;
color: #fff;
text-align: center;
width: 60px;
font-weight: bolder;
display: inline-block;
}
body et2-button.plus_button::part(base) {
display: none;
}

View File

@ -7,7 +7,6 @@
* @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
* @author Hadi Nategh <hn@stylite.de>
* @package pixelegg
* @version $Id$
*/
@import "../less/darkmode.less";
@import "../css/mobile.less";
@ -676,6 +675,7 @@
display: block;
}
et2-button.plus_button {
.bootstrap-icons;
position: fixed !important;
right: 15px;
bottom: 15px;
@ -686,15 +686,23 @@
z-index: 100;
background-color: #0c5da5;
border: none;
background-image: url(../../node_modules/bootstrap-icons/icons/plus-lg.svg) !important;
background-repeat: no-repeat;
background-size: 24px 24px;
margin: 0;
padding: 0;
&:hover, &:active {
background-color: #0c5da5;
}
&::before {
color: white;
content: "\f64d"; // plus-lg
font-size: 32px;
line-height: 60px;
color: #fff;
text-align: center;
width: 60px;
font-weight: bolder;
display: inline-block }
}
et2-button.plus_button::part(base) {