Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- .toolbar {
- position: fixed;
- height: 56px;
- width: 100%;
- top: 0;
- left: 0;
- background: #000000;
- z-index: 1;
- }
- .toolbar_logo {
- margin-left: 1rem;
- }
- .toolbar_logo a {
- color: white;
- text-decoration: none;
- font-size: 1.8rem;
- font-family: serif;
- }
- .toolbar_logo center {
- color: white;
- text-decoration: none;
- font: .5rem;
- margin-bottom: 10px;
- font-family: sans-serif;
- font-style: italic;
- }
- .toolbar_navigation {
- display: flex;
- height:100%;
- align-items: center;
- padding: 0 1rem;
- font-family: serif;
- }
- .toolbar_navigation-items ul {
- list-style: none;
- margin: 0;
- padding: 0;
- display: flex;
- }
- .toolbar_navigation-items li {
- padding: 0 0.5rem;
- }
- .toolbar_navigation-items a {
- color:white;
- text-decoration: none;
- font-family: sans-serif;
- }
- .spacer { /* accounts for free space when the screen size changes */
- flex: 1;
- }
- .toolbar_navigation-items a:hover,
- .toolbar_navigation-items a:active {
- color: orange;
- }
- /* colored bar */
- table {
- border-collapse: collapse;
- z-index: -1;
- }
- td {
- width: 100px;
- height: 20px;
- padding: 0px;
- }
- .colorbar_color1 {
- background-color: rgb(255, 217, 0);
- }
- .colorbar_color2 {
- background-color: red;
- }
- .colorbar_color3 {
- background-color: rgb(0, 140, 255);
- }
- .colorbar_color4 {
- background-color: gray;
- }
- /* mobile view */
- @media (max-width: 768px) {
- .toolbar_navigation-items {
- display: none;
- }
- .toolbar_logo a {
- font-size: 1.2rem;
- }
- }
- /* desktop view */
- @media (min-width: 769px) {
- .toolbar {
- /* might use */
- }
- .toolbar-toggle-button {
- display:none;
- }
- .toolbar_logo {
- margin-left: 0;
- }
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement