SAP/abapGit
1
0
Fork 0
mirror of https://github.com/abapGit/abapGit.git synced 2025-05-01 12:20:51 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

dropdown hover forgiving zones #453

Browse Source
This commit is contained in:
sbcgua 2016-11-23 14:38:09 +02:00
parent 7ccadba1bc
commit e4b3f7343a
3 changed files with 55 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
src/zabapgit_html.prog.abap
View File

@ -217,6 +217,7 @@ CLASS lcl_html_toolbar DEFINITION FINAL.
iv_sort TYPE abap_bool OPTIONAL
iv_as_angle TYPE abap_bool OPTIONAL
iv_with_icons TYPE abap_bool OPTIONAL
iv_add_minizone TYPE abap_bool OPTIONAL
RETURNING
VALUE(ro_html) TYPE REF TO lcl_html_helper.
@ -296,13 +297,23 @@ CLASS lcl_html_toolbar IMPLEMENTATION.
ENDIF.
ro_html->add( |<a class="{ lv_class }">{ iv_as_droplist_with_label }</a>| ).
ENDIF.
IF iv_add_minizone = abap_true.
ro_html->add( '<div class="minizone"></div>' ).
ENDIF.
ro_html->add( '<div class="dropdown_content">' ).
ro_html->add( '<div class="box">' ).
ENDIF.
IF iv_sort = abap_true.
SORT mt_items BY txt ASCENDING AS TEXT.
ENDIF.
IF iv_with_icons = abap_true.
ro_html->add( '<table>' ).
ENDIF.
LOOP AT mt_items ASSIGNING <ls_item>.
lv_last = boolc( sy-tabix = lines( mt_items ) ).
@ -315,7 +326,7 @@ CLASS lcl_html_toolbar IMPLEMENTATION.
ENDIF.
IF iv_with_icons = abap_true.
ro_html->add( '<table><tr>' ).
ro_html->add( '<tr>' ).
ro_html->add( |<td class="icon">{ <ls_item>-ico }</td>| ).
ro_html->add( '<td width="100%">' ).
ENDIF.
@ -328,7 +339,7 @@ CLASS lcl_html_toolbar IMPLEMENTATION.
IF iv_with_icons = abap_true.
ro_html->add( '</td>' ).
ro_html->add( '</tr></table>' ).
ro_html->add( '</tr>' ).
ENDIF.
ELSE.
@ -339,8 +350,12 @@ CLASS lcl_html_toolbar IMPLEMENTATION.
ENDLOOP.
IF iv_with_icons = abap_true.
ro_html->add( '</table>' ).
ENDIF.
IF lv_is_drop = abap_true. " Dropdown
ro_html->add( '</div>' ).
ro_html->add( '</div></div>' ).
ENDIF.
ro_html->add( '</div>' ).

47
src/zabapgit_page.prog.abap
View File

@ -380,6 +380,7 @@ CLASS lcl_gui_page_super IMPLEMENTATION.
_add '.right { text-align:right; }'.
_add '.paddings { padding: 0.5em 0.5em; }'.
_add '.pad-sides { padding: 0 0.3em; }'.
_add '.pad4px { padding: 4px; }'.
" Structure div styles: header, footer, toc
_add '/* STRUCTURE DIVS, HEADER & FOOTER */'.
@ -443,7 +444,7 @@ CLASS lcl_gui_page_super IMPLEMENTATION.
_add ' font-size: 12pt;'.
_add '}'.
" Drop down styles
" Dropdown styles :mechanics
_add '/*DROP DOWN*/'.
_add '.dropdown {'.
_add ' position: relative;'.
@ -466,31 +467,47 @@ CLASS lcl_gui_page_super IMPLEMENTATION.
_add ' display: none;'.
_add ' z-index: 1;'.
_add ' position: absolute;'.
_add ' right: 0;'.
* _add ' top: 1.1em; /*IE7 woraround*/'.
_add ' background-color: #f9f9f9;'.
_add ' right: -12px;'.
_add ' top: 1em;'.
_add ' padding: 6px 10px 10px 10px;'.
_add ' white-space: nowrap;'.
* _add ' min-width: 10em;'.
_add ' border-bottom: 1px solid lightgrey;'.
_add '}'.
_add '.dropdown div.minizone {'.
_add ' display: none;'.
_add ' z-index: 1;'.
_add ' position: absolute;'.
_add ' padding: 0px;'.
_add ' width: 16px;'.
_add ' height: 16px;'.
_add ' bottom: 0px;'.
_add ' left: -16px;'.
_add '}'.
_add '.dropdown:hover .dropdown_content { display: block; }'.
_add '.dropdown:hover .minizone { display: block; }'.
" Dropdown styles :styling
_add '.dropdown_content a {'.
_add ' padding: 0.2em;'.
_add ' background-color: #f9f9f9;'.
_add ' text-decoration: none;'.
_add ' display: block;'.
_add ' border: none !important;'.
_add '}'.
_add '.dropdown_content td {'. " TODO refactor
_add ' text-align: left;'.
_add '}'.
_add '.dropdown_content td a {'. " TODO refactor
_add ' padding: 0em 0.2em;'.
_add '}'.
_add '.dropdown_content td.icon {'. " TODO refactor
_add ' padding: 0 3px 0 6px;'.
_add '.dropdown_content div.box {'.
_add ' border-bottom: 1px solid #C0C0C0;'.
_add ' border-right: 1px solid #C0C0C0;'.
_add ' background-color: #f9f9f9;'.
_add ' padding: 2px;'.
_add '}'.
_add '.dropdown_content td { text-align: left; padding: 2px; }'. " TODO refactor
_add '.dropdown_content td a { padding: 0em 0.2em; }'. " TODO refactor
_add '.dropdown_content td.icon { padding: 0 3px 0 6px; }'. " TODO refactor
_add '.dropdown_content a:hover { background-color: #f1f1f1 }'.
_add '.dropdown:hover .dropdown_content { display: block; }'.
_add '.dropdown:hover .dropbtn { color: #79a0d2; }'.
" REPOSITORY

6
src/zabapgit_page_main.prog.abap
View File

@ -267,9 +267,11 @@ CLASS lcl_gui_page_main IMPLEMENTATION.
ro_html->add( '</td>' ).
ro_html->add( '<td class="right">' ).
ro_html->add( lo_allbar->render( iv_as_droplist_with_label = '<img src="img/burger">'
ro_html->add( lo_allbar->render(
iv_as_droplist_with_label = '<img class="pad4px" src="img/burger">'
iv_sort = abap_true
iv_with_icons = abap_true ) ).
iv_with_icons = abap_true
iv_add_minizone = abap_true ) ).
ro_html->add( '</td>' ).
ro_html->add( '</tr></table>' ).