* Finish task #79623.

This commit is contained in:
田淑杰
2022-12-14 15:41:52 +08:00
parent 7a1c12647a
commit d023bcb506
6 changed files with 33 additions and 33 deletions
+16 -26
View File
@@ -1,45 +1,35 @@
<div class='panel-body scrollbar-hover'>
<div class='flowchart'>
<?php foreach ($lang->block->flowchart as $flowName => $flow):?>
<?php $idx = 0; ?>
<div class='row row-<?php echo $flowName?>'>
<?php foreach ($flow as $flowItem):?>
<div class='flow-item flow-item-<?php echo $idx++ ?>'><div title='<?php echo $flowItem ?>'><span class='flow-item-display'><?php echo $flowItem ?></span></div></div>
<div class='flow-item flow-item-<?php echo $idx ++ ?>'><div title='<?php echo $flowItem ?>'><span class='flow-item-display'><?php echo $flowItem ?></span></div></div>
<?php endforeach; ?>
</div>
<?php endforeach; ?>
</div>
<style>
.block-flowchart .panel-body {padding: 0 30px 0 20px;}
.flowchart {padding: 20px 24px 20px 24px;}
.flow-item {float: left; width: 16.66667%; max-width: 180px; text-align: center; margin-bottom: 9px; padding-right: 15px;}
.flow-item > div {position: relative; padding: 5px 0 5px 8px; line-height: 20px; background: #E8EBEF; white-space:nowrap; overflow: visible; color: #3c4353}
.flow-item > div:before, .flow-item > div:after {content: ' '; display: block; width: 0; height: 0; border-style: solid; border-width: 15px 0 15px 10px; border-color: transparent transparent transparent #E8EBEF; position: absolute; left: 0; top: 0;}
.flow-item > div {position: relative; padding: 5px 0 5px 8px; line-height: 20px; background: #66A2FF; white-space:nowrap; overflow: visible; color: #3c4353}
.flow-item > div:before, .flow-item > div:after {content: ' '; display: block; width: 0; height: 0; border-style: solid; border-width: 15px 0 15px 10px; border-color: transparent transparent transparent #66A2FF; position: absolute; left: 0; top: 0;}
.ie-8 .flow-item > div:before {display: none}
.flow-item > div:before {border-left-color: #fff; z-index: 1}
.flow-item > div:after {left: auto; right: -10px; z-index: 2}
.flow-item > div > span {display: flow-root; overflow: hidden;}
.ie-8 .flow-item > div {margin-right: 10px}
.flow-item-0 > div {color: #3C4353; font-weight: bold; padding-left: 0;}
.flow-item-0 > div {color: #FFF; font-weight: 400; padding-left: 0;}
.flow-item-0 > div:before {display: none}
.flow-item-1 > div {background: #E3F2FD}
.flow-item-1 > div:after {border-left-color: #E3F2FD}
.flow-item-2 > div {background: #E8F5E9}
.flow-item-2 > div:after {border-left-color: #E8F5E9}
.flow-item-3 > div {background: #FFF3E0}
.flow-item-3 > div:after {border-left-color: #FFF3E0}
.flow-item-4 > div {background: #FFEBEE}
.flow-item-4 > div:after {border-left-color: #FFEBEE}
.flow-item-5 > div {background: #F3E5F5}
.flow-item-5 > div:after {border-left-color: #F3E5F5}
.flow-item-1 > div:hover {background: #1565C0; color: #fff;}
.flow-item-1 > div:hover:after {border-left-color: #1565C0}
.flow-item-2 > div:hover {background: #43A047; color: #fff;}
.flow-item-2 > div:hover:after {border-left-color: #43A047}
.flow-item-3 > div:hover {background: #EF6C00; color: #fff;}
.flow-item-3 > div:hover:after {border-left-color: #EF6C00}
.flow-item-4 > div:hover {background: #E53935; color: #fff;}
.flow-item-4 > div:hover:after {border-left-color: #E53935}
.flow-item-5 > div:hover {background: #9C27B0; color: #fff;}
.flow-item-5 > div:hover:after {border-left-color: #9C27B0}
.flow-item-1 > div,
.flow-item-2 > div,
.flow-item-3 > div,
.flow-item-4 > div,
.flow-item-5 > div {background: #E6F0FF}
.flow-item-1 > div:after,
.flow-item-2 > div:after,
.flow-item-3 > div:after,
.flow-item-4 > div:after,
.flow-item-5 > div:after {border-left-color: #E6F0FF}
.block-sm .flow-item {padding-right: 5px}
.block-sm .flow-item > div:before, .block-sm .flow-item > div:after {border-width: 15px 0 15px 6px;}
+10
View File
@@ -5,6 +5,7 @@
.block-guide .nav-secondary > li {position: relative;}
.block-guide .nav-secondary > li.active {background: #FFF;}
.block-guide .nav-secondary > li > a {font-size: 14px; color: #838A9D; position: relative; box-shadow: none; padding-left: 20px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; transition: all .2s;}
.block-guide .nav-secondary > li > a:hover {box-shadow: none;}
.block-guide .nav-secondary > li > a:first-child {padding-right: 36px;}
.block-guide .nav-secondary > li.active > a:first-child {color: #3C4353; background: transparent; box-shadow: none;}
.block-guide .nav-secondary > li.active > a:first-child:before {content: ''; display: block; left: -1px; height: 100%; top: 0px; width: 2px; background: #2E7FFF; position: absolute;}
@@ -49,6 +50,15 @@ $(function()
</ul>
</div>
<div class="col tab-content">
<div class="tab-pane fade active in" id='<?php echo "tab3{$blockNavId}Contentflowchart";?>'>
<?php include 'flowchart.html.php';?>
</div>
<div class="tab-pane fade" id='<?php echo "tab3{$blockNavId}ContentsystemMode";?>'></div>
<div class="tab-pane fade" id='<?php echo "tab3{$blockNavId}ContentvisionSwitch";?>'></div>
<div class="tab-pane fade" id='<?php echo "tab3{$blockNavId}ContentthemeSwitch";?>'></div>
<div class="tab-pane fade" id='<?php echo "tab3{$blockNavId}Contentpreference";?>'></div>
<div class="tab-pane fade" id='<?php echo "tab3{$blockNavId}ContentdownloadClient";?>'></div>
<div class="tab-pane fade" id='<?php echo "tab3{$blockNavId}ContentdownloadMoblie";?>'></div>
</div>
</div>
</div>