-
Notifications
You must be signed in to change notification settings - Fork 405
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
b6555d8
commit 810c505
Showing
6 changed files
with
338 additions
and
17 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,105 @@ | ||
.tags-input { | ||
display: inline-block; | ||
position: relative; | ||
border: 1px solid #ccc; | ||
border-radius: 4px; | ||
padding: 5px; | ||
box-shadow: 2px 2px 5px #00000033; | ||
width: 50%; | ||
} | ||
|
||
.tags-input ul { | ||
list-style: none; | ||
padding: 0; | ||
margin: 0; | ||
} | ||
|
||
.tags-input li { | ||
display: inline-block; | ||
background-color: #f2f2f2; | ||
color: #333; | ||
border-radius: 20px; | ||
padding: 5px 10px; | ||
margin-right: 5px; | ||
margin-bottom: 5px; | ||
} | ||
|
||
.tags-input input[type="text"] { | ||
border: none; | ||
outline: none; | ||
padding: 5px; | ||
font-size: 14px; | ||
} | ||
|
||
.tags-input input[type="text"]:focus { | ||
outline: none; | ||
} | ||
|
||
.tags-input .delete-button { | ||
background-color: transparent; | ||
border: none; | ||
color: #999; | ||
cursor: pointer; | ||
margin-left: 5px; | ||
} | ||
|
||
|
||
/* Dropdown Button */ | ||
.dropbtn { | ||
background-color: #04AA6D; | ||
color: white; | ||
padding: 16px; | ||
font-size: 16px; | ||
border: none; | ||
cursor: pointer; | ||
} | ||
|
||
/* Dropdown button on hover & focus */ | ||
.dropbtn:hover, .dropbtn:focus { | ||
background-color: #3e8e41; | ||
} | ||
|
||
/* The search field */ | ||
#myInput { | ||
box-sizing: border-box; | ||
background-image: url('searchicon.png'); | ||
background-position: 14px 12px; | ||
background-repeat: no-repeat; | ||
font-size: 16px; | ||
padding: 14px 20px 12px 45px; | ||
border: none; | ||
border-bottom: 1px solid #ddd; | ||
} | ||
|
||
/* The search field when it gets focus/clicked on */ | ||
#myInput:focus {outline: 3px solid #ddd;} | ||
|
||
/* The container <div> - needed to position the dropdown content */ | ||
.dropdown { | ||
position: relative; | ||
display: inline-block; | ||
} | ||
|
||
/* Dropdown Content (Hidden by Default) */ | ||
.dropdown-content { | ||
display: none; | ||
position: absolute; | ||
background-color: #f6f6f6; | ||
min-width: 230px; | ||
border: 1px solid #ddd; | ||
z-index: 1; | ||
} | ||
|
||
/* Links inside the dropdown */ | ||
.dropdown-content a { | ||
color: black; | ||
padding: 12px 16px; | ||
text-decoration: none; | ||
display: block; | ||
} | ||
|
||
/* Change color of dropdown links on hover */ | ||
.dropdown-content a:hover {background-color: #f1f1f1} | ||
|
||
/* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */ | ||
.show {display:block;} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.