Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Updated: Design of back office page toolbar #891

Merged
merged 7 commits into from
Mar 15, 2024
Merged

Updated: Design of back office page toolbar #891

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
25ec013
Update back office page header design
abhishek-webkul Oct 30, 2023
673a364
Fix design issues
abhishek-webkul Jan 17, 2024
625ce7e
Merge branch 'develop' into gli-1637
abhishek-webkul Jan 18, 2024
82f6d20
Fix design issues
abhishek-webkul Jan 18, 2024
32f4593
Fix toolbar button issue
abhishek-webkul Feb 8, 2024
2a5c658
Merge branch 'webkul:develop' into gli-1637
abhishek-webkul Feb 13, 2024
d3c5735
Update button color
abhishek-webkul Feb 14, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion admin/themes/default/sass/modules/_variables.sass
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,7 @@ $sidebar-menu-hover-color: white !default
$sidebar-menu-bg-hover-color: #282b30

// Toolbar
$toolbar-buttons-color: #2eacce
$toolbar-buttons-color: #00aff0
$toolbar-buttons-hover-color: #40c9ed

// Scaffolding
Expand Down
2 changes: 1 addition & 1 deletion admin/themes/default/sass/partials/_content.sass
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ body
@include float(left)

#content.bootstrap
padding: 120px 10px 0
padding: 90px 10px 0
@include transition-property(margin)
@include transition-duration(0.4s)
@include transition-timing-function(ease-out)
Expand Down
37 changes: 28 additions & 9 deletions admin/themes/default/sass/partials/_toolbar.sass
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
.page-head
width: 100%
height: 100px
height: 78px
padding: 0
margin: 0
position: fixed
Expand All @@ -14,10 +14,11 @@
@include float(left)
position: relative
margin: 0
font: 20pt $font-family-sans-serif
font: 14pt $font-family-sans-serif
font-weight: bold
color: #363A41
white-space: nowrap
@include padding(26px, 0, 0, ($widthSidebarNav+20px))
@include padding(31px, 0, 0, ($widthSidebarNav+20px))
@media (max-width: $screen-tablet)
@include padding(26px, 0, 0, 70px)
a
Expand All @@ -40,6 +41,7 @@
position: absolute
background-color: transparent!important
@include right(0)
top: 18px
@media (max-width: $screen-sm)
#toolbar-nav
border: none
Expand All @@ -48,37 +50,54 @@
@include padding(3px, 0, 0, 0)
.toolbar_btn
position: relative
padding: 20px 5px !important
padding: 10px 10px !important
font-size: 12px
line-height: 8px
color: $main-color
color: $toolbar-buttons-color
text-align: center
text-shadow: none
white-space: nowrap
overflow: hidden
text-overflow: ellipsis
border: 1px solid $toolbar-buttons-color
border-radius: 2px
@include margin(0, 3px, 2px, 0)
@media (max-width: $screen-desktop)
width: 46px
font-size: 11px
div
color: #363A41
i
color: $toolbar-buttons-color
display: inline
font-size: 18px
&:hover
color: $toolbar-buttons-hover-color
div
padding-top: 10px
span
position: relative
top: -2px
left: 2px
color: #363A41
font-weight: 400
.dropdown-toolbar
display: none
@include float(right)
@include border-radius(3px)
@media (max-width: $screen-sm)
display: block
padding: 6px 10px !important
margin-right: 10px
@media (max-width: $screen-xs)
margin-right: 5px

#toolbar-nav
li + li
margin-left: 8px
ul.page-breadcrumb
position: absolute
list-style: none
margin: 0
padding: 0
top: 4px
top: 9px
height: 20px
line-height: 20px
color: black
Expand Down
10 changes: 5 additions & 5 deletions admin/themes/default/template/controllers/modules/page_header_toolbar.tpl
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,37 +49,37 @@
<li>
<a id="desc-module-update-all" class="toolbar_btn" href="{$currentIndex|escape:'html':'UTF-8'}&amp;token={$token|escape:'html':'UTF-8'}&amp;updateAll=1" title="{l s='Update all'}">
<i class="process-icon-refresh"></i>
<div>{l s='Update all'}</div>
<span>{l s='Update all'}</span>
</a>
</li>
{/if}
{else}
<li>
<a id="desc-module-check-and-update-all" class="toolbar_btn" href="{$currentIndex|escape:'html':'UTF-8'}&amp;token={$token|escape:'html':'UTF-8'}&amp;check=1" title="{l s='Check for update'}">
<i class="process-icon-refresh"></i>
<div>{l s='Check for update'}</div>
<span>{l s='Check for update'}</span>
</a>
</li>
{/if}
<li>
<a id="desc-module-catalog" class="toolbar_btn anchor" href="{$link->getAdminLink('AdminModulesCatalog')}" title="{l s='Recommended Modules and Services'}">
<i class="process-icon-modules-list"></i>
<div>{l s='Recommended Modules and Services'}</div>
<span>{l s='Recommended Modules and Services'}</span>
</a>
</li>
{if $add_permission eq '1'}
{if $context_mode != Context::MODE_HOST}
<li>
<a id="desc-module-new" class="toolbar_btn anchor" href="#" onclick="$('#module_install').slideToggle();" title="{l s='Add a new module'}">
<i class="process-icon-new"></i>
<div>{l s='Add a new module'}</div>
<span>{l s='Add a new module'}</span>
</a>
</li>
{else}
<li>
<a id="desc-module-new" class="toolbar_btn" href="{$link->getAdminLink('AdminModules')}&addnewmodule" title="{l s='Add a new module'}">
<i class="process-icon-new"></i>
<div>{l s='Add a new module'}</div>
<span>{l s='Add a new module'}</span>
</a>
</li>
{/if}
Expand Down
4 changes: 2 additions & 2 deletions admin/themes/default/template/page_header_toolbar.tpl
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -83,7 +83,7 @@
<li>
<a id="page-header-desc-{$table}-{if isset($btn.imgclass)}{$btn.imgclass|escape}{else}{$k}{/if}" class="toolbar_btn {if isset($btn.target) && $btn.target} _blank{/if} pointer"{if isset($btn.href)} href="{$btn.href|escape}"{/if} title="{if isset($btn.help)}{$btn.help}{else}{$btn.desc|escape}{/if}"{if isset($btn.js) && $btn.js} onclick="{$btn.js}"{/if}{if isset($btn.modal_target) && $btn.modal_target} data-target="{$btn.modal_target}" data-toggle="modal"{/if}{if isset($btn.help)} data-toggle="tooltip" data-placement="bottom"{/if}>
<i class="{if isset($btn.icon)}{$btn.icon|escape}{else}process-icon-{if isset($btn.imgclass)}{$btn.imgclass|escape}{else}{$k}{/if}{/if}{if isset($btn.class)} {$btn.class|escape}{/if}"></i>
<div{if isset($btn.force_desc) && $btn.force_desc == true } class="locked"{/if}>{$btn.desc|escape}</div>
<span{if isset($btn.force_desc) && $btn.force_desc == true } class="locked"{/if}>{$btn.desc|escape}</span>
</a>
</li>
{/if}
Expand All @@ -92,7 +92,7 @@
<li>
<a id="page-header-desc-{$table}-{if isset($toolbar_btn['modules-list'].imgclass)}{$toolbar_btn['modules-list'].imgclass}{else}modules-list{/if}" class="toolbar_btn{if isset($toolbar_btn['modules-list'].class)} {$toolbar_btn['modules-list'].class}{/if}{if isset($toolbar_btn['modules-list'].target) && $toolbar_btn['modules-list'].target} _blank{/if}" {if isset($toolbar_btn['modules-list'].href)}href="{$toolbar_btn['modules-list'].href}"{/if} title="{$toolbar_btn['modules-list'].desc}"{if isset($toolbar_btn['modules-list'].js) && $toolbar_btn['modules-list'].js} onclick="{$toolbar_btn['modules-list'].js}"{/if}>
<i class="{if isset($toolbar_btn['modules-list'].icon)}{$toolbar_btn['modules-list'].icon}{else}process-icon-{if isset($toolbar_btn['modules-list'].imgclass)}{$toolbar_btn['modules-list'].imgclass}{else}modules-list{/if}{/if}"></i>
<div{if isset($toolbar_btn['modules-list'].force_desc) && $toolbar_btn['modules-list'].force_desc == true } class="locked"{/if}>{$toolbar_btn['modules-list'].desc}</div>
<span{if isset($toolbar_btn['modules-list'].force_desc) && $toolbar_btn['modules-list'].force_desc == true } class="locked"{/if}>{$toolbar_btn['modules-list'].desc}</span>
</a>
</li>
{/if}
Expand Down