mirror of
https://github.com/Piwigo/Piwigo.git
synced 2026-05-03 20:12:44 +02:00
fixes #2028 Move search filters css and script combines
In search_filters.inc add the combine scripts and css specific to search, Remove them from index.tpl In index keep fontello combine, only in if search Remove pwg-icon class to avoid icon conflits with themes Move search CSS to its own file, remove it from theme.css, It has also been taken from modus Have specific CSS for clear and dark themes (they handle only color)
This commit is contained in:
HWFord
257
themes/default/css/clear-search.css
Normal file
257
themes/default/css/clear-search.css
Normal file
@@ -0,0 +1,257 @@
|
||||
/* Search default clear colros */
|
||||
.filter .filter-icon {
|
||||
color: #474747;
|
||||
}
|
||||
|
||||
.filter-manager-popin,
|
||||
.tags-found-popin,
|
||||
.albums-found-popin {
|
||||
background-color: rgba(0,0,0,0.7);
|
||||
}
|
||||
|
||||
.filter-manager-popin-container,
|
||||
.tags-found-popin-container,
|
||||
.albums-found-popin-container {
|
||||
background: white;
|
||||
}
|
||||
|
||||
.filter-manager-close,
|
||||
.tags-found-close,
|
||||
.albums-found-close {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.filter-manager-popin .mcs-popin-title,
|
||||
.tags-found-popin .mcs-popin-title,
|
||||
.albums-found-popin .mcs-popin-title {
|
||||
color: #ff7700;
|
||||
}
|
||||
|
||||
.mcs-popin-desc {
|
||||
color:#777;
|
||||
}
|
||||
|
||||
.tags-found-container .tag-item,
|
||||
.albums-found-container .album-item {
|
||||
background: #F4AB4F;
|
||||
color: #525252;
|
||||
}
|
||||
|
||||
.tags-found-container .tag-item a,
|
||||
.albums-found-container .album-item a {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.filter-manager-popin label span {
|
||||
border: 1px solid #777;
|
||||
}
|
||||
|
||||
.filter-manager-popin :checked + span {
|
||||
border: 1px solid #777;
|
||||
background: #777;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.filter-manager,
|
||||
.filter-validate {
|
||||
background: #ff7700bb;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.filter-manager:hover,
|
||||
.filter-validate:hover {
|
||||
background: #ff7700;
|
||||
}
|
||||
|
||||
.filter-cancel {
|
||||
background: #e8e8ea;
|
||||
color: #777;
|
||||
}
|
||||
|
||||
.filter-cancel:hover {
|
||||
background: #dadada;
|
||||
}
|
||||
|
||||
.mcs-container .filter {
|
||||
border: 1px solid #888;
|
||||
}
|
||||
|
||||
.filter-form {
|
||||
background: white;
|
||||
box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.6);
|
||||
color: black;
|
||||
}
|
||||
|
||||
.filter-actions {
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
.filter-actions > *:hover{
|
||||
color: #777;
|
||||
}
|
||||
|
||||
.mcs-container .filter-filled {
|
||||
background: #ffeacf;
|
||||
border: 1px solid #ff7700 !important;
|
||||
color: #ff7700!important;
|
||||
}
|
||||
|
||||
.mcs-container .filter-filled .filter-icon {
|
||||
color: #ff7700!important;
|
||||
}
|
||||
|
||||
.word-help {
|
||||
color: #888;
|
||||
}
|
||||
|
||||
#word-search {
|
||||
background: #eee;
|
||||
color: #444;
|
||||
}
|
||||
|
||||
|
||||
.filetypes-option:nth-child(odd),
|
||||
.added_by-option:nth-child(odd),
|
||||
.date_posted-option:nth-child(odd) label {
|
||||
background: #f3f3f3;
|
||||
}
|
||||
|
||||
.filetypes-option label .checked-icon,
|
||||
.added_by-option label .checked-icon,
|
||||
.date_posted-option label .checked-icon{
|
||||
color: #ff7700;
|
||||
}
|
||||
|
||||
.filetypes-option label .ext-badge,
|
||||
.added_by-option label .added_by-badge,
|
||||
.date_posted-option label .date_posted-badge {
|
||||
background: #ff7700;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.filetypes-option input:checked + label {
|
||||
background: #fff5e8;
|
||||
}
|
||||
|
||||
.date_posted-option input:checked + label {
|
||||
background: rgba(244, 171, 79, 0.17);
|
||||
}
|
||||
|
||||
.head-button-2 {
|
||||
color: #777;
|
||||
}
|
||||
|
||||
.head-button-2 {
|
||||
background: #fafafa;
|
||||
box-shadow: 0px 2px #00000024;
|
||||
}
|
||||
|
||||
.head-button-2:hover {
|
||||
background: #eee;
|
||||
color: #555 !important;
|
||||
}
|
||||
|
||||
.breadcrumb-item {
|
||||
background-color: #f4ab4f;
|
||||
}
|
||||
|
||||
.breadcrumb-item:hover .icon-cancel-circled{
|
||||
color: black;
|
||||
}
|
||||
|
||||
.breadcrumb-item.add-item {
|
||||
color: #777;
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
.breadcrumb-item a:hover {
|
||||
color: #3A3A3A;
|
||||
}
|
||||
|
||||
.breadcrumb-item .icon-cancel-circled:hover {
|
||||
color: #ff7700;
|
||||
}
|
||||
|
||||
.linkedAlbumPopIn {
|
||||
background-color: rgba(0,0,0,0.7);
|
||||
}
|
||||
|
||||
.linkedAlbumPopInContainer {
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.ClosePopIn {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.ClosePopIn:hover {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.search-result-item {
|
||||
background-color: #fafafa;
|
||||
box-shadow: 0px 2px #00000024;
|
||||
color: #777;
|
||||
}
|
||||
|
||||
.clear-all {
|
||||
color: #c4c4c4;
|
||||
}
|
||||
|
||||
.clear-all.clickable {
|
||||
color: #ff7700;
|
||||
}
|
||||
|
||||
.mcs-no-result .text span:first-child{
|
||||
color: #ff7700;
|
||||
}
|
||||
|
||||
.mcs-no-result .text span:last-child{
|
||||
color: #6e6e6e;
|
||||
}
|
||||
|
||||
.filter-form .filter-form-title {
|
||||
color: #ff7700;
|
||||
}
|
||||
|
||||
|
||||
.filter-tag-form .selectize-input,
|
||||
.filter-author-form .selectize-input,
|
||||
.filter-added_by-form .selectize-input {
|
||||
background: #eee;
|
||||
}
|
||||
|
||||
.filter-tag-form .selectize-input input,
|
||||
.filter-author-form .selectize-input input,
|
||||
.filter-added_by-form .selectize-input input {
|
||||
background: transparent !important;
|
||||
color: #444 !important;
|
||||
}
|
||||
|
||||
.filter-tag-form .selectize-input input::placeholder,
|
||||
.filter-author-form .selectize-input input::placeholder,
|
||||
.filter-added_by-form .selectize-input input::placeholder {
|
||||
color: #444;
|
||||
}
|
||||
|
||||
.filter-tag-form .selectize-control.multi .selectize-input > div,
|
||||
.filter-tag-form .selectize-control.multi .selectize-input [data-value].active,
|
||||
.filter-author-form .selectize-control.multi .selectize-input > div,
|
||||
.filter-author-form .selectize-control.multi .selectize-input [data-value].active,
|
||||
.filter-added_by-form .selectize-control.multi .selectize-input > div,
|
||||
.filter-added_by-form .selectize-control.multi .selectize-input [data-value].active {
|
||||
background: #ffa835;
|
||||
color: black;
|
||||
}
|
||||
|
||||
.filter-tag-form .selectize-dropdown,
|
||||
.filter-author-form .selectize-dropdown,
|
||||
.filter-added_by-form .selectize-dropdown {
|
||||
background: #eee;
|
||||
}
|
||||
|
||||
.filter-tag-form .selectize-dropdown .option.active,
|
||||
.filter-author-form .selectize-dropdown .option.active,
|
||||
.filter-added_by-form .selectize-dropdown .option.active {
|
||||
background: #ccc;
|
||||
}
|
||||
257
themes/default/css/dark-search.css
Normal file
257
themes/default/css/dark-search.css
Normal file
@@ -0,0 +1,257 @@
|
||||
/* Search */
|
||||
.filter .filter-icon {
|
||||
color:#aeaeae;
|
||||
}
|
||||
|
||||
.filter-manager-popin,
|
||||
.tags-found-popin,
|
||||
.albums-found-popin {
|
||||
background-color: rgba(0,0,0,0.7);
|
||||
}
|
||||
|
||||
.filter-manager-popin-container,
|
||||
.tags-found-popin-container,
|
||||
.albums-found-popin-container {
|
||||
background: #333;
|
||||
}
|
||||
|
||||
.filter-manager-close,
|
||||
.tags-found-close,
|
||||
.albums-found-close {
|
||||
color: #777;
|
||||
}
|
||||
|
||||
.filter-manager-popin .mcs-popin-title,
|
||||
.tags-found-popin .mcs-popin-title,
|
||||
.albums-found-popin .mcs-popin-title {
|
||||
color: #ff7700bb;
|
||||
}
|
||||
|
||||
.mcs-popin-desc {
|
||||
color:#777;
|
||||
}
|
||||
|
||||
.tags-found-container .tag-item,
|
||||
.albums-found-container .album-item {
|
||||
background: #F4AB4F;
|
||||
color: #525252;
|
||||
}
|
||||
|
||||
.tags-found-container .tag-item a,
|
||||
.albums-found-container .album-item a {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.filter-manager-popin label span {
|
||||
border: 1px solid #777;
|
||||
}
|
||||
|
||||
.filter-manager-popin :checked + span {
|
||||
border: 1px solid #555;
|
||||
background: #555;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.filter-manager,
|
||||
.filter-validate {
|
||||
background: #ff7700bb;
|
||||
color: #ffeacf;
|
||||
}
|
||||
|
||||
.filter-manager:hover,
|
||||
.filter-validate:hover {
|
||||
background: #ff7700bb;
|
||||
}
|
||||
|
||||
.filter-cancel {
|
||||
background: #555;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.filter-cancel:hover {
|
||||
background: #444;
|
||||
}
|
||||
|
||||
.mcs-container .filter {
|
||||
border: 1px solid #aeaeae;
|
||||
color:#aeaeae;
|
||||
}
|
||||
|
||||
.filter-form {
|
||||
background: #333;
|
||||
box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.6);
|
||||
color: #bbb;
|
||||
}
|
||||
|
||||
.filter-actions {
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
.filter-actions > *:hover{
|
||||
color: #777;
|
||||
}
|
||||
|
||||
.mcs-container .filter-filled {
|
||||
background: #ff7700bb;
|
||||
border: 1px solid #ffeacf !important;
|
||||
color: #ffeacf!important;
|
||||
}
|
||||
|
||||
.mcs-container .filter-filled .filter-icon {
|
||||
color: #ffeacf!important;
|
||||
}
|
||||
|
||||
.word-help {
|
||||
color: #888;
|
||||
}
|
||||
|
||||
#word-search {
|
||||
background: #777;
|
||||
color: #eee;
|
||||
}
|
||||
|
||||
.filetypes-option:nth-child(odd),
|
||||
.added_by-option:nth-child(odd),
|
||||
.date_posted-option:nth-child(odd) label {
|
||||
background: #f3f3f3;
|
||||
}
|
||||
|
||||
.filetypes-option label .checked-icon,
|
||||
.added_by-option label .checked-icon,
|
||||
.date_posted-option label .checked-icon{
|
||||
color: #ff7700bb;
|
||||
}
|
||||
|
||||
.filetypes-option label .ext-badge,
|
||||
.added_by-option label .added_by-badge,
|
||||
.date_posted-option label .date_posted-badge {
|
||||
background: #ff7700bb;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.filetypes-option input:checked + label {
|
||||
background: #fff5e8;
|
||||
}
|
||||
|
||||
.date_posted-option input:checked + label {
|
||||
background: rgba(244, 171, 79, 0.17);
|
||||
}
|
||||
|
||||
.head-button-2 {
|
||||
color: #777;
|
||||
background: #fafafa;
|
||||
box-shadow: 0px 2px #00000024;
|
||||
}
|
||||
|
||||
.head-button-2:hover {
|
||||
background: #eee;
|
||||
color: #555 !important;
|
||||
}
|
||||
|
||||
.breadcrumb-item {
|
||||
background-color: #f4ab4f;
|
||||
}
|
||||
|
||||
.breadcrumb-item:hover .icon-cancel-circled{
|
||||
color: black;
|
||||
}
|
||||
|
||||
.breadcrumb-item.add-item {
|
||||
color: #777;
|
||||
}
|
||||
|
||||
.breadcrumb-item a:hover {
|
||||
color: #3A3A3A;
|
||||
}
|
||||
|
||||
.breadcrumb-item .icon-cancel-circled:hover {
|
||||
color: #ff7700bb;
|
||||
}
|
||||
|
||||
.linkedAlbumPopIn {
|
||||
background-color: rgba(0,0,0,0.7);
|
||||
}
|
||||
|
||||
.linkedAlbumPopInContainer {
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.ClosePopIn {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.search-result-item {
|
||||
background-color: #fafafa;
|
||||
box-shadow: 0px 2px #00000024;
|
||||
color: #777;
|
||||
}
|
||||
|
||||
.clear-all {
|
||||
color: #777;
|
||||
}
|
||||
|
||||
.clear-all.clickable {
|
||||
color: #ff7700bb;
|
||||
}
|
||||
|
||||
.ClosePopIn:hover {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.mcs-no-result .text span:first-child{
|
||||
color: #ff7700bb;
|
||||
}
|
||||
|
||||
.mcs-no-result .text span:last-child{
|
||||
color: #6e6e6e;
|
||||
}
|
||||
|
||||
.filter-form .filter-form-title {
|
||||
color: #ff7700bb;
|
||||
}
|
||||
|
||||
|
||||
.filter-tag-form .selectize-input,
|
||||
.filter-author-form .selectize-input,
|
||||
.filter-added_by-form .selectize-input {
|
||||
background: #555;
|
||||
}
|
||||
|
||||
.filter-tag-form .selectize-input input,
|
||||
.filter-author-form .selectize-input input,
|
||||
.filter-added_by-form .selectize-input input {
|
||||
color: #ccc ;
|
||||
}
|
||||
|
||||
.filter-tag-form .selectize-input input::placeholder,
|
||||
.filter-author-form .selectize-input input::placeholder,
|
||||
.filter-added_by-form .selectize-input input::placeholder {
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.filter-tag-form .selectize-control.multi .selectize-input > div,
|
||||
.filter-tag-form .selectize-control.multi .selectize-input [data-value].active,
|
||||
.filter-author-form .selectize-control.multi .selectize-input > div,
|
||||
.filter-author-form .selectize-control.multi .selectize-input [data-value].active,
|
||||
.filter-added_by-form .selectize-control.multi .selectize-input > div,
|
||||
.filter-added_by-form .selectize-control.multi .selectize-input [data-value].active {
|
||||
background: #ffa835;
|
||||
color: black;
|
||||
}
|
||||
|
||||
|
||||
.filter-tag-form .selectize-dropdown,
|
||||
.filter-author-form .selectize-dropdown,
|
||||
.filter-added_by-form .selectize-dropdown {
|
||||
background: #eee;
|
||||
}
|
||||
|
||||
.filter-tag-form .selectize-dropdown .option.active,
|
||||
.filter-author-form .selectize-dropdown .option.active,
|
||||
.filter-added_by-form .selectize-dropdown .option.active {
|
||||
background: #555;
|
||||
}
|
||||
|
||||
.filter-tag-form .selectize-dropdown .selectize-dropdown-content{
|
||||
background-color: #444;
|
||||
}
|
||||
706
themes/default/css/search.css
Normal file
706
themes/default/css/search.css
Normal file
@@ -0,0 +1,706 @@
|
||||
/* Search specific CSS, colors are defined in seperate files*/
|
||||
.filter-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.filter-manager-popin,
|
||||
.tags-found-popin,
|
||||
.albums-found-popin {
|
||||
position: fixed;
|
||||
z-index: 100;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.filter-manager-popin-container,
|
||||
.tags-found-popin-container,
|
||||
.albums-found-popin-container {
|
||||
display:flex;
|
||||
position:absolute;
|
||||
left:50%;
|
||||
top: 50%;
|
||||
transform:translate(-50%, -48%);
|
||||
text-align:left;
|
||||
padding:20px;
|
||||
flex-direction:column;
|
||||
border-radius:15px;
|
||||
align-items:center;
|
||||
width: 400px;
|
||||
}
|
||||
|
||||
.filter-manager-close,
|
||||
.tags-found-close,
|
||||
.albums-found-close {
|
||||
position: absolute;
|
||||
right: -40px;
|
||||
top: -40px;
|
||||
font-size: 30px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.filter-manager .mcs-icon::before {
|
||||
margin: 0 5px 0 -2px;
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
.filter-manager-popin .mcs-popin-title,
|
||||
.tags-found-popin .mcs-popin-title,
|
||||
.albums-found-popin .mcs-popin-title {
|
||||
width: 100%;
|
||||
font-size: 19px;
|
||||
font-weight: 700;
|
||||
margin: 0 0 20px 0;
|
||||
}
|
||||
|
||||
.mcs-popin-desc {
|
||||
margin: 0 0 20px 0;
|
||||
}
|
||||
|
||||
.tags-found-container,
|
||||
.albums-found-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
gap: 5px;
|
||||
}
|
||||
|
||||
.albums-found-container {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.tags-found-container .tag-item,
|
||||
.albums-found-container .album-item {
|
||||
padding: 3px 6px;
|
||||
border-radius: 5px;
|
||||
max-width: 150px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
cursor: default;
|
||||
direction: rtl;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.albums-found-container .album-item {
|
||||
max-width: -moz-available;
|
||||
max-width: -webkit-fill-available;
|
||||
max-width: fill-available;
|
||||
}
|
||||
|
||||
.tags-found-container .tag-item a,
|
||||
.albums-found-container .album-item a {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.filter-manager-popin .filter-manager-controller-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 15px;
|
||||
flex-wrap: wrap;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.filter-manager-popin .filter-manager-controller-container .mcs-icon::before {
|
||||
display: inline-block;
|
||||
width: 15px;
|
||||
}
|
||||
|
||||
.filter-manager-popin label {
|
||||
white-space: nowrap;
|
||||
margin: 6px 0;
|
||||
}
|
||||
|
||||
.filter-manager-popin label span {
|
||||
border-radius: 20px;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.filter-manager-popin :checked + span {
|
||||
border-radius: 20px;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.filter-manager-popin input[type='checkbox'] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.filter-manager-actions {
|
||||
display: flex;
|
||||
margin: 0 0 0 auto;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.mcs-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 10px 15px;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
margin: 0 15px;
|
||||
}
|
||||
|
||||
.filter-manager,
|
||||
.filter-validate {
|
||||
transition: 0.3s;
|
||||
cursor: pointer;
|
||||
border-radius: 5px;
|
||||
font-size: 15px;
|
||||
font-weight: 600;
|
||||
padding: 4px 10px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.filter-cancel {
|
||||
transition: 0.3s;
|
||||
cursor: pointer;
|
||||
border-radius: 5px;
|
||||
font-size: 15px;
|
||||
font-weight: 600;
|
||||
padding: 4px 10px;
|
||||
}
|
||||
|
||||
.mcs-icon.pwg-icon-cog {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.mcs-container .filter {
|
||||
font-size: 15px;
|
||||
position: relative;
|
||||
border-radius: 20px;
|
||||
padding: 3px 6px;
|
||||
cursor: pointer;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.filter span {
|
||||
margin: 0 3px;
|
||||
}
|
||||
|
||||
.filter .filter-arrow::before {
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
.filter.show-filter-dropdown .filter-arrow::before {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
.filter-form {
|
||||
display: none;
|
||||
position: absolute;
|
||||
z-index: 5;
|
||||
padding: 20px;
|
||||
border-radius: 5px;
|
||||
top: 35px;
|
||||
left: 0;
|
||||
cursor: default;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.filter-form label {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.filter-actions {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
gap: 5px;
|
||||
}
|
||||
|
||||
.filter-actions > *{
|
||||
cursor: pointer;
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
.filter-actions span{
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.filter-filetypes-form .filter-actions,
|
||||
.filter-date_posted-form .filter-actions {
|
||||
gap: 5px;
|
||||
}
|
||||
|
||||
.word-help {
|
||||
text-decoration: underline;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#word-search {
|
||||
margin: 0 0 10px 0;
|
||||
width: -moz-available;
|
||||
width: -webkit-fill-available;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.word-search-options,
|
||||
.filter-tag-form .search-params,
|
||||
.filter-album-form .search-params {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
white-space: nowrap;
|
||||
gap: 0 20px;
|
||||
margin: 5px 0;
|
||||
}
|
||||
|
||||
.filter-validate {
|
||||
width: fit-content;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.form-container .filter-validate {
|
||||
width: fit-content;
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
.filter .search-words {
|
||||
max-width: 200px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.filter-word-form .search-params {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 5px 15px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.filter-word-form span {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.filter-word-form .search-params-title {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.filter-filetypes-form {
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
.filter-date_posted-form {
|
||||
width: 250px;
|
||||
}
|
||||
|
||||
.filetypes-option-container,
|
||||
.added_by-option-container,
|
||||
.date_posted-option-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin: 20px 0 20px 0;
|
||||
}
|
||||
|
||||
.date_posted-option-container {
|
||||
margin: 10px 0 10px 0;
|
||||
}
|
||||
|
||||
.filetypes-option input,
|
||||
.added_by-option input,
|
||||
.date_posted-option input {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.filetypes-option label,
|
||||
.added_by-option label,
|
||||
.date_posted-option label {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: baseline;
|
||||
position: relative;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.filetypes-option label .checked-icon,
|
||||
.added_by-option label .checked-icon,
|
||||
.date_posted-option label .checked-icon{
|
||||
display: none;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 4px;
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
.filetypes-option label .ext-name,
|
||||
.added_by-option label .added_by-name,
|
||||
.date_posted-option label .date-period {
|
||||
margin-left: 30px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.added_by-option label .added_by-name{
|
||||
white-space: nowrap;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.date_posted-option label .date-period{
|
||||
margin-left: 30px;
|
||||
}
|
||||
|
||||
.filetypes-option label .ext-badge,
|
||||
.added_by-option label .added_by-badge,
|
||||
.date_posted-option label .date_posted-badge {
|
||||
margin-left: auto;
|
||||
border-radius: 10px;
|
||||
padding: 0 5px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.filetypes-option input:checked + label .checked-icon,
|
||||
.added_by-option input:checked + label .checked-icon,
|
||||
.date_posted-option input:checked + label .checked-icon{
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.filter-album-form {
|
||||
width: 400px;
|
||||
}
|
||||
|
||||
.filter-album-form .search-sub-cats {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.head-button-2 {
|
||||
position: relative;
|
||||
padding: 5px 12px 5px 8px;
|
||||
border-radius: 5px;
|
||||
font-weight: bold;
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
cursor: pointer;
|
||||
transition: 0.2s;
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
.head-button-2:active {
|
||||
box-shadow: none;
|
||||
transform: translateY(2px);
|
||||
}
|
||||
|
||||
.head-button-2 p {
|
||||
margin: 0;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.head-button-2:hover {
|
||||
text-decoration: none !important;
|
||||
}
|
||||
|
||||
.breadcrumb-item {
|
||||
margin: 0 10px 5px 0px;
|
||||
padding: 4px 8px;
|
||||
border-radius: 5px;
|
||||
font-weight: bold;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.breadcrumb-item .link-path {
|
||||
margin-right: 15px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.breadcrumb-item .remove-item {
|
||||
margin-left: auto;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.breadcrumb-item a {
|
||||
padding: 0 5px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.breadcrumb-item .icon-cancel-circled,
|
||||
.breadcrumb-item .help-item {
|
||||
margin-left: auto !important;
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
.breadcrumb-item.add-item {
|
||||
width: min-content;
|
||||
cursor: pointer;
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
#addLinkedAlbum {
|
||||
display:none;
|
||||
}
|
||||
|
||||
.linkedAlbumPopIn {
|
||||
position: fixed;
|
||||
z-index: 100;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.linkedAlbumPopInContainer {
|
||||
display:flex;
|
||||
position:absolute;
|
||||
left:50%;
|
||||
top: 50%;
|
||||
transform:translate(-50%, -48%);
|
||||
text-align:left;
|
||||
padding:20px;
|
||||
flex-direction:column;
|
||||
border-radius:15px;
|
||||
align-items:center;
|
||||
width: 400px;
|
||||
height: 400px;
|
||||
}
|
||||
|
||||
.linkedAlbumPopInContainer .AddIconContainer {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.ClosePopIn {
|
||||
position: absolute;
|
||||
right: -40px;
|
||||
top: -40px;
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
.ClosePopIn:hover {
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.linkedAlbumPopInContainer .AddIcon {
|
||||
border-radius: 9999px;
|
||||
padding: 10px;
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
.AddIconTitle {
|
||||
font-size: 1.4em;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
margin-bottom: 10px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
#linkedAlbumSearch .search-icon {
|
||||
position: absolute;
|
||||
transform: translate(7px, 8px);
|
||||
font-size: 18px;
|
||||
top: auto;
|
||||
}
|
||||
|
||||
.linkedAlbumPopInContainer #searchResult {
|
||||
width: 100%;
|
||||
overflow-y: auto;
|
||||
max-height: 400px;
|
||||
margin: 10px 0 0 0;
|
||||
}
|
||||
|
||||
.search-cancel-linked-album {
|
||||
opacity: 0.4;
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
font-size: 18px;
|
||||
transform: translate(215px, 8px);
|
||||
}
|
||||
|
||||
.search-cancel-linked-album:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.search-result-item {
|
||||
margin: 10px 0px;
|
||||
padding: 5px 10px;
|
||||
height: 25px;
|
||||
border-radius: 5px;
|
||||
font-weight: bold;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.search-result-path {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
max-width: 80%;
|
||||
direction: rtl;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.search-result-item .icon-plus-circled{
|
||||
margin-left: auto;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.search-result-item .notClickable {
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
.linkedAlbumPopInContainer .searching {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.clear-all {
|
||||
cursor: not-allowed;
|
||||
font-weight: 600;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.clear-all.clickable {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.mcs-container .filter-manager-controller-container label {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.mcs-no-result {
|
||||
margin: 30vh 0 0 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.mcs-no-result .text {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: fit-content;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.mcs-no-result .text span:first-child{
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
margin: 0 0 15px 0;
|
||||
max-width: 450px;
|
||||
}
|
||||
|
||||
.mcs-no-result .text span:last-child{
|
||||
font-size: 15px;
|
||||
font-weight: 500;
|
||||
max-width: 350px;
|
||||
}
|
||||
|
||||
.filter-form .filter-form-title {
|
||||
font-weight: bold;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.filter-tag-form .selectize-control,
|
||||
.filter-author-form .selectize-control,
|
||||
.filter-added_by-form .selectize-control {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.filter-tag-form .selectize-input,
|
||||
.filter-author-form .selectize-input,
|
||||
.filter-added_by-form .selectize-input {
|
||||
border-radius: 5px;
|
||||
padding: 5px;
|
||||
width: 350px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
gap: 5px;
|
||||
}
|
||||
|
||||
.filter-tag-form .selectize-input input,
|
||||
.filter-author-form .selectize-input input,
|
||||
.filter-added_by-form .selectize-input input {
|
||||
height: 16px;
|
||||
padding: 0;
|
||||
height: 26px;
|
||||
}
|
||||
|
||||
.filter-tag-form .selectize-control.multi .selectize-input > div,
|
||||
.filter-tag-form .selectize-control.multi .selectize-input [data-value].active,
|
||||
.filter-author-form .selectize-control.multi .selectize-input > div,
|
||||
.filter-author-form .selectize-control.multi .selectize-input [data-value].active,
|
||||
.filter-added_by-form .selectize-control.multi .selectize-input > div,
|
||||
.filter-added_by-form .selectize-control.multi .selectize-input [data-value].active {
|
||||
padding: 2px 4px;
|
||||
border-radius: 5px;
|
||||
width: fit-content;
|
||||
gap: 5px;
|
||||
height: fit-content;
|
||||
}
|
||||
|
||||
.filter-tag-form .selectize-control.multi .selectize-input > div .remove,
|
||||
.filter-author-form .selectize-control.multi .selectize-input > div .remove,
|
||||
.filter-added_by-form .selectize-control.multi .selectize-input > div .remove {
|
||||
text-decoration: none;
|
||||
border: none;
|
||||
margin: 0 0 0 10px;
|
||||
}
|
||||
|
||||
.filter-tag-form .selectize-dropdown,
|
||||
.filter-author-form .selectize-dropdown,
|
||||
.filter-added_by-form .selectize-dropdown {
|
||||
padding: 0;
|
||||
max-height: 100px;
|
||||
overflow-y: scroll;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.filter-tag-form .selectize-dropdown .option,
|
||||
.filter-author-form .selectize-dropdown .option,
|
||||
.filter-added_by-form .selectize-dropdown .option {
|
||||
padding: 0 5px;
|
||||
}
|
||||
|
||||
.filter-tag-form .selectize-dropdown .option.active,
|
||||
.filter-author-form .selectize-dropdown .option.active,
|
||||
.filter-added_by-form .selectize-dropdown .option.active {
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.filter-tag-form .form-container,
|
||||
.filter-author-form .form-container,
|
||||
.filter-added_by-form .form-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.filter-validate .loading {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.filter-album-form .add-album-button {
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
.filetypes-option,
|
||||
.added_by-option{
|
||||
min-width:150px!important;
|
||||
}
|
||||
|
||||
.filter-filetypes-form .form-container,
|
||||
.filter-added_by-form .form-container,
|
||||
.filter-date_posted .form-container {
|
||||
max-height: 300px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.section-search .sticky-top{
|
||||
z-index: 10!important;
|
||||
}
|
||||
@@ -1,3 +1,10 @@
|
||||
{combine_script id='jquery.selectize' load='footer' path='themes/default/js/plugins/selectize.min.js'}
|
||||
{combine_css path="admin/themes/default/fontello/css/animation.css" order=10} {* order 10 is required, see issue 1080 *}
|
||||
{combine_script id='jquery.tipTip' load='header' path='themes/default/js/plugins/jquery.tipTip.minified.js'}
|
||||
{combine_css path="themes/default/css/search.css" order=-100}
|
||||
{combine_css path="themes/default/css/{$themeconf.colorscheme}-search.css" order=-100}
|
||||
{combine_css path="themes/default/vendor/fontello/css/fontello.css" order=-10}
|
||||
|
||||
{footer_script}
|
||||
{if isset($GP)}
|
||||
global_params = {$GP};
|
||||
|
||||
@@ -1,7 +1,4 @@
|
||||
{combine_script id='core.switchbox' load='async' require='jquery' path='themes/default/js/switchbox.js'}
|
||||
{combine_script id='jquery.selectize' load='footer' path='themes/default/js/plugins/selectize.min.js'}
|
||||
{combine_css path="admin/themes/default/fontello/css/animation.css" order=10} {* order 10 is required, see issue 1080 *}
|
||||
{combine_script id='jquery.tipTip' load='header' path='themes/default/js/plugins/jquery.tipTip.minified.js'}
|
||||
|
||||
{$MENUBAR}
|
||||
|
||||
@@ -16,8 +13,9 @@
|
||||
<div class="titrePage{if isset($chronology.TITLE)} calendarTitleBar{/if}">
|
||||
<ul class="categoryActions">
|
||||
{if isset($SEARCH_IN_SET_ACTION) and $SEARCH_IN_SET_ACTION}
|
||||
{combine_css path="themes/default/vendor/fontello/css/fontello.css" order=-10}
|
||||
<li id="cmdSearchInSet"><a href="{$SEARCH_IN_SET_URL}" title="{'Search in this set'|translate}" class="pwg-state-default pwg-button">
|
||||
<span class="pwg-icon pwg-icon-search-folder"></span><span class="pwg-button-text">{'Search in this set'|translate}</span>
|
||||
<span class="pwg-icon-search-folder"></span><span class="pwg-button-text">{'Search in this set'|translate}</span>
|
||||
</a></li>
|
||||
{/if}
|
||||
{if !empty($image_orders)}
|
||||
|
||||
@@ -831,624 +831,33 @@ LEGEND {
|
||||
padding: 0px 5px !important;
|
||||
}
|
||||
|
||||
|
||||
#TagsGroupRemoveTag span,
|
||||
#TagsGroupRemoveTag i{
|
||||
display:none;
|
||||
}
|
||||
|
||||
/* Search */
|
||||
|
||||
.filter-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.filter .filter-icon {
|
||||
color: #474747;
|
||||
}
|
||||
|
||||
.filter-manager-popin,
|
||||
.tags-found-popin,
|
||||
.albums-found-popin {
|
||||
position: fixed;
|
||||
z-index: 100;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
background-color: rgba(0,0,0,0.7);
|
||||
display: none;
|
||||
}
|
||||
|
||||
.filter-manager-popin-container,
|
||||
.tags-found-popin-container,
|
||||
.albums-found-popin-container {
|
||||
display:flex;
|
||||
position:absolute;
|
||||
left:50%;
|
||||
top: 50%;
|
||||
transform:translate(-50%, -48%);
|
||||
text-align:left;
|
||||
padding:20px;
|
||||
flex-direction:column;
|
||||
border-radius:15px;
|
||||
align-items:center;
|
||||
width: 400px;
|
||||
background: white;
|
||||
}
|
||||
|
||||
.filter-manager-close,
|
||||
.tags-found-close,
|
||||
.albums-found-close {
|
||||
position: absolute;
|
||||
right: -40px;
|
||||
top: -40px;
|
||||
font-size: 30px;
|
||||
color: white;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.filter-manager .mcs-icon::before {
|
||||
margin: 0 5px 0 -2px;
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
.filter-manager-popin .mcs-popin-title,
|
||||
.tags-found-popin .mcs-popin-title,
|
||||
.albums-found-popin .mcs-popin-title {
|
||||
width: 100%;
|
||||
font-size: 19px;
|
||||
color: #ff7700;
|
||||
font-weight: 700;
|
||||
margin: 0 0 20px 0;
|
||||
}
|
||||
|
||||
.tags-found-container,
|
||||
.albums-found-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
gap: 5px;
|
||||
}
|
||||
.albums-found-container {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
width: 100%;
|
||||
}
|
||||
.tags-found-container .tag-item,
|
||||
.albums-found-container .album-item {
|
||||
background: #F4AB4F;
|
||||
color: #525252;
|
||||
padding: 3px 6px;
|
||||
border-radius: 5px;
|
||||
max-width: 150px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
cursor: default;
|
||||
|
||||
direction: rtl;
|
||||
text-align: left;
|
||||
}
|
||||
.albums-found-container .album-item {
|
||||
max-width: -moz-available;
|
||||
max-width: -webkit-fill-available;
|
||||
max-width: fill-available;
|
||||
}
|
||||
.tags-found-container .tag-item a,
|
||||
.albums-found-container .album-item a {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.filter-manager-popin .filter-manager-controller-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 15px;
|
||||
flex-wrap: wrap;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.filter-manager-popin .filter-manager-controller-container .mcs-icon::before {
|
||||
display: inline-block;
|
||||
width: 15px;
|
||||
}
|
||||
|
||||
.filter-manager-popin label {
|
||||
white-space: nowrap;
|
||||
margin: 6px 0;
|
||||
}
|
||||
|
||||
.filter-manager-popin label span {
|
||||
border: 1px solid #777;
|
||||
border-radius: 20px;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.filter-manager-popin :checked + span {
|
||||
border: 1px solid #777;
|
||||
background: #777;
|
||||
color: white;
|
||||
border-radius: 20px;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.filter-manager-popin input[type='checkbox'] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.filter-manager-actions {
|
||||
display: flex;
|
||||
margin: 0 0 0 auto;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.mcs-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 10px 15px;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
margin: 0 15px;
|
||||
}
|
||||
|
||||
.filter-manager,
|
||||
.filter-validate {
|
||||
background: #ff7700bb;
|
||||
transition: 0.3s;
|
||||
cursor: pointer;
|
||||
color: white;
|
||||
border-radius: 5px;
|
||||
font-size: 15px;
|
||||
font-weight: 600;
|
||||
padding: 4px 10px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.filter-manager:hover,
|
||||
.filter-validate:hover {
|
||||
background: #ff7700;
|
||||
}
|
||||
|
||||
.filter-cancel {
|
||||
background: #e8e8ea;
|
||||
transition: 0.3s;
|
||||
cursor: pointer;
|
||||
color: #777;
|
||||
border-radius: 5px;
|
||||
font-size: 15px;
|
||||
font-weight: 600;
|
||||
padding: 4px 10px;
|
||||
}
|
||||
.filter-cancel:hover {
|
||||
background: #dadada;
|
||||
}
|
||||
|
||||
.mcs-icon.pwg-icon-cog {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.mcs-container .filter {
|
||||
font-size: 15px;
|
||||
position: relative;
|
||||
border-radius: 20px;
|
||||
padding: 3px 6px;
|
||||
border: 1px solid #888;
|
||||
cursor: pointer;
|
||||
display: none;
|
||||
}
|
||||
.filter span {
|
||||
margin: 0 3px;
|
||||
}
|
||||
|
||||
.filter .filter-arrow::before {
|
||||
transition: 0.3s;
|
||||
}
|
||||
.filter.show-filter-dropdown .filter-arrow::before {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
.filter-filled {
|
||||
background: #ffeacf;
|
||||
border: 1px solid #ff7700 !important;
|
||||
color: #ff7700;
|
||||
}
|
||||
.filter-filled .filter-icon {
|
||||
color: #ff7700;
|
||||
}
|
||||
|
||||
.filter-form {
|
||||
display: none;
|
||||
background: white;
|
||||
position: absolute;
|
||||
z-index: 5;
|
||||
padding: 20px;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.6);
|
||||
top: 35px;
|
||||
left: 0;
|
||||
cursor: default;
|
||||
flex-direction: column;
|
||||
color: black;
|
||||
}
|
||||
|
||||
.filter-form label {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.filter-actions {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
color: #aaa;
|
||||
gap: 5px;
|
||||
}
|
||||
.filter-actions > *{
|
||||
cursor: pointer;
|
||||
transition: 0.3s;
|
||||
}
|
||||
.filter-actions > *:hover{
|
||||
color: #777;
|
||||
}
|
||||
.filter-actions span{
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.filter-filetypes-form .filter-actions,
|
||||
.filter-date_posted-form .filter-actions {
|
||||
gap: 5px;
|
||||
}
|
||||
|
||||
.word-help {
|
||||
text-decoration: underline;
|
||||
color: #888;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#word-search {
|
||||
margin: 0 0 10px 0;
|
||||
width: -moz-available;
|
||||
width: -webkit-fill-available;
|
||||
background: #eee;
|
||||
color: #444;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.word-search-options,
|
||||
.filter-tag-form .search-params,
|
||||
.filter-album-form .search-params {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
white-space: nowrap;
|
||||
gap: 0 20px;
|
||||
margin: 5px 0;
|
||||
}
|
||||
|
||||
.filter-validate {
|
||||
width: fit-content;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.form-container .filter-validate {
|
||||
width: fit-content;
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
.filter .search-words {
|
||||
max-width: 200px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.filter-word-form .search-params {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 5px 15px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.filter-word-form span {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.filter-word-form .search-params-title {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
margin-top: 15px;
|
||||
}
|
||||
.filter-filetypes-form {
|
||||
width: 200px;
|
||||
}
|
||||
.filter-date_posted-form {
|
||||
width: 250px;
|
||||
}
|
||||
.filetypes-option-container,
|
||||
.date_posted-option-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin: 20px 0 20px 0;
|
||||
}
|
||||
.date_posted-option-container {
|
||||
margin: 10px 0 10px 0;
|
||||
}
|
||||
.filetypes-option:nth-child(odd),
|
||||
.date_posted-option:nth-child(odd) label {
|
||||
background: #f3f3f3;
|
||||
}
|
||||
|
||||
.filetypes-option input,
|
||||
.date_posted-option input {
|
||||
display: none;
|
||||
}
|
||||
.filetypes-option label,
|
||||
.date_posted-option label {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: baseline;
|
||||
position: relative;
|
||||
padding: 5px;
|
||||
}
|
||||
/* .date_posted-option label {
|
||||
width: 230px;
|
||||
transform: translateX(-20px);
|
||||
} */
|
||||
.filetypes-option label .checked-icon,
|
||||
.date_posted-option label .checked-icon{
|
||||
display: none;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 4px;
|
||||
margin: 5px;
|
||||
color: #ff7700;
|
||||
}
|
||||
|
||||
.filetypes-option label .ext-name {
|
||||
margin-left: 30px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.date_posted-option label .date-period{
|
||||
margin-left: 30px;
|
||||
}
|
||||
|
||||
.filetypes-option label .ext-badge,
|
||||
.date_posted-option label .date_posted-badge {
|
||||
margin-left: auto;
|
||||
background: #ff7700;
|
||||
border-radius: 10px;
|
||||
padding: 0 5px;
|
||||
color: white;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.filetypes-option input:checked + label .checked-icon,
|
||||
.date_posted-option input:checked + label .checked-icon{
|
||||
display: flex;
|
||||
}
|
||||
.filetypes-option input:checked + label {
|
||||
background: #fff5e8;
|
||||
}
|
||||
.date_posted-option input:checked + label {
|
||||
background: rgba(244, 171, 79, 0.17);
|
||||
}
|
||||
|
||||
.filter-album-form {
|
||||
width: 400px;
|
||||
}
|
||||
.filter-album-form .search-sub-cats {
|
||||
margin-top: 10px;
|
||||
}
|
||||
.head-button-2 {
|
||||
position: relative;
|
||||
padding: 5px 12px 5px 8px;
|
||||
border-radius: 5px;
|
||||
font-weight: bold;
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
cursor: pointer;
|
||||
color: #777;
|
||||
transition: 0.2s;
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
.head-button-2:active {
|
||||
box-shadow: none;
|
||||
transform: translateY(2px);
|
||||
}
|
||||
|
||||
.head-button-2 p {
|
||||
margin: 0;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.head-button-2 {
|
||||
background: #fafafa;
|
||||
box-shadow: 0px 2px #00000024;
|
||||
}
|
||||
|
||||
.head-button-2:hover {
|
||||
background: #eee;
|
||||
text-decoration: none !important;
|
||||
color: inherit !important;
|
||||
color: #555 !important;
|
||||
}
|
||||
|
||||
.breadcrumb-item {
|
||||
margin: 0 10px 5px 0px;
|
||||
padding: 4px 8px;
|
||||
border-radius: 5px;
|
||||
font-weight: bold;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
.breadcrumb-item .link-path {
|
||||
margin-right: 15px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.breadcrumb-item .remove-item {
|
||||
margin-left: auto;
|
||||
cursor: pointer;
|
||||
}
|
||||
.breadcrumb-item:hover .icon-cancel-circled{
|
||||
color: black;
|
||||
}
|
||||
|
||||
.breadcrumb-item a {
|
||||
padding: 0 5px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.breadcrumb-item .icon-cancel-circled,
|
||||
.breadcrumb-item .help-item {
|
||||
margin-left: auto !important;
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
.breadcrumb-item.add-item {
|
||||
width: min-content;
|
||||
cursor: pointer;
|
||||
color: #777;
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
.breadcrumb-item a:hover {
|
||||
color: #3A3A3A;
|
||||
}
|
||||
|
||||
#addLinkedAlbum {
|
||||
display:none;
|
||||
}
|
||||
|
||||
.linkedAlbumPopIn {
|
||||
position: fixed;
|
||||
z-index: 100;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
background-color: rgba(0,0,0,0.7);
|
||||
}
|
||||
|
||||
.linkedAlbumPopInContainer {
|
||||
display:flex;
|
||||
position:absolute;
|
||||
left:50%;
|
||||
top: 50%;
|
||||
transform:translate(-50%, -48%);
|
||||
text-align:left;
|
||||
padding:20px;
|
||||
flex-direction:column;
|
||||
border-radius:15px;
|
||||
align-items:center;
|
||||
width: 400px;
|
||||
height: 400px;
|
||||
}
|
||||
|
||||
.linkedAlbumPopInContainer .AddIconContainer {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.ClosePopIn {
|
||||
position: absolute;
|
||||
right: -40px;
|
||||
top: -40px;
|
||||
font-size: 30px;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.linkedAlbumPopInContainer .AddIcon {
|
||||
border-radius: 9999px;
|
||||
padding: 10px;
|
||||
font-size: 2em;
|
||||
}
|
||||
.AddIconTitle {
|
||||
font-size: 1.4em;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
margin-bottom: 10px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
#linkedAlbumSearch .search-icon {
|
||||
position: absolute;
|
||||
transform: translate(7px, 8px);
|
||||
font-size: 18px;
|
||||
top: auto;
|
||||
}
|
||||
|
||||
.linkedAlbumPopInContainer #searchResult {
|
||||
width: 100%;
|
||||
overflow-y: auto;
|
||||
max-height: 400px;
|
||||
margin: 10px 0 0 0;
|
||||
}
|
||||
|
||||
.search-cancel-linked-album {
|
||||
opacity: 0.4;
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
font-size: 18px;
|
||||
transform: translate(215px, 8px);
|
||||
}
|
||||
|
||||
.search-cancel-linked-album:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.search-result-item {
|
||||
margin: 10px 0px;
|
||||
padding: 5px 10px;
|
||||
height: 25px;
|
||||
background-color: #fafafa;
|
||||
box-shadow: 0px 2px #00000024;
|
||||
border-radius: 5px;
|
||||
font-weight: bold;
|
||||
color: #777;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.search-result-path {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
max-width: 80%;
|
||||
direction: rtl;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.search-result-item .icon-plus-circled{
|
||||
margin-left: auto;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.search-result-item .notClickable {
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
.linkedAlbumPopInContainer .searching {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.clear-all {
|
||||
color: #c4c4c4;
|
||||
cursor: not-allowed;
|
||||
font-weight: 600;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.clear-all.clickable {
|
||||
color: #ff7700;
|
||||
cursor: pointer;
|
||||
/* Search in this set button CSS,
|
||||
Needs to be loaded herre because we don't use it on the search pages but on other pages
|
||||
it won't be loaded if it goes in the search specific css
|
||||
because of this it needs to specifically be added to each theme */
|
||||
.mcs-side-results.search-in-set-button {
|
||||
/* margin-top:-15px; */
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
.mcs-side-results.search-in-set-button p {
|
||||
margin:0;
|
||||
}
|
||||
.mcs-side-results.search-in-set-button a {
|
||||
color:#777;
|
||||
font-weight:600;
|
||||
}
|
||||
.mcs-side-results.search-in-set-button a::before {
|
||||
margin-right:10px;
|
||||
}
|
||||
.mcs-side-results.search-in-set-button a:hover {
|
||||
color:#777;
|
||||
font-weight:600;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.mcs-side-results {
|
||||
@@ -1459,9 +868,8 @@ LEGEND {
|
||||
}
|
||||
|
||||
.mcs-side-results > div {
|
||||
background: #fafafa;
|
||||
background: #555;
|
||||
box-shadow: 0px 2px #00000024;
|
||||
|
||||
position: relative;
|
||||
padding: 4px 10px;
|
||||
border-radius: 5px;
|
||||
@@ -1470,11 +878,12 @@ LEGEND {
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
margin-right: 10px;
|
||||
color: #777;
|
||||
color: #ccc;
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
.mcs-side-results > div:hover {
|
||||
background: #eee;
|
||||
background: #444;
|
||||
color: #777;
|
||||
}
|
||||
.mcs-side-results > div:active {
|
||||
@@ -1495,158 +904,5 @@ LEGEND {
|
||||
margin-left: 5px;
|
||||
padding: 2px 5px!important;
|
||||
font-size: 10px;
|
||||
|
||||
background: #777;
|
||||
}
|
||||
|
||||
.mcs-side-results.search-in-set-button {
|
||||
margin-top:0;
|
||||
}
|
||||
|
||||
.ClosePopIn:hover {
|
||||
text-decoration: none;
|
||||
color: white;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.mcs-container .filter-manager-controller-container label {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.mcs-no-result {
|
||||
margin: 30vh 0 0 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.mcs-no-result .text {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: fit-content;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
}
|
||||
.mcs-no-result .text span:first-child{
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
color: #ff7700;
|
||||
margin: 0 0 15px 0;
|
||||
max-width: 450px;
|
||||
}
|
||||
.mcs-no-result .text span:last-child{
|
||||
font-size: 15px;
|
||||
font-weight: 500;
|
||||
color: #6e6e6e;
|
||||
max-width: 350px;
|
||||
}
|
||||
|
||||
.filter-form .filter-form-title {
|
||||
color: #ff7700;
|
||||
font-weight: bold;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.filter-tag-form .selectize-control,
|
||||
.filter-author-form .selectize-control,
|
||||
.filter-added_by-form .selectize-control {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.filter-tag-form .selectize-input,
|
||||
.filter-author-form .selectize-input,
|
||||
.filter-added_by-form .selectize-input {
|
||||
background: #eee;
|
||||
border-radius: 5px;
|
||||
padding: 5px;
|
||||
|
||||
width: 350px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
gap: 5px;
|
||||
}
|
||||
|
||||
.filter-tag-form .selectize-input input,
|
||||
.filter-author-form .selectize-input input,
|
||||
.filter-added_by-form .selectize-input input {
|
||||
background: transparent;
|
||||
color: #444;
|
||||
height: 16px;
|
||||
padding: 0;
|
||||
height: 26px;
|
||||
}
|
||||
.filter-tag-form .selectize-input input::placeholder,
|
||||
.filter-author-form .selectize-input input::placeholder,
|
||||
.filter-added_by-form .selectize-input input::placeholder {
|
||||
color: #444;
|
||||
}
|
||||
|
||||
.filter-tag-form .selectize-control.multi .selectize-input > div,
|
||||
.filter-tag-form .selectize-control.multi .selectize-input [data-value].active,
|
||||
.filter-author-form .selectize-control.multi .selectize-input > div,
|
||||
.filter-author-form .selectize-control.multi .selectize-input [data-value].active,
|
||||
.filter-added_by-form .selectize-control.multi .selectize-input > div,
|
||||
.filter-added_by-form .selectize-control.multi .selectize-input [data-value].active {
|
||||
background: #ffa835;
|
||||
color: black;
|
||||
padding: 2px 4px;
|
||||
border-radius: 5px;
|
||||
width: fit-content;
|
||||
gap: 5px;
|
||||
height: fit-content;
|
||||
}
|
||||
.filter-tag-form .selectize-control.multi .selectize-input > div .remove,
|
||||
.filter-author-form .selectize-control.multi .selectize-input > div .remove,
|
||||
.filter-added_by-form .selectize-control.multi .selectize-input > div .remove {
|
||||
text-decoration: none;
|
||||
border: none;
|
||||
margin: 0 0 0 10px;
|
||||
}
|
||||
|
||||
.filter-tag-form .selectize-dropdown,
|
||||
.filter-author-form .selectize-dropdown,
|
||||
.filter-added_by-form .selectize-dropdown {
|
||||
background: #eee;
|
||||
padding: 0;
|
||||
max-height: 100px;
|
||||
overflow-y: scroll;
|
||||
position: absolute;
|
||||
}
|
||||
.filter-tag-form .selectize-dropdown .option,
|
||||
.filter-author-form .selectize-dropdown .option,
|
||||
.filter-added_by-form .selectize-dropdown .option {
|
||||
padding: 0 5px;
|
||||
}
|
||||
.filter-tag-form .selectize-dropdown .option.active,
|
||||
.filter-author-form .selectize-dropdown .option.active,
|
||||
.filter-added_by-form .selectize-dropdown .option.active {
|
||||
background: #ccc;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.filter-tag-form .form-container,
|
||||
.filter-author-form .form-container,
|
||||
.filter-added_by-form .form-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.linkedAlbumPopInContainer {
|
||||
background-color: white;
|
||||
}
|
||||
.breadcrumb-item {
|
||||
background-color: #f4ab4f;
|
||||
}
|
||||
.breadcrumb-item .icon-cancel-circled:hover {
|
||||
color: #ff7700;
|
||||
}
|
||||
|
||||
.filter-validate .loading {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.filter-album-form .add-album-button {
|
||||
width: fit-content;
|
||||
}
|
||||
Reference in New Issue
Block a user