Replace the language selector by our custom dropdown menu

This commit is contained in:
yflory
2017-01-11 10:46:22 +01:00
parent 26dd4ea11f
commit 569ea21705
19 changed files with 262 additions and 123 deletions

View File

@@ -348,73 +348,27 @@ button.newElement:hover {
}
/* Style The Dropdown Button */
.dropbtn {
background-color: #4CAF50;
color: white;
padding: 16px;
font-size: 16px;
border: none;
cursor: pointer;
}
/* The container <div> - needed to position the dropdown content */
.dropdown-bar {
#driveToolbar .dropdown-bar {
margin: 4px 5px;
position: relative;
display: inline-block;
}
.dropdown-bar.right {
#driveToolbar .dropdown-bar.right {
float: right;
}
/* Right-side buttons */
.dropdown-bar.right button {
#driveToolbar .dropdown-bar.right button {
display: inline-block;
}
.dropdown-bar.right button.active {
#driveToolbar .dropdown-bar.right button.active {
display: none;
}
.dropdown-bar.right button .fa {
#driveToolbar .dropdown-bar.right button .fa {
margin-right: 0px;
}
/* Dropdown Content (Hidden by Default) */
.dropdown-bar-content {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}
/* Links inside the dropdown */
.dropdown-bar-content a {
color: black;
padding: 5px 16px;
text-decoration: none;
display: block;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.dropdown-bar-content hr {
margin: 5px 0px;
height: 1px;
background: #bbb;
}
/* Change color of dropdown links on hover */
.dropdown-bar-content a:hover {background-color: #f1f1f1}
/* Show the dropdown menu on hover */
..dropdown-bar-content:hover {
display: block;
}
/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown-bar:hover .dropbtn {
background-color: #3e8e41;
margin-top: -3px;
margin-right: 2px;
}

View File

@@ -7,6 +7,7 @@
<script src="/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="/bower_components/bootstrap/dist/css/bootstrap.min.css">
<link rel="stylesheet" href="file.css" />
<link rel="stylesheet" href="/customize/main.css" />
</head>
<body>
<div id="toolbar" class="toolbar-container"></div>