Skip to content

J
joshine
Commit 3d8d0189 by lmf
Options

优化网站公共底部页面

parent e1cf35ff
Showing with 186 additions and 48 deletions
app/design/frontend/Joshine/breeze/Magento_Theme/layout/default.xml
......@@ -93,7 +93,7 @@
<referenceBlock name="copyright" remove="true"/>
</referenceContainer>
<referenceContainer name="before.body.end">
<block class="Magento\Theme\Block\Html\Footer" name="absolute_footer" template="Magento_Theme::html/absolute_footer.phtml" />
<block class="Magento\Theme\Block\Html\Footer" name="footer" template="Magento_Theme::html/footer.phtml" />
</referenceContainer>
<referenceContainer name="content">
<block class="Magento\Framework\View\Element\FormKey" name="formkey"/>
......
app/design/frontend/Joshine/breeze/Magento_Theme/layout/default_head_blocks.xml
......@@ -4,6 +4,7 @@
<head>
<meta name="format-detection" content="telephone=no"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<css src="css/footer.css" rel="stylesheet" type="text/css" />
</head>
<body>
<referenceBlock name="breeze.css">
......
app/design/frontend/Joshine/breeze/Magento_Theme/requirejs-config.js 0 → 100644
/**
* Copyright © Magento, Inc. All rights reserved.
* See COPYING.txt for license details.
*/
var config = {
deps: [
'Magento_Theme/js/theme'
]
};
app/design/frontend/Joshine/breeze/Magento_Theme/templates/html/footer.phtml
......@@ -21,47 +21,45 @@ $logoHeight = $logoSizeResolver !== null && $logoSizeResolver->getHeight()
?>
<div class="footer-container">
<div class="site-footer" style="background: #0011;">
<div class="footer-related">
<div class="footer-article w1100">
<dl class="contact clearfix">
<dt class="fl"></dt>
<dd class="fl" style="margin-top: 10%;margin-left: revert;">
<a
class="logo"
href="<?= $block->escapeUrl($block->getUrl('')) ?>"
title="<?= $block->escapeHtmlAttr($storeName) ?>"
aria-label="store logo">
<img src="/media/logo/stores/1/joshine_logo_500.png"
title="<?= $block->escapeHtmlAttr($block->getLogoAlt()) ?>"
alt="<?= $block->escapeHtmlAttr($block->getLogoAlt()) ?>"
<?= $logoWidth ? 'width="' . $block->escapeHtmlAttr($logoWidth) . '"' : '' ?>
<?= $logoHeight ? 'height="' . $block->escapeHtmlAttr($logoHeight) . '"' : '' ?>
/>
</a>
</dd>
</dl>
<dl class="col-article">
<dt>ABOUT JOSHINE</dt>
<dd><a href="#">About Us</a></dd>
<dd><a href="#">About Our Products</a></dd>
<dd><a href="#">Contact Us</a></dd>
<dd><a href="#">Our Blog</a></dd>
</dl>
<dl class="col-article">
<dt>HELP & SUPPORT</dt>
<dd><a href="#">Size Guide</a></dd>
<dd><a href="#">Payment Methods</a></dd>
<dd><a href="#">FAQs</a></dd><dd><a href="#">How to Order</a></dd><dd><a href="#">Track My Order</a></dd>
</dl>
<dl class="col-article"><dt>OUR POLICY</dt><dd><a href="#">Shipping Policy</a></dd><dd><a href="#">Return & Exchange</a></dd><dd><a href="#">365-Days Warranty</a></dd>
</dl>
<dl class="wx">
</dl></div>
<div class="footer_link">
<div style="text-align: center;">
<img src="https://media.joshine.com/wysiwyg/joshine_logo_1.png" width="200px;" class="logo_img" >
</div>
<div>
<h4>ABOUT JOSHINE <span> > </span></h4>
<ul>
<li><a href="#">About Us</a></li>
<li>About Our Products</li>
<li>Contact Us</li>
<li>Our Blog</li>
</ul>
</div>
<div>
<h4>HELP & SUPPORT<span> > </span></h4>
<ul>
<li>Size Guide</li>
<li>Payment Methods</li>
<li>FAQs</li>
<li>How to Order</li>
<li>Track My Order</li>
</ul>
</div>
<div>
<h4>OUR POLICY<span> > </span></h4>
<ul>
<li>Shipping Policy</li>
<li>Return & Exchange</li>
<li>365-Days Warranty</li>
</ul>
</div>
</div>
<div class="copyright" >
<span class="copyright_left">Copyright © JOSHINE all rights reserved</span>
<span class="copyright_right"><img src="https://media.joshine.com/wysiwyg/footerpay.png" height="40px;">
<a title="Copy Right" href="https://www.joshine.com/copy-right" >Copy Right</a>
<a title="Terms of Use" href="https://www.joshine.com/terms-of-use" >Terms of Use</a>
<a title="Security & Privacy Policy" href="https://www.joshine.com/security-privacy-policy" >Security & Privacy Policy</a>
</span>
<div class="footer-links w1100"><div class="clearfix">
<?= $block->escapeHtml($block->getCopyright()) ?>
</div></div>
</div></div>
</div>
</div>
</div>
\ No newline at end of file
app/design/frontend/Joshine/breeze/Magento_Theme/web/js/theme.js 0 → 100644
/**
* Copyright © Magento, Inc. All rights reserved.
* See COPYING.txt for license details.
*/
define([
'jquery'
], function ($, keyboardHandler) {
'use strict';
$("h4").click(function () {
var dis = $(this).siblings("ul").css("display");
if (dis == "none"){
$(this).siblings("ul").css("display","block");
$(this).children("span").html('^')
}else{
$(this).siblings("ul").css("display","none");
$(this).children("span").html('>')
}
})
});
app/design/frontend/Joshine/breeze/web/css/_custom.less
......@@ -19,4 +19,12 @@
.products .product-item-photo img,#product-options-wrapper .swatch-option.image{
margin: 0;
}
\ No newline at end of file
}
//product vim desc
#description{
max-width: 100%;
overflow-x: auto;
}
app/design/frontend/Joshine/breeze/web/css/footer.css
@charset utf-8;*{font-family:微软雅黑;margin:0;padding:0;}.clearfix:after{content:".";display:block;height:0;visibility:hidden;clear:both;}.w1100{width:1100px;margin:0 auto;}.fl{float:left;}a{text-decoration:none;}ul{list-style:none;}.site-footer{font-size:14px;line-height:1.8;color:#a8aaba;background:#0011;}.site-footer a{color:#a8aaba;}.site-footer .footer-article{overflow:hidden;padding:30px 0 20px;}.site-footer .contact{float:left;width:280px;}.site-footer .contact dt{width:90px;}.site-footer .contact .iconfont{width:66px;height:66px;display:block;float:left;background:url(image/kefu.png) center center no-repeat;background-size:55px;}.site-footer .contact .text{font-size:14px;line-height:30px;color:#fff;}.site-footer .contact .tel{font-size:20px;color:#fff;padding:3px 0 15px;}.site-footer .contact a{display:block;width:180px;font-size:14px;line-height:30px;color:#9b9ea0;text-align:center;border-radius:4px;}.site-footer .contact a:hover{color:#fff!important;}.site-footer .col-article{float:left;width:23%;}.site-footer .col-article dd{margin-bottom:8px;overflow:hidden;}.site-footer .col-article dd a{font-size:12px;color:#9b9ea0;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;}.site-footer .wx{float:left;width:135px;margin-right:0;}.site-footer .wx dd{margin-bottom:15px;}.site-footer .wx dd img{display:block;width:110px;height:110px;border-radius:2px;margin:5px 0;}.site-footer .wx dd.other{margin-bottom:0;line-height:18px;}.site-footer .wx dd.other span{display:block;font-size:12px;}.site-footer .wx dd.other a{display:inline-block;margin-right:5px;font-size:12px;line-height:18px;vertical-align:top;}.footer-links{border-top:1px solid #41424c;text-align: center;padding:10px 0;}.footer-links p{font-size:14px;color:#a8aaba;}.footer-links a{margin-right:20px;font-size:12px;color:#a8aaba;}.footer-info .info-text{font-size:12px;text-align:center;padding:20px 0;}.footer-info .info-text .nav-bottom{font-size:14px;color:#ccc;text-align:center;padding:20px 0 5px;}.footer-info .info-text .nav-bottom a{color:#9b9ea0;padding:0 8px;}.footer-info .info-text .copyright{padding-top:5px;}.footer-info .info-text em{padding:0 8px;}.site-footer .col-article dt,.site-footer .wx dt{margin-bottom:15px;font-size:16px;font-weight:400;}
\ No newline at end of file
*{
padding: 0;
margin: 0;
}
footer{
background: #000;
color: #fff;
padding: 10px ;
}
footer .footer_link .logo_img{
margin-top: 10%;
}
footer a{
color: #fff;
text-decoration: auto;
}
.footer_link > div{
float: left;
width: 25%;
}
.footer_link h4{
margin-bottom: 20px;
font-size: smaller;
}
.footer_link h4 span{
display: none;
}
.footer_link ul li{
margin-bottom: 20px;
}
@media screen and (max-width:1200px) {
.footer_link > div{
width: 100%;
}
footer .footer_link .logo_img{
margin-top: 2%;
}
.footer_link h4 span{
display: block;
float: right;
line-height: 30px;
width: 30px;
height: 30px;
text-align: center;
color: #333333;
background: #eeeeee;
cursor: pointer;
font-size: smaller;
}
.copyright{
font-size: smaller;
}
.copyright span{
width: 100%;
}
.footer_link ul{
display: none;
}
.product-info-wrapper .page-title-wrapper h1{
display: none;
}
}
ul {
list-style: none;
}
.copyright{
text-align: center;
border-top: 1px solid #423f3f;
padding: 10px 0;
font-size: smaller;
}
.footer_link::after{
clear: both;
content: '';
display: block;
}
.copyright > .copyright_left{
float: left;
margin-left: 5%;
margin-top: 10px;
font-weight: bold;
color: #fff;
font-size: smaller;
}
.copyright img{
margin-bottom: -10px;
margin-right: 1%;
height: 40px;
}
.copyright a{
padding: 10px;
font-weight: bold;
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment