Hide the top Toolbar in News column » History » Version 1
Anonymous, 17/04/2015 19:26
| 1 | 1 | Anonymous | h1. Hide the top Toolbar in News column |
|---|---|---|---|
| 2 | 1 | Anonymous | |
| 3 | 1 | Anonymous | If only one flux of News is associated with a project, the top Toolbar in the News column might look useless (no different Feeds to select). |
| 4 | 1 | Anonymous | |
| 5 | 1 | Anonymous | To hide this component, it could be associated with a specific CSS class which just creates an empty, gray bar. |
| 6 | 1 | Anonymous | |
| 7 | 1 | Anonymous | The ExtJs file to edit is: |
| 8 | 1 | Anonymous | |
| 9 | 1 | Anonymous | source:git_sitools_idoc|szcluster-db/workspace/client-user/js/modules/feedsReader/feedReaderProject.js@5d330f93#L76 |
| 10 | 1 | Anonymous | |
| 11 | 1 | Anonymous | <pre><code class="js"> |
| 12 | 1 | Anonymous | this.tbar = { |
| 13 | 1 | Anonymous | xtype : 'toolbar', |
| 14 | 1 | Anonymous | cls : 'services-toolbar-feeds', |
| 15 | 1 | Anonymous | defaults : { |
| 16 | 1 | Anonymous | scope : this, |
| 17 | 1 | Anonymous | cls : 'services-toolbar-btn' |
| 18 | 1 | Anonymous | }, |
| 19 | 1 | Anonymous | items : [ this.cb, '-' , this.buttonDate] |
| 20 | 1 | Anonymous | }; |
| 21 | 1 | Anonymous | </code></pre> |
| 22 | 1 | Anonymous | |
| 23 | 1 | Anonymous | In this case, the toolbar has been associated with the new CSS class @services-toolbar-feeds@. This class should then be defined in: |
| 24 | 1 | Anonymous | |
| 25 | 1 | Anonymous | source:git_sitools_idoc|szcluster-db/workspace/client-user/js/components/dataviews/services/servicesToolbar.css@5d330f93#L32 |
| 26 | 1 | Anonymous | |
| 27 | 1 | Anonymous | <pre><code class="css"> |
| 28 | 1 | Anonymous | .services-toolbar-feeds { |
| 29 | 1 | Anonymous | visibility: hidden; |
| 30 | 1 | Anonymous | border-bottom-color: #d0d0d0; |
| 31 | 1 | Anonymous | height: 15px; |
| 32 | 1 | Anonymous | } |
| 33 | 1 | Anonymous | </code></pre> |
| 34 | 1 | Anonymous | |
| 35 | 1 | Anonymous | |
| 36 | 1 | Anonymous | In addition, in order to make the toolbar as hight as the header bar of the project modules pages, it might be necessary to change the height of the generic class @x-toolbar@ (the original value is commented): |
| 37 | 1 | Anonymous | |
| 38 | 1 | Anonymous | source:git_sitools_idoc|szcluster-db/cots/extjs/resources/css/xtheme-gray-custom.css@5d330f93#L2287 |
| 39 | 1 | Anonymous | |
| 40 | 1 | Anonymous | <pre><code class="css"> |
| 41 | 1 | Anonymous | /** ENDTOOLBAR BUTTON **/ |
| 42 | 1 | Anonymous | |
| 43 | 1 | Anonymous | .x-panel-tbar-noheader .x-toolbar, .x-panel-mc .x-panel-tbar .x-toolbar { |
| 44 | 1 | Anonymous | border : none; |
| 45 | 1 | Anonymous | height: 21px;/*35px;*/ |
| 46 | 1 | Anonymous | } |
| 47 | 1 | Anonymous | </code></pre> |
| 48 | 1 | Anonymous | |
| 49 | 1 | Anonymous | |
| 50 | 1 | Anonymous | The Feed toolbar will look like: |
| 51 | 1 | Anonymous | |
| 52 | 1 | Anonymous | !feed_top_gray_toolbar.png! |