| .content { |
| display: grid; |
| grid-template-areas: |
| "tabs" |
| "window"; |
| grid-template-columns: 1fr; |
| grid-template-rows: auto 1fr; |
| min-height: calc(100vh); |
| } |
| |
| .nav-tabs-container { |
| grid-area: tabs; |
| padding: 0px; |
| background-color: #999999; |
| border-bottom: 4px solid #CCCCCC; |
| } |
| |
| .tab-content { |
| grid-area: window; |
| background-color: white; |
| padding: 0px; |
| display:none; |
| } |
| |
| .tab-content.tab-default { |
| display: block; |
| } |
| |
| ul.nav-tabs { |
| padding: 0px; |
| margin: 0px; |
| overflow: auto; |
| display: table-row; |
| min-height: 2ex; |
| } |
| |
| .nav-tabs li { |
| display: inline-block; |
| padding-left: 10px; |
| padding-right: 10px; |
| padding-top: 4px; |
| padding-bottom: 4px; |
| min-width: 20px; |
| text-decoration: none; |
| color: black; |
| text-align: center; |
| user-select: none; |
| cursor: pointer; |
| } |
| |
| .nav-tabs li:hover { |
| background-color: #EEEEEE; |
| } |
| |
| .nav-tabs li.active { |
| background-color: #CCCCCC; |
| } |