Skip to content

Commit 1f7fc67

Browse files
author
Jonathan Harper
committed
Fix to gnarly CSS issues
1 parent f04345b commit 1f7fc67

File tree

5 files changed

+53
-65
lines changed

5 files changed

+53
-65
lines changed

Diff for: ‎display.css

+29-52
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,35 @@
33
font-size: 8pt;
44
}
55

6+
#wrapper {
7+
width: 100%;
8+
float:left;
9+
margin-right: -180px;
10+
}
11+
12+
#sidebar {
13+
background-color: #F5F5F5;
14+
position: relative;
15+
float: right;
16+
width: 180px;
17+
right: 180px;
18+
margin-right: -180px;
19+
overflow-y: auto;
20+
padding: 5px;
21+
border-left: 1px solid grey;
22+
}
23+
24+
#page-content-wrapper {
25+
float: left;
26+
width: 100%;
27+
}
28+
29+
#page-content {
30+
margin-right: 180px;
31+
overflow-y: auto;
32+
}
33+
34+
635
.mapCol {
736
float: left;
837
width: 50%;
@@ -180,11 +209,6 @@ ul.dropdown-menu {
180209
color: red;
181210
}
182211

183-
#wrapper {
184-
/*padding-right: 190px;*/
185-
padding-right: 0;
186-
transition: all 0.4s ease 0s;
187-
}
188212

189213
div.mapping-group {
190214
overflow-y: auto;
@@ -196,58 +220,11 @@ div.mapping-group {
196220
background-color: #F5F5F5;
197221
}
198222

199-
#sidebar-wrapper {
200-
margin-right: -180px;
201-
right: 180px;
202-
width: 180px;
203-
background-color: #F5F5F5;
204-
position: fixed;
205-
height: 100%;
206-
overflow-y: auto;
207-
z-index: 1000;
208-
transition: all 0.4s ease 0s;
209-
padding: 3px;
210-
border-left: 1px solid grey;
211-
}
212-
213-
#page-content-wrapper {
214-
padding-left: 5px;
215-
padding-top: 5px;
216-
width: 100%;
217-
}
218-
219-
.page-content {
220-
margin-right: 180px;
221-
}
222-
223223
.sidebar-nav {
224224
position: absolute;
225225
top: 0;
226226
width: 180px;
227227
list-style: none;
228228
margin: 0;
229229
padding: 0;
230-
}
231-
232-
@media (max-width:367px) {
233-
234-
#wrapper {
235-
padding-left: 0;
236-
}
237-
238-
#sidebar-wrapper {
239-
left: 0;
240-
}
241-
242-
#wrapper.active {
243-
position: relative;
244-
left: 300px;
245-
}
246-
247-
#wrapper.active #sidebar-wrapper {
248-
left: 300px;
249-
width: 300px;
250-
transition: all 0.4s ease 0s;
251-
}
252-
253230
}

Diff for: ‎display.html

+11-8
Original file line numberDiff line numberDiff line change
@@ -8,10 +8,12 @@
88
<link rel="stylesheet" type="text/css" href="node_modules/bootstrap/dist/css/bootstrap.css"/>
99
<script src="node_modules/jquery/dist/jquery.js"></script>
1010
<script src="node_modules/bootstrap/dist/js/bootstrap.js"></script>
11+
<script src="js/layout_fixer.js"></script>
1112
<script src="dist/app.js"></script>
1213

1314
</head>
1415
<body>
16+
1517
<span ng-controller="DataLoadingController">
1618
<div id="loading-screen"
1719
ng-if="visDataService.dataLoading.val"
@@ -20,15 +22,16 @@
2022
</div>
2123
</span>
2224

23-
<div id="wrapper">
24-
<div id="sidebar-wrapper">
25-
<span ng-include src="'partials/mappingsList.html'"></span>
26-
</div>
27-
<div id="page-content-wrapper">
28-
<div class="page-content">
29-
<div ng-include src="'partials/dataTable.html'"></div>
30-
</div>
25+
26+
27+
28+
<div id="page-content-wrapper">
29+
<div id="page-content">
30+
<div ng-include src="'partials/dataTable.html'"></div>
3131
</div>
3232
</div>
33+
<div id="sidebar">
34+
<span ng-include src="'partials/mappingsList.html'"></span>
35+
</div>
3336
</body>
3437
</html>

Diff for: ‎js/layout_fixer.js

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
$(document).ready(function() {
2+
var currHeight = $(window).height();
3+
$('#sidebar, #page-content').css('height', currHeight);
4+
$(window).resize(function () {
5+
var currHeight = $(window).height();
6+
$('#sidebar, #page-content').css('height', currHeight);
7+
});
8+
});

Diff for: ‎manifest.json

+3-3
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@
55
"description": "This extension allows the user to deconstruct D3 visualizations on a page.",
66
"version": "1.0",
77
"icons": {
8-
"16": "d3logo.png",
9-
"128": "d3logo.png"
8+
"16": "decon-icon.png",
9+
"128": "decon-icon.png"
1010
},
1111

1212
"content_scripts": [
@@ -22,7 +22,7 @@
2222
},
2323

2424
"browser_action": {
25-
"default_icon": "d3logo.png",
25+
"default_icon": "decon-icon.png",
2626
"default_title": "D3 Deconstructor"
2727
},
2828

Diff for: ‎partials/mappingsList.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,12 @@
22
<span class="sectionHeader">Mappings:</span>
33
<div class="panel-group" id="mappings" ng-repeat="mapping in data[selectedSchema.val].mappings">
44
<div class="panel panel-default">
5-
<div ng-if="!isLinear(mapping)" class="nominal panel-heading btn-toolbar">
5+
<div ng-if="!isLinear(mapping)" class="nominal panel-heading">
66
<a data-toggle="collapse" style="color:black;" data-parent="#mappings" href="#mapping{{$index}}">
77
{{mapping.data}} &#10141; {{mapping.attr}}
88
</a>
99
</div>
10-
<div ng-if="isLinear(mapping)" class="linear panel-heading btn-toolbar">
10+
<div ng-if="isLinear(mapping)" class="linear panel-heading">
1111
<a data-toggle="collapse" style="color:black;" data-parent="#mappings" href="#mapping{{$index}}">
1212
<span ng-repeat="datum in mapping.data">{{datum}}<span ng-if="!$last">,</span> </span> &#10141; {{mapping.attr}}
1313
</a>

0 commit comments

Comments
 (0)