use btn-group class for nav bar

Signed-off-by: Arthur Lu <learthurgo@gmail.com>
This commit is contained in:
Arthur Lu 2023-01-09 14:53:29 -08:00
parent fb1a8ec32a
commit 5865ecbb1b
2 changed files with 8 additions and 22 deletions

View File

@ -64,6 +64,11 @@ p {
background-color: #008800; background-color: #008800;
} }
.btn-group button.active {
background-color: black;
color: white;
}
nav { nav {
background-color: #00ff00; background-color: #00ff00;
overflow: hidden; overflow: hidden;
@ -71,22 +76,3 @@ nav {
margin-right: auto; margin-right: auto;
width: fit-content; width: fit-content;
} }
nav a {
background-color: #00ff00;
float: left;
color: black;
text-align: center;
padding: 8px;
text-decoration: none;
}
nav a:hover {
background-color: #008800;
color: white;
}
nav a.active {
background-color: #008800;
color: white;
}

View File

@ -10,9 +10,9 @@
</head> </head>
<body> <body>
<header> <header>
<nav> <nav class="btn-group">
<a class="active" href="index.html">Instances</a> <button class="active">Instances</button>
<a>Logout</a> <button>Logout</button>
</nav> </nav>
</header> </header>
<main><div id="instance-container" class="center-div"></div></main> <main><div id="instance-container" class="center-div"></div></main>