diff --git a/src/atlasViewer/atlasViewer.component.ts b/src/atlasViewer/atlasViewer.component.ts
index cbb974e796c0d419a70140299671dd77ddeba8c0..c220280cf6e8e3619d89bbb45e5f0d6251beae87 100644
--- a/src/atlasViewer/atlasViewer.component.ts
+++ b/src/atlasViewer/atlasViewer.component.ts
@@ -39,7 +39,6 @@ export class AtlasViewer implements OnDestroy, OnInit, AfterViewInit {
@ViewChild('cookieAgreementComponent', {read: TemplateRef}) cookieAgreementComponent : TemplateRef<any>
@ViewChild('kgToS', {read: TemplateRef}) kgTosComponent: TemplateRef<any>
@ViewChild(LayoutMainSide) layoutMainSide: LayoutMainSide
- @ViewChild('dockedContainer', {read: ViewContainerRef}) dockedContainer: ViewContainerRef
@ViewChild(NehubaContainer) nehubaContainer: NehubaContainer
@@ -338,7 +337,6 @@ export class AtlasViewer implements OnDestroy, OnInit, AfterViewInit {
}
})
})
- this.widgetServices.dockedContainer = this.dockedContainer
this.onhoverSegmentForFixed$ = this.rClContextualMenu.onShow.pipe(
withLatestFrom(this.onhoverSegment$),
diff --git a/src/atlasViewer/atlasViewer.template.html b/src/atlasViewer/atlasViewer.template.html
index a08b77900a2a2e6d0aaf60f457509b369c14a060..205d21f7fe4231bc9d960ae93a32c8c8e446556c 100644
--- a/src/atlasViewer/atlasViewer.template.html
+++ b/src/atlasViewer/atlasViewer.template.html
@@ -38,8 +38,8 @@
<layer-browser></layer-browser>
</div>
</panel-component>
- <ng-template #dockedContainer>
- </ng-template>
+ <div dockedContainerDirective>
+ </div>
</tab>
</tabset>
diff --git a/src/components/dropdown/dropdown.style.css b/src/components/dropdown/dropdown.style.css
index 4fc671675510d3cd760aeaf5bdd2728503e1f35d..e13bd32eb58f18b15d6de37040e1547df1360f30 100644
--- a/src/components/dropdown/dropdown.style.css
+++ b/src/components/dropdown/dropdown.style.css
@@ -56,24 +56,3 @@ radio-list
overflow-x:hidden;
display:block;
}
-
-.drop-down-open-dark {
- border-width: 1px 1px 0 1px;
- border-style: solid;
- border-color: white
-}
-.drop-down-open-light {
- border-width: 1px 1px 0 1px solid black;
- border-style: solid;
- border-color: black;
-}
-.drop-down-closed-dark {
- border-width: 1px;
- border-style: solid;
- border-color: white
-}
-.drop-down-closed-light {
- border: 1px;
- border-style: solid;
- border-color: black
-}
\ No newline at end of file
diff --git a/src/components/dropdown/dropdown.template.html b/src/components/dropdown/dropdown.template.html
index 165044e39ef8471d513711b645dc47fd442c0081..e448400b8324b98dcfc159263517856732694cfc 100644
--- a/src/components/dropdown/dropdown.template.html
+++ b/src/components/dropdown/dropdown.template.html
@@ -1,3 +1,4 @@
+<!-- TODO remove dependency on ismobile -->
<span
class = "btn btn-default"
[innerHTML] = "activeDisplay(selectedItem)"
@@ -5,18 +6,18 @@
#dropdownToggle
dropdownToggle
- [ngStyle]="{'border': isMobile? '1px solid' : 'none', 'border-color': darktheme? 'white' : 'black', 'border-width': openState? '1px 1px 0 1px' : ''}">
+ [ngStyle]="{'border': isMobile? 'none' : 'none', 'border-color': darktheme? 'white' : 'black', 'border-width': openState? '1px 1px 0 1px' : ''}">
</span>
<!-- needed to ensure dropdown width matches -->
-<ul class="m-0 h-0 o-h">
+<ul class="m-0 h-0 overflow-hidden">
<li *ngFor="let item of inputArray">
{{ listDisplay(item) }}
</li>
</ul>
<radio-list
- [ulClass]="'dropdown-menu'"
+ [ulClass]="'dropdown-menu shadow'"
(itemSelected)="itemSelected.emit($event)"
[listDisplay]="listDisplay"
[selectedItem]="selectedItem"
diff --git a/src/components/radiolist/radiolist.style.css b/src/components/radiolist/radiolist.style.css
index 1d329b0eb4cbfdb8b0cfee42302c7ac7f108eb59..d264f83b0676a602570939980e60c9abc93c2294 100644
--- a/src/components/radiolist/radiolist.style.css
+++ b/src/components/radiolist/radiolist.style.css
@@ -55,8 +55,3 @@ ul,span.dropdown-item-1
white-space: nowrap;
border:none;
}
-
-.radioListBorder {
- border-style: solid;
- border-width: 0px 1px 1px 1px;
-}
\ No newline at end of file
diff --git a/src/components/radiolist/radiolist.template.html b/src/components/radiolist/radiolist.template.html
index 2f0236c6b9373c194a8d8f25ab1290f97e132068..3562d8685015d63191472420e4bf47423df80d5c 100644
--- a/src/components/radiolist/radiolist.template.html
+++ b/src/components/radiolist/radiolist.template.html
@@ -1,5 +1,5 @@
<ul
- [ngClass]="[ulClass, isMobile? 'radioListBorder' : '']"
+ [ngClass]="ulClass"
[ngStyle]="{'opacity': isMobile? '1' : '0.8', 'border-color': darktheme? 'white' : 'black'}"
role="menu">
<li
diff --git a/src/res/css/extra_styles.css b/src/res/css/extra_styles.css
index 6b557d4719eb2bb309afa53c0033dbf7ef779581..a498518957812668c31c71a62e0ae47a88569cc5 100644
--- a/src/res/css/extra_styles.css
+++ b/src/res/css/extra_styles.css
@@ -306,11 +306,6 @@ markdown-dom pre code
transition: all ease 500ms;
}
-.o-h
-{
- overflow:hidden;
-}
-
.h-0
{
height: 0px;
diff --git a/src/ui/databrowserModule/databrowser/databrowser.template.html b/src/ui/databrowserModule/databrowser/databrowser.template.html
index be1302be1b51de651fdfd3d599f882601f4982dd..890576252a034b478ac5b63a642461b46da53349 100644
--- a/src/ui/databrowserModule/databrowser/databrowser.template.html
+++ b/src/ui/databrowserModule/databrowser/databrowser.template.html
@@ -15,11 +15,11 @@
Datasets relevant to
<span
*ngFor="let region of regions"
- class="badge badge-secondary mr-1">
+ class="badge badge-secondary mr-1 mw-100">
<span [ngStyle]="{backgroundColor:getBackgroundColorStyleFromRegion(region)}" class="dot">
</span>
- <span>
+ <span class="d-inline-block mw-100 overflow-hidden text-truncate">
{{ region.name }}
</span>
</span>
@@ -118,13 +118,14 @@
[dataset]="dataset">
<div regionTagsContainer>
+ <!-- TODO may want to separate the region badge into a separate component -->
<span
*ngFor="let region of dataset.parcellationRegion"
- class="badge badge-secondary mr-1">
+ class="badge badge-secondary mr-1 mw-100">
<span [ngStyle]="{backgroundColor:getBackgroundColorStyleFromRegion(region)}" class="dot">
</span>
- <span>
+ <span class="d-inline-block mw-100 overflow-hidden text-truncate">
{{ region.name }}
</span>
</span>