Skip to content

Commit

Permalink
Add scrollbar to Frame component (#147)
Browse files Browse the repository at this point in the history
  • Loading branch information
HansKallekleiv authored Jun 22, 2021
1 parent 559e49e commit 3ac60a4
Show file tree
Hide file tree
Showing 2 changed files with 22 additions and 15 deletions.
31 changes: 19 additions & 12 deletions react/src/lib/components/Layout/Frame/frame.css
Original file line number Diff line number Diff line change
@@ -1,22 +1,29 @@
.webviz-frame {
.webviz-frame, .webviz-frame-no-hover {
border-radius: 5px;
background-color: #F9F9F9;
margin: 10px;
padding: 15px;
position: relative;
box-shadow: 0px 0px 3px 0.5px lightgrey;

}
overflow-x: auto;
overflow-y: auto;
scrollbar-width: thin;
scrollbar-color: #007079 #F9F9F9; /* thumb and track color */
}

.webviz-frame:hover {
.webviz-frame:hover {
box-shadow: 0px 0px 4px 2px lightgrey;
}
}

.webviz-frame-no-hover {
border-radius: 5px;
background-color: #F9F9F9;
margin: 10px;
padding: 15px;
position: relative;
box-shadow: 0px 0px 4px 0.5px lightgrey;
.webviz-frame::-webkit-scrollbar, .webviz-frame-no-hover::-webkit-scrollbar {
width: 3px;
background-color: #F9F9F9;
}

.webviz-frame::-webkit-scrollbar-track, .webviz-frame-no-hover::-webkit-scrollbar-track {
background-color: #F9F9F9;
}

.webviz-frame::-webkit-scrollbar-thumb, .webviz-frame-no-hover::-webkit-scrollbar-thumb {
background-color: #007079;
}
6 changes: 3 additions & 3 deletions react/src/lib/components/Layout/Selectors/selectors.css
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
.webviz-selectors {
cursor: pointer;
color: #555;
margin-top: 20px;
margin-bottom: 10px;
margin-top: 0.5vh;
margin-bottom: 0.5vh;

}

.webviz-selectors:hover {
box-shadow: 0px 0px 3px 0.5px lightgrey;
box-shadow: 0px 0px 1px 0.5px lightgrey;
}

0 comments on commit 3ac60a4

Please sign in to comment.