me/bbc-young-reporter
1
0
Fork 0
mirror of https://github.com/mgrove36/bbc-young-reporter.git synced 2026-03-03 11:27:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

Make top app bar 'short'

Browse Source 
This is a different type of Material Design top app bar, which gets 
smaller on scroll
This commit is contained in:
Matthew Grove
2018-11-19 21:00:23 +00:00
parent 4df4919627
commit e93647e4be
3 changed files with 86 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
page-inserts/top-app-bar.html
View File

@@ -1,7 +1,21 @@
<div class="mdc-top-app-bar__row">
<!-- <div class="mdc-top-app-bar__row">
<section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start">
<a href="javascript:void(0);" class="material-icons mdc-top-app-bar__navigation-icon">menu</a>
<span class="mdc-top-app-bar__title">BBC School Report | Reading School</span>
<img src="/images/logo-white.png" style="height:48px;width:auto;position:relative;right:0;"/>
</section>
</div>
<section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end" role="toolbar">
<a href="#" class="material-icons mdc-top-app-bar__action-item" aria-label="Bookmark this page" alt="Bookmark this page">bookmark</a>
<img src="/images/logo-white.png" class="material-icons mdc-top-app-bar__action-item" aria-label="Reading School" alt="Reading School Logo"/>
</section>
</div> -->
<div class="mdc-top-app-bar__row">
<section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start">
<a href="#" class="material-icons mdc-top-app-bar__navigation-icon">menu</a>
<span class="mdc-top-app-bar__title">Title</span>
</section>
<section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end" role="toolbar">
<a href="#" class="material-icons mdc-top-app-bar__action-item" aria-label="Bookmark this page" alt="Bookmark this page">bookmark</a>
</section>
</div>