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

Jump to bottom

Review and integrate open90: Expand/collapse Treeview and Inspection #233

Closed
wants to merge 55 commits into from
Closed

Review and integrate open90: Expand/collapse Treeview and Inspection #233

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
55 commits
Select commit Hold shift + click to select a range
821a1a4
[Production] Updated symbols font to v25
charlesh88 Oct 14, 2015
be79c10
[Frontend] Added new glyph
charlesh88 Oct 20, 2015
b98c1cd
[Frontend] Manual re-do of collapse/expand panes
charlesh88 Oct 22, 2015
4f27104
[Frontend] Manual re-do of collapse/expand panes
charlesh88 Oct 22, 2015
536d561
[Frontend] Manual re-do of collapse/expand panes
charlesh88 Oct 23, 2015
bf17b77
Merge remote-tracking branch 'github/prod-uisymbols' into open90
charlesh88 Oct 23, 2015
3687cc5
[Frontend] Manual re-do of collapse/expand panes
charlesh88 Oct 23, 2015
57f11a9
[Frontend] Manual re-do of collapse/expand panes
charlesh88 Oct 23, 2015
827e1af
[Frontend] Manual re-do of collapse/expand panes
charlesh88 Oct 23, 2015
a283a2a
[Frontend] Manual re-do of collapse/expand panes
charlesh88 Oct 23, 2015
0c4d422
[Frontend] Manual re-do of collapse/expand panes
charlesh88 Oct 23, 2015
2452b25
[Frontend] Manual integration of Inspector
charlesh88 Oct 23, 2015
1d3870d
[Frontend] Manual integration of Inspector
charlesh88 Oct 23, 2015
a7ea4c3
[Frontend] Inspector styling, in progress
charlesh88 Oct 23, 2015
efd2098
[Frontend] Inspector styling, in progress
charlesh88 Oct 23, 2015
17b3378
[Frontend] Expand/collapse styling
charlesh88 Oct 23, 2015
aa3cf70
[Frontend] Expand/collapse styling
charlesh88 Oct 24, 2015
94649b1
[Frontend] Splitter re-styling
charlesh88 Oct 24, 2015
85809ae
[Frontend] Fixed mini-tab positioning algorithm
charlesh88 Oct 25, 2015
99c977c
[Frontend] Fixed mini-tab positioning algorithm
charlesh88 Oct 25, 2015
8ee4fc9
[Frontend] Fixed spacing of panes and mini-tabs
charlesh88 Oct 25, 2015
fd582d4
Frontend] More refining of collapsing treeview
charlesh88 Oct 26, 2015
7d42292
Frontend] More refining of collapsing treeview
charlesh88 Oct 26, 2015
f655346
Frontend] More refining of collapsing treeview
charlesh88 Oct 26, 2015
77a1a90
Frontend] Normalizing styles for items and l-icon-link
charlesh88 Oct 26, 2015
498f854
Frontend] Treeview expand/collapse anim timing tweaks
charlesh88 Oct 26, 2015
daed6a5
Frontend] Tweaked sizes of mini-tabs and pane collapsed edge margin
charlesh88 Oct 26, 2015
0a19ab4
Merging in latest github/master
charlesh88 Oct 28, 2015
fc704b8
[Frontend] Fixed and finessed mobile expand collapse
charlesh88 Oct 28, 2015
134d853
[Frontend] type-icon evolving to universal t-item-icon
charlesh88 Oct 28, 2015
56e8cd8
[Frontend] Refinements to t-item-icon
charlesh88 Oct 29, 2015
bb0e27c
[Frontend] Restored erroneously checked in bundles.json;
charlesh88 Oct 29, 2015
11ca39b
[Frontend] t-item-icon
charlesh88 Oct 29, 2015
59b24d9
[Frontend] Tweaks to splitter-related SASS
charlesh88 Oct 29, 2015
660e9f0
[Frontend] Fixed color of menu-item divider items;
charlesh88 Oct 29, 2015
f51230b
[Frontend] Fixed erroneous classes wrapping Create button;
charlesh88 Oct 29, 2015
a0c6ddf
[Frontend] Removed unused mini-tab-icon class
charlesh88 Oct 29, 2015
1b0ce71
[Frontend] Bring in new collapse left and right pane symbols
charlesh88 Oct 29, 2015
8c4fdf5
[Frontend] Expand/collapse finessing
charlesh88 Oct 29, 2015
ddebbf1
[Frontend] Expand/collapse finessing
charlesh88 Oct 29, 2015
1dbd721
[Frontend] Significant mods to main layout strategy
charlesh88 Oct 30, 2015
675c5be
[Frontend] Tweaks to splitter edge shdw
charlesh88 Oct 30, 2015
b5b6546
[Frontend] Significant change to look and behavior of mini-tabs
charlesh88 Oct 30, 2015
c913f17
[Frontend] Safety merge of master; minor fixes
charlesh88 Oct 31, 2015
fe8d9f6
[Frontend] Mobile and margin tweaks
charlesh88 Oct 31, 2015
64c6ef6
[Frontend] Tweaks in Inspector
charlesh88 Oct 31, 2015
141a54c
[Frontend] Tweaks in Inspector
charlesh88 Oct 31, 2015
f7588d5
[Frontend] Added crosshair symbol for inspect
charlesh88 Nov 2, 2015
648cdcc
Updated crosshair symbol for inspect
charlesh88 Nov 2, 2015
fe12cde
[Frontend] Added icon to Inspector header
charlesh88 Nov 2, 2015
c8848b5
[Frontend] Tweaked spacing in Inspector header
charlesh88 Nov 2, 2015
09be193
Resolved CSS conflicts
charlesh88 Nov 3, 2015
9037787
Fixed missing window reference causing test to fail
charlesh88 Nov 4, 2015
2c7c7b9
Fixed JS var placement causing mvn to fail
charlesh88 Nov 4, 2015
63798ff
[Merge] Merge master-m-open90 back into open90
charlesh88 Nov 4, 2015
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
Prev Previous commit
Next Next commit
[Frontend] Refinements to t-item-icon 
open #90
Scale approach to link indicator changed from
font-size to transform: scale;
Now works in tree, item grid and Inspector;
  • Loading branch information
@charlesh88
charlesh88 committed Oct 29, 2015
commit 56e8cd81e6b01186d61ddfe2078654537a2bfafd
2 changes: 1 addition & 1 deletion bundles.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
"platform/commonUI/general",
"platform/commonUI/inspect",
"platform/commonUI/mobile",
"platform/commonUI/themes/espresso",
"platform/commonUI/themes/snow",
"platform/containment",
"platform/execution",
"platform/telemetry",
Expand Down
3 changes: 2 additions & 1 deletion platform/commonUI/general/res/sass/_constants.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -61,7 +61,8 @@ $ueBrowseGridItemBottomBarH: 30px;
$itemPadLR: 5px;
// Tree
$treeVCW: 10px;
$treeTypeIconH: 16px;
$treeTypeIconH: 1.4em; // was 16px
$treeTypeIconHPx: 16px;
$treeTypeIconW: 20px;
$treeContextTriggerW: 20px;
// Tabular
Expand Down
12 changes: 6 additions & 6 deletions platform/commonUI/general/res/sass/_icons.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -86,18 +86,18 @@
@extend .ui-symbol;
@extend .icon;
display: inline-block;
line-height: normal; // This is Ok for the symbolsfont
position: relative;
&.l-icon-link {
&:before {
color: $colorIconLink;
height: 30%; width: auto;
line-height: normal;
content: "\f4";
height: auto; width: auto;
position: absolute;
font-size: 0.35em;
left: 0px;
bottom: 10%;
left: 0; top: 0; right: 0; bottom: 0;
@include transform-origin(bottom, left);
@include transform(scale(0.3));
z-index: 2;
content: "\f4";
}
}
}
5 changes: 1 addition & 4 deletions platform/commonUI/general/res/sass/_mixins.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -349,10 +349,7 @@
/* This doesn't work on an element inside an element with absolute positioning that has height: auto */
//position: relative;
top: 50%;
@include webkitProp(transform, translateY(-50%));
//-webkit-transform: translateY(-50%);
//-ms-transform: translateY(-50%);
//transform: translateY(-50%);
@include transform(translateY(-50%));
}

@mixin verticalCenterBlock($holderH, $itemH) {
Expand Down
20 changes: 11 additions & 9 deletions platform/commonUI/general/res/sass/tree/_tree.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -66,25 +66,27 @@ ul.tree {
line-height: $menuLineH;

.t-item-icon {
$d: $treeTypeIconH; // 16px is crisp size
@include txtShdwSubtle($shdwItemTreeIcon);
font-size: $d;
font-size: $treeTypeIconH;
color: $colorItemTreeIcon;
position: absolute;
left: $interiorMargin; right: auto; width: $d;
left: $interiorMargin;
top: 50%;
width: $treeTypeIconH;
@include transform(translateY(-50%));
}

.type-icon {
//@include absPosDefault(0, false);
$d: $treeTypeIconH; // 16px is crisp size
$d: $treeTypeIconH;
@include txtShdwSubtle($shdwItemTreeIcon);
font-size: $d;
font-size: $treeTypeIconH;
color: $colorItemTreeIcon;
left: $interiorMargin;
position: absolute;
@include verticalCenterBlock($menuLineHPx, $d);
@include verticalCenterBlock($menuLineHPx, $treeTypeIconHPx);
line-height: 100%;
right: auto; width: $d;
right: auto; width: $treeTypeIconH;

.icon {
&.l-icon-link,
Expand Down Expand Up @@ -123,7 +125,7 @@ ul.tree {
.view-control {
color: $colorItemTreeSelectedVC;
}
.label .type-icon {
.t-object-label .t-item-icon {
color: $colorItemTreeSelectedFg; //$colorItemTreeIconHover;
}
}
Expand All @@ -134,7 +136,7 @@ ul.tree {
&:hover {
background: $colorItemTreeHoverBg;
color: $colorItemTreeHoverFg;
.icon {
.t-item-icon {
color: $colorItemTreeIconHover;
}
}
Expand Down
92 changes: 52 additions & 40 deletions platform/commonUI/themes/espresso/res/css/theme-espresso.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -658,19 +658,28 @@ mct-container {
/* line 84, ../../../../general/res/sass/_icons.scss */
.t-item-icon {
display: inline-block;
line-height: normal;
position: relative; }
/* line 91, ../../../../general/res/sass/_icons.scss */
/* line 92, ../../../../general/res/sass/_icons.scss */
.t-item-icon.l-icon-link:before {
color: #49dedb;
height: 30%;
content: "\f4";
height: auto;
width: auto;
line-height: normal;
position: absolute;
font-size: 0.35em;
left: 0px;
bottom: 10%;
z-index: 2;
content: "\f4"; }
left: 0;
top: 0;
right: 0;
bottom: 0;
-moz-transform-origin: bottom left;
-ms-transform-origin: bottom left;
-webkit-transform-origin: bottom left;
transform-origin: bottom left;
-moz-transform: scale(0.3);
-ms-transform: scale(0.3);
-webkit-transform: scale(0.3);
transform: scale(0.3);
z-index: 2; }

/* line 13, ../../../../general/res/sass/_limits.scss */
.s-limit-red {
Expand Down Expand Up @@ -5065,19 +5074,23 @@ ul.tree {
.search-result-item .label .t-item-icon,
.search-result-item .t-object-label .t-item-icon {
text-shadow: rgba(0, 0, 0, 0.6) 0 1px 2px;
font-size: 16px;
font-size: 1.4em;
color: #0099cc;
position: absolute;
left: 5px;
right: auto;
width: 16px; }
/* line 77, ../../../../general/res/sass/tree/_tree.scss */
top: 50%;
width: 1.4em;
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
transform: translateY(-50%); }
/* line 79, ../../../../general/res/sass/tree/_tree.scss */
.tree-item .label .type-icon,
.tree-item .t-object-label .type-icon,
.search-result-item .label .type-icon,
.search-result-item .t-object-label .type-icon {
text-shadow: rgba(0, 0, 0, 0.6) 0 1px 2px;
font-size: 16px;
font-size: 1.4em;
color: #0099cc;
left: 5px;
position: absolute;
Expand All @@ -5086,8 +5099,8 @@ ul.tree {
height: 16px;
line-height: 100%;
right: auto;
width: 16px; }
/* line 90, ../../../../general/res/sass/tree/_tree.scss */
width: 1.4em; }
/* line 92, ../../../../general/res/sass/tree/_tree.scss */
.tree-item .label .type-icon .icon.l-icon-link, .tree-item .label .type-icon .l-icon-link.t-item-icon, .tree-item .label .type-icon .icon.l-icon-alert, .tree-item .label .type-icon .l-icon-alert.t-item-icon,
.tree-item .t-object-label .type-icon .icon.l-icon-link,
.tree-item .t-object-label .type-icon .l-icon-link.t-item-icon,
Expand All @@ -5103,7 +5116,7 @@ ul.tree {
.search-result-item .t-object-label .type-icon .l-icon-alert.t-item-icon {
position: absolute;
z-index: 2; }
/* line 95, ../../../../general/res/sass/tree/_tree.scss */
/* line 97, ../../../../general/res/sass/tree/_tree.scss */
.tree-item .label .type-icon .icon.l-icon-alert, .tree-item .label .type-icon .l-icon-alert.t-item-icon,
.tree-item .t-object-label .type-icon .icon.l-icon-alert,
.tree-item .t-object-label .type-icon .l-icon-alert.t-item-icon,
Expand All @@ -5118,7 +5131,7 @@ ul.tree {
width: 8px;
top: 1px;
right: -2px; }
/* line 101, ../../../../general/res/sass/tree/_tree.scss */
/* line 103, ../../../../general/res/sass/tree/_tree.scss */
.tree-item .label .type-icon .icon.l-icon-link, .tree-item .label .type-icon .l-icon-link.t-item-icon,
.tree-item .t-object-label .type-icon .icon.l-icon-link,
.tree-item .t-object-label .type-icon .l-icon-link.t-item-icon,
Expand All @@ -5133,7 +5146,7 @@ ul.tree {
width: 8px;
left: -3px;
bottom: 0px; }
/* line 109, ../../../../general/res/sass/tree/_tree.scss */
/* line 111, ../../../../general/res/sass/tree/_tree.scss */
.tree-item .label .title-label,
.tree-item .label .t-title-label,
.tree-item .t-object-label .title-label,
Expand All @@ -5155,48 +5168,47 @@ ul.tree {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap; }
/* line 120, ../../../../general/res/sass/tree/_tree.scss */
/* line 122, ../../../../general/res/sass/tree/_tree.scss */
.tree-item.selected,
.search-result-item.selected {
background: #006080;
color: #cccccc; }
/* line 123, ../../../../general/res/sass/tree/_tree.scss */
/* line 125, ../../../../general/res/sass/tree/_tree.scss */
.tree-item.selected .view-control,
.search-result-item.selected .view-control {
color: rgba(255, 255, 255, 0.3); }
/* line 126, ../../../../general/res/sass/tree/_tree.scss */
.tree-item.selected .label .type-icon,
.search-result-item.selected .label .type-icon {
/* line 128, ../../../../general/res/sass/tree/_tree.scss */
.tree-item.selected .t-object-label .t-item-icon,
.search-result-item.selected .t-object-label .t-item-icon {
color: #cccccc; }
@media screen and (min-device-width: 800px) and (min-device-height: 1025px), screen and (min-device-width: 1025px) and (min-device-height: 800px) {
/* line 134, ../../../../general/res/sass/tree/_tree.scss */
/* line 136, ../../../../general/res/sass/tree/_tree.scss */
.tree-item:not(.selected):hover,
.search-result-item:not(.selected):hover {
background: rgba(153, 153, 153, 0.1);
color: #cccccc; }
/* line 137, ../../../../general/res/sass/tree/_tree.scss */
.tree-item:not(.selected):hover .icon, .tree-item:not(.selected):hover .t-item-icon,
.search-result-item:not(.selected):hover .icon,
/* line 139, ../../../../general/res/sass/tree/_tree.scss */
.tree-item:not(.selected):hover .t-item-icon,
.search-result-item:not(.selected):hover .t-item-icon {
color: #33ccff; } }
/* line 144, ../../../../general/res/sass/tree/_tree.scss */
/* line 146, ../../../../general/res/sass/tree/_tree.scss */
.tree-item:not(.loading),
.search-result-item:not(.loading) {
cursor: pointer; }
/* line 148, ../../../../general/res/sass/tree/_tree.scss */
/* line 150, ../../../../general/res/sass/tree/_tree.scss */
.tree-item .context-trigger,
.search-result-item .context-trigger {
top: -1px;
position: absolute;
right: 3px; }
/* line 153, ../../../../general/res/sass/tree/_tree.scss */
/* line 155, ../../../../general/res/sass/tree/_tree.scss */
.tree-item .context-trigger .invoke-menu,
.search-result-item .context-trigger .invoke-menu {
font-size: 0.75em;
height: 0.9rem;
line-height: 0.9rem; }

/* line 162, ../../../../general/res/sass/tree/_tree.scss */
/* line 164, ../../../../general/res/sass/tree/_tree.scss */
.tree-item .t-object-label {
left: 15px; }

Expand Down Expand Up @@ -6511,7 +6523,7 @@ table {
font-size: 30px;
left: 15px;
line-height: normal; }
/* line 66, ../../../../general/res/sass/mobile/_item.scss */
/* line 58, ../../../../general/res/sass/mobile/_item.scss */
.items-holder .item.grid-item .item-main .item-open {
display: block;
opacity: 1;
Expand All @@ -6521,40 +6533,40 @@ table {
/* line 29, ../../../../general/res/sass/mobile/_item.scss */
.items-holder .item.grid-item {
height: 50px; }
/* line 79, ../../../../general/res/sass/mobile/_item.scss */
/* line 71, ../../../../general/res/sass/mobile/_item.scss */
.items-holder .item.grid-item .bar.top-bar {
line-height: 50px !important; }
/* line 83, ../../../../general/res/sass/mobile/_item.scss */
/* line 75, ../../../../general/res/sass/mobile/_item.scss */
.items-holder .item.grid-item .bar.bottom-bar {
top: 7px;
bottom: auto;
height: 35px; }
/* line 88, ../../../../general/res/sass/mobile/_item.scss */
/* line 80, ../../../../general/res/sass/mobile/_item.scss */
.items-holder .item.grid-item .item-main .item-type {
top: 10px;
bottom: auto;
height: 30px; }
/* line 91, ../../../../general/res/sass/mobile/_item.scss */
/* line 83, ../../../../general/res/sass/mobile/_item.scss */
.items-holder .item.grid-item .item-main .item-open {
line-height: 50px; } }
@media screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) {
/* line 29, ../../../../general/res/sass/mobile/_item.scss */
.items-holder .item.grid-item {
height: 66px; }
/* line 101, ../../../../general/res/sass/mobile/_item.scss */
/* line 93, ../../../../general/res/sass/mobile/_item.scss */
.items-holder .item.grid-item .bar.top-bar {
line-height: 66px !important; }
/* line 105, ../../../../general/res/sass/mobile/_item.scss */
/* line 97, ../../../../general/res/sass/mobile/_item.scss */
.items-holder .item.grid-item .bar.bottom-bar {
top: 15px;
bottom: auto;
height: 35px; }
/* line 110, ../../../../general/res/sass/mobile/_item.scss */
/* line 102, ../../../../general/res/sass/mobile/_item.scss */
.items-holder .item.grid-item .item-main .item-type {
top: 18px;
bottom: auto;
height: 30px; }
/* line 113, ../../../../general/res/sass/mobile/_item.scss */
/* line 105, ../../../../general/res/sass/mobile/_item.scss */
.items-holder .item.grid-item .item-main .item-open {
line-height: 66px; } }

Expand Down
Loading