[PE] refactoring for page About
This commit is contained in:
parent
cfdba38ca6
commit
5e9ce16d8d
41
apps/common/mobile/resources/less/about.less
Normal file
41
apps/common/mobile/resources/less/about.less
Normal file
|
@ -0,0 +1,41 @@
|
|||
@text-normal: #000;
|
||||
|
||||
.about {
|
||||
.page-content {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.content-block:first-child {
|
||||
margin: 15px 0;
|
||||
}
|
||||
|
||||
.content-block {
|
||||
margin: 0 auto 15px;
|
||||
|
||||
a {
|
||||
color: @text-normal;
|
||||
}
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-weight: normal;
|
||||
margin: 0;
|
||||
|
||||
&.vendor {
|
||||
color: @text-normal;
|
||||
font-weight: bold;
|
||||
margin-top: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
p > label {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.logo {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
height: 55px;
|
||||
background: url('../../../../common/mobile/resources/img/about/logo.svg') no-repeat center;
|
||||
}
|
||||
}
|
|
@ -299,4 +299,10 @@
|
|||
.dialog {
|
||||
background-color: rgba(var(--f7-dialog-bg-color-rgb), 1);
|
||||
}
|
||||
|
||||
.about {
|
||||
.logo {
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -27,76 +27,3 @@
|
|||
color: #212121;
|
||||
}
|
||||
}
|
||||
|
||||
// About
|
||||
|
||||
.content-block {
|
||||
margin: 35px 0;
|
||||
padding: 0 15px;
|
||||
color: #6d6d72;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.about .page-content {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.about .content-block {
|
||||
margin: 0 auto 15px;
|
||||
}
|
||||
|
||||
.about .content-block:first-child {
|
||||
margin: 15px 0;
|
||||
}
|
||||
|
||||
.about .logo {
|
||||
margin-top: 20px;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
height: 55px;
|
||||
.encoded-svg-background('<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 290 55"><defs><style>.cls-1,.cls-2,.cls-3{fill-rule:evenodd;}.cls-1{fill:url(#grad_173);}.cls-2{fill:url(#grad_168);}.cls-3{fill:url(#grad_91);}.cls-4{fill:#526484;}.cls-5{fill:#3a4968;}</style><linearGradient id="grad_173" x1="35" y1="63.54" x2="35" y2="24.24" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#d94315" stop-opacity="0.3"/><stop offset="0.88" stop-color="#d9420b"/></linearGradient><linearGradient id="grad_168" x1="35.03" y1="46.52" x2="35.03" y2="20.68" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#8bba24" stop-opacity="0.3"/><stop offset="0.66" stop-color="#8bba25"/></linearGradient><linearGradient id="grad_91" x1="35" y1="35.95" x2="35" y2="1.23" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#28a8e0" stop-opacity="0.3"/><stop offset="1" stop-color="#26a8de"/></linearGradient></defs><path class="cls-1" d="M31.36,53.32L7.5,42.58c-2-.9-2-2.38,0-3.28l8.36-3.77,15.49,7a10.15,10.15,0,0,0,7.28,0l15.49-7L62.5,39.3c2,0.9,2,2.38,0,3.28L38.64,53.32a10.14,10.14,0,0,1-7.28,0h0Z"/><path class="cls-2" d="M31.39,40.14L7.56,29.39c-2-.9-2-2.38,0-3.28l8.1-3.65,15.73,7.09a10.12,10.12,0,0,0,7.28,0L54.4,22.46l8.1,3.65c2,0.9,2,2.38,0,3.28L38.67,40.14a10.12,10.12,0,0,1-7.28,0h0Z"/><path class="cls-3" d="M31.36,27.19L7.5,16.58c-2-.89-2-2.35,0-3.24L31.36,2.74a10.27,10.27,0,0,1,7.28,0L62.5,13.34c2,0.89,2,2.35,0,3.24L38.64,27.19a10.26,10.26,0,0,1-7.28,0h0Z"/><path class="cls-4" d="M72.06,27.86q0-6.86,4-10.31a14.37,14.37,0,0,1,18.68,0q4,3.45,4,10.35t-4,10.31a14.37,14.37,0,0,1-18.68,0q-4-3.45-4-10.31v0h0Zm5.78,0q0,4.74,1.8,7a7.77,7.77,0,0,0,3.9,2.79q0.51,0.12,1,.17a7.12,7.12,0,0,0,.92.06,7.59,7.59,0,0,0,.94-0.06,5.83,5.83,0,0,0,1-.21,7.58,7.58,0,0,0,3.87-2.79Q93,32.56,93,27.89T91.2,21a7.58,7.58,0,0,0-3.87-2.79,5.83,5.83,0,0,0-1-.21,7.76,7.76,0,0,0-.94-0.06,7.27,7.27,0,0,0-.92.06q-0.45.06-1,.17A7.77,7.77,0,0,0,79.64,21q-1.8,2.22-1.8,6.92v0h0Z"/><polygon class="cls-4" points="102 15 109 15 119.89 35 120 35 120 15 125 15 125 41 118 41 107.13 20.96 107.01 20.96 107 41 102 41 102 15 102 15"/><polygon class="cls-4" points="130 15 135 15 135 37 147 37 147 41 130 41 130 15 130 15"/><polygon class="cls-4" points="148 15 155.47 25.98 155.59 25.98 163 15 168.5 15 158 31 158 41 153 41 153 31 142.5 15 148 15"/><path class="cls-5" d="M168,27.94q0-6.77,3.9-10.18a13.88,13.88,0,0,1,18.22,0Q194,21.17,194,28t-3.88,10.18a13.88,13.88,0,0,1-18.22,0Q168,34.75,168,28v0h0Zm5.63,0q0,4.68,1.75,6.87a7.57,7.57,0,0,0,3.81,2.76q0.49,0.11.93,0.17a6.85,6.85,0,0,0,.89.06,7.31,7.31,0,0,0,.91-0.06,5.6,5.6,0,0,0,1-.21,7.39,7.39,0,0,0,3.77-2.76q1.71-2.19,1.71-6.79t-1.71-6.79a7.39,7.39,0,0,0-3.77-2.76,5.61,5.61,0,0,0-1-.21,7.48,7.48,0,0,0-.91-0.06,7,7,0,0,0-.89.06q-0.44.06-.93,0.17a7.57,7.57,0,0,0-3.81,2.76q-1.75,2.19-1.75,6.83v0h0Z"/><polygon class="cls-5" points="197 15 212 15 212 19 202 19 202 26 211 26 211 30 202 30 202 41 197 41 197 15 197 15"/><polygon class="cls-5" points="216 15 231 15 231 19 221 19 221 26 230 26 230 30 221 30 221 41 216 41 216 15 216 15"/><polygon class="cls-5" points="234 41 234 15 239 15 239 41 234 41 234 41"/><path class="cls-5" d="M262,19.88a18.8,18.8,0,0,0-6.3-1c-7,0-8.28,5.64-8.28,9.13,0,2.54.84,9.19,7.67,9.19a17,17,0,0,0,6.57-1.24L262,40.42a42.48,42.48,0,0,1-7.46.81c-5.08,0-12.54-3.1-12.54-13.36,0-9.28,7-13,13-13a24.56,24.56,0,0,1,7,.8v4.25Z"/><polygon class="cls-5" points="266 15 282 15 282 19 271 19 271 26 281 26 281 30 271 30 271 37 282 37 282 41 266 41 266 15 266 15"/></svg>');
|
||||
}
|
||||
|
||||
.settings-about-logo {
|
||||
margin-top: 20px;
|
||||
img {
|
||||
max-width: 216px;
|
||||
max-height: 35px;
|
||||
}
|
||||
}
|
||||
|
||||
.about h3 {
|
||||
font-weight: 400;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.about h3.vendor {
|
||||
color: #000;
|
||||
font-weight: 700;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.about p > label {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.about .content-block a {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.content-block-inner {
|
||||
background: #fff;
|
||||
padding: 10px 15px;
|
||||
margin-left: -15px;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
|
@ -46,72 +46,3 @@
|
|||
color: #212121;
|
||||
}
|
||||
}
|
||||
|
||||
// About
|
||||
|
||||
.content-block {
|
||||
margin: 35px 0;
|
||||
padding: 0 15px;
|
||||
color: #6d6d72;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.about .page-content {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.about .content-block {
|
||||
margin: 0 auto 15px;
|
||||
}
|
||||
|
||||
.about .content-block:first-child {
|
||||
margin: 15px 0;
|
||||
}
|
||||
|
||||
.about .logo {
|
||||
margin-top: 20px;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
height: 55px;
|
||||
.encoded-svg-background('<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 290 55"><defs><style>.cls-1,.cls-2,.cls-3{fill-rule:evenodd;}.cls-1{fill:url(#grad_173);}.cls-2{fill:url(#grad_168);}.cls-3{fill:url(#grad_91);}.cls-4{fill:#526484;}.cls-5{fill:#3a4968;}</style><linearGradient id="grad_173" x1="35" y1="63.54" x2="35" y2="24.24" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#d94315" stop-opacity="0.3"/><stop offset="0.88" stop-color="#d9420b"/></linearGradient><linearGradient id="grad_168" x1="35.03" y1="46.52" x2="35.03" y2="20.68" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#8bba24" stop-opacity="0.3"/><stop offset="0.66" stop-color="#8bba25"/></linearGradient><linearGradient id="grad_91" x1="35" y1="35.95" x2="35" y2="1.23" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#28a8e0" stop-opacity="0.3"/><stop offset="1" stop-color="#26a8de"/></linearGradient></defs><path class="cls-1" d="M31.36,53.32L7.5,42.58c-2-.9-2-2.38,0-3.28l8.36-3.77,15.49,7a10.15,10.15,0,0,0,7.28,0l15.49-7L62.5,39.3c2,0.9,2,2.38,0,3.28L38.64,53.32a10.14,10.14,0,0,1-7.28,0h0Z"/><path class="cls-2" d="M31.39,40.14L7.56,29.39c-2-.9-2-2.38,0-3.28l8.1-3.65,15.73,7.09a10.12,10.12,0,0,0,7.28,0L54.4,22.46l8.1,3.65c2,0.9,2,2.38,0,3.28L38.67,40.14a10.12,10.12,0,0,1-7.28,0h0Z"/><path class="cls-3" d="M31.36,27.19L7.5,16.58c-2-.89-2-2.35,0-3.24L31.36,2.74a10.27,10.27,0,0,1,7.28,0L62.5,13.34c2,0.89,2,2.35,0,3.24L38.64,27.19a10.26,10.26,0,0,1-7.28,0h0Z"/><path class="cls-4" d="M72.06,27.86q0-6.86,4-10.31a14.37,14.37,0,0,1,18.68,0q4,3.45,4,10.35t-4,10.31a14.37,14.37,0,0,1-18.68,0q-4-3.45-4-10.31v0h0Zm5.78,0q0,4.74,1.8,7a7.77,7.77,0,0,0,3.9,2.79q0.51,0.12,1,.17a7.12,7.12,0,0,0,.92.06,7.59,7.59,0,0,0,.94-0.06,5.83,5.83,0,0,0,1-.21,7.58,7.58,0,0,0,3.87-2.79Q93,32.56,93,27.89T91.2,21a7.58,7.58,0,0,0-3.87-2.79,5.83,5.83,0,0,0-1-.21,7.76,7.76,0,0,0-.94-0.06,7.27,7.27,0,0,0-.92.06q-0.45.06-1,.17A7.77,7.77,0,0,0,79.64,21q-1.8,2.22-1.8,6.92v0h0Z"/><polygon class="cls-4" points="102 15 109 15 119.89 35 120 35 120 15 125 15 125 41 118 41 107.13 20.96 107.01 20.96 107 41 102 41 102 15 102 15"/><polygon class="cls-4" points="130 15 135 15 135 37 147 37 147 41 130 41 130 15 130 15"/><polygon class="cls-4" points="148 15 155.47 25.98 155.59 25.98 163 15 168.5 15 158 31 158 41 153 41 153 31 142.5 15 148 15"/><path class="cls-5" d="M168,27.94q0-6.77,3.9-10.18a13.88,13.88,0,0,1,18.22,0Q194,21.17,194,28t-3.88,10.18a13.88,13.88,0,0,1-18.22,0Q168,34.75,168,28v0h0Zm5.63,0q0,4.68,1.75,6.87a7.57,7.57,0,0,0,3.81,2.76q0.49,0.11.93,0.17a6.85,6.85,0,0,0,.89.06,7.31,7.31,0,0,0,.91-0.06,5.6,5.6,0,0,0,1-.21,7.39,7.39,0,0,0,3.77-2.76q1.71-2.19,1.71-6.79t-1.71-6.79a7.39,7.39,0,0,0-3.77-2.76,5.61,5.61,0,0,0-1-.21,7.48,7.48,0,0,0-.91-0.06,7,7,0,0,0-.89.06q-0.44.06-.93,0.17a7.57,7.57,0,0,0-3.81,2.76q-1.75,2.19-1.75,6.83v0h0Z"/><polygon class="cls-5" points="197 15 212 15 212 19 202 19 202 26 211 26 211 30 202 30 202 41 197 41 197 15 197 15"/><polygon class="cls-5" points="216 15 231 15 231 19 221 19 221 26 230 26 230 30 221 30 221 41 216 41 216 15 216 15"/><polygon class="cls-5" points="234 41 234 15 239 15 239 41 234 41 234 41"/><path class="cls-5" d="M262,19.88a18.8,18.8,0,0,0-6.3-1c-7,0-8.28,5.64-8.28,9.13,0,2.54.84,9.19,7.67,9.19a17,17,0,0,0,6.57-1.24L262,40.42a42.48,42.48,0,0,1-7.46.81c-5.08,0-12.54-3.1-12.54-13.36,0-9.28,7-13,13-13a24.56,24.56,0,0,1,7,.8v4.25Z"/><polygon class="cls-5" points="266 15 282 15 282 19 271 19 271 26 281 26 281 30 271 30 271 37 282 37 282 41 266 41 266 15 266 15"/></svg>');
|
||||
}
|
||||
|
||||
.settings-about-logo {
|
||||
margin-top: 20px;
|
||||
img {
|
||||
max-width: 216px;
|
||||
max-height: 35px;
|
||||
}
|
||||
}
|
||||
|
||||
.about h3 {
|
||||
font-weight: 400;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.about h3.vendor {
|
||||
color: #000;
|
||||
font-weight: 700;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.about p > label {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.about .content-block a {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.content-block-inner {
|
||||
background: #fff;
|
||||
padding: 10px 15px;
|
||||
margin-left: -15px;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
|
|
|
@ -5,6 +5,7 @@
|
|||
@import '../../../../common/mobile/resources/less/common.less';
|
||||
@import '../../../../common/mobile/resources/less/common-ios.less';
|
||||
@import '../../../../common/mobile/resources/less/common-material.less';
|
||||
@import '../../../../common/mobile/resources/less/about.less';
|
||||
@import './app-material.less';
|
||||
@import './app-ios.less';
|
||||
@import './icons-ios.less';
|
||||
|
|
|
@ -25,7 +25,7 @@ const PagePresentationAbout = props => {
|
|||
<Navbar title={_t.textAbout} backLink={_t.textBack} />
|
||||
<div className="content-block">
|
||||
{licInfo && typeof licInfo == 'object' && typeof(customer)=='object' ? null : (
|
||||
<div className="logo"></div>
|
||||
<i className="logo"></i>
|
||||
)}
|
||||
{logoCustomer && logoCustomer.length ? (
|
||||
<div id="settings-about-logo" className="settings-about-logo">
|
||||
|
|
Loading…
Reference in a new issue