adam/Piwigo
1
0
Fork 0
mirror of https://github.com/Piwigo/Piwigo.git synced 2026-08-07 01:03:31 +02:00
Code Issues Packages Projects Releases Wiki Activity

related to #1859 New design for mobile app banner

Browse Source
This commit is contained in:
MatthieuLP
2023-02-06 17:12:53 +01:00
parent c6ada9b9ac
commit 9ca48379e1
2 changed files with 35 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files
admin/themes/default/template/photos_add_direct.tpl
+7 -9
View File
@@ -417,21 +417,19 @@ jQuery(document).ready(function(){
<div class="promote-apps"> <div class="promote-apps">
<div class="promote-content"> <div class="promote-content">
<div class="left-side"> <div class="left-side">
<img src="https://de.piwigo.org/./plugins/piwigo-piwigodotorg/images/mobile_applications/Group_77.png"> <img src="https://sandbox.piwigo.com/uploads/4/y/1/4y1zzhnrnw//2023/01/24/20230124175152-015bc1e3.png">
<div class="promote-text"> </div>
<span>{"Piwigo is also on mobile."|@translate|escape:javascript}</span> <div class="promote-text">
<span>{"Try now !"|@translate|escape:javascript}</span> <span>{"Piwigo is also on mobile."|@translate|escape:javascript}</span>
</div> <span>{"Try now !"|@translate|escape:javascript}</span>
</div> </div>
<div class="mid-side"></div>
<div class="right-side"> <div class="right-side">
<div class="promote-text"> <div>
<span>{"Install Piwigo on mobile"|@translate|escape:javascript}</span>
<a href="{$PHPWG_URL}/mobile-applications" target="_blank"><span class="go-to-porg icon-link-1">{"Discover"|@translate|escape:javascript}</span></a> <a href="{$PHPWG_URL}/mobile-applications" target="_blank"><span class="go-to-porg icon-link-1">{"Discover"|@translate|escape:javascript}</span></a>
</div> </div>
</div> </div>
</div> </div>
<span class="dont-show-again">{'Understood, do not show again'|translate|escape:javascript}</span> <span class="dont-show-again icon-cancel tiptip" title="{'Understood, do not show again'|translate|escape:javascript}"></span>
</div> </div>
{/if} {/if}
admin/themes/default/theme.css
+28 -23
View File
@@ -6773,9 +6773,14 @@ color:#FF7B00;
flex-direction: column; flex-direction: column;
justify-content: flex-end; justify-content: flex-end;
border-bottom: 1px solid lightgray; padding: 15px;
padding: 0 15px 15px 15px; margin: 0 20px 15px 20px;
margin-bottom: 15px; border-radius: 5px;
background: #f5d8b0;
position: relative;
box-shadow: 0px 5px 10px 5px rgba(0,0,0,0.1)
} }
.close-apps { .close-apps {
@@ -6791,11 +6796,11 @@ color:#FF7B00;
} }
.dont-show-again { .dont-show-again {
margin-left: auto; position: absolute;
color: #555; color: #333;
border-radius: 20px; top: 5px;
padding: 3px 8px; right: 5px;
font-weight: 700; font-size: 25px;
} }
.dont-show-again:hover, .dont-show-again:hover,
@@ -6806,28 +6811,26 @@ color:#FF7B00;
.promote-content { .promote-content {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: space-around; justify-content: center;
flex: 2;
} }
.promote-content .left-side { .promote-content .left-side {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; flex: 1;
}
.promote-content .mid-side {
border-right: 1px solid gray;
} }
.promote-content .right-side { .promote-content .right-side {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
flex: 1;
} }
.promote-content .left-side img { .promote-content .left-side img {
width: 170px; width: 170px;
margin-left: 60px; margin-left: 25px;
margin-right: 80px;
} }
.promote-text { .promote-text {
@@ -6836,8 +6839,13 @@ color:#FF7B00;
font-size: 30px; font-size: 30px;
font-weight: 700; font-weight: 700;
color: #000; color: #000;
justify-content: center;
flex: 2;
} }
.promote-text span {
font-size: 35px;
}
.promote-text span:first-child { .promote-text span:first-child {
margin-bottom: 5px; margin-bottom: 5px;
} }
@@ -6854,6 +6862,7 @@ color:#FF7B00;
color: #3c3c3c; color: #3c3c3c;
width: 150px; width: 150px;
text-align: center; text-align: center;
white-space: nowrap;
} }
.go-to-porg::before { .go-to-porg::before {
@@ -6876,23 +6885,19 @@ color:#FF7B00;
@media (max-width: 1450px) { @media (max-width: 1450px) {
.promote-text span { .promote-text span {
font-size: 20px; font-size: 30px;
}
.promote-content .left-side img {
margin-left: 60px;
} }
} }
@media (max-width: 1170px) { @media (max-width: 1170px) {
.promote-content .left-side img { .promote-text span {
margin: 0 20px 0 0; font-size: 25px;
} }
} }
@media (max-width: 1050px) { @media (max-width: 1050px) {
.promote-text span { .promote-text span {
font-size: 15px; font-size: 20px;
} }
.promote-content .left-side img { .promote-content .left-side img {