|
html, body { |
|
background-color: black; |
|
color: #fff; |
|
font-family: 'Poppins', sans-serif; |
|
font-size: 16px; |
|
margin: 0; |
|
padding: 0; |
|
height: 100%; |
|
} |
|
|
|
h3 { |
|
margin: 5px; |
|
} |
|
|
|
h4 { |
|
margin: 0px; |
|
font-weight: normal; |
|
text-align: center; |
|
line-height: 150%; |
|
} |
|
|
|
#layout { |
|
display: flex; |
|
flex-direction: column; |
|
height: 100%; |
|
} |
|
|
|
#rows { |
|
display: flex; |
|
flex-direction: row; |
|
flex-grow: 1; |
|
overflow: auto; |
|
} |
|
|
|
#toggles { |
|
position: fixed; |
|
top: 0; |
|
left: 0; |
|
width: calc(40% - 20px); |
|
height: calc(100% - 80px); |
|
display: flex; |
|
flex-direction: column; |
|
flex-wrap: wrap; |
|
opacity: 1; |
|
line-height: 140%; |
|
padding: 20px; |
|
overflow: auto; |
|
transition: opacity 50ms 100ms linear; |
|
} |
|
|
|
#gutter { |
|
position: fixed; |
|
z-index: 1; |
|
top: 0; |
|
left: 40%; |
|
width: 50px; |
|
height: calc(100% - 40px); |
|
flex-shrink: 0; |
|
background: black; |
|
background: linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 40%); |
|
} |
|
|
|
#gutter:hover { |
|
background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.1) 40%) |
|
} |
|
|
|
#gutter div { |
|
position: relative; |
|
width: 20px; |
|
height: 100%; |
|
position: relative; |
|
left: 20px; |
|
border-right: 1px solid rgba(255,255,255,0.2); |
|
cursor: col-resize; |
|
} |
|
|
|
#gutter:hover div { |
|
border-right: 1px solid rgba(255,255,255,0.4); |
|
} |
|
|
|
#gutter div[data-tooltip]::before { |
|
content: attr(data-tooltip); |
|
opacity: 0; |
|
transition: opacity 0ms 0ms linear; |
|
} |
|
|
|
#gutter div[data-tooltip]:hover::before { |
|
content: attr(data-tooltip); |
|
position: absolute; |
|
top: 20px; |
|
left: 50%; |
|
transform: translateX(-40%); |
|
background-color: #555; |
|
padding: 4px 8px; |
|
border-radius: 4px; |
|
box-shadow: 0 5px 10px black; |
|
white-space: nowrap; |
|
font-size: 12px; |
|
color: white; |
|
opacity: 1; |
|
transition: opacity 100ms 500ms linear; |
|
pointer-events: none; |
|
} |
|
|
|
@keyframes gutter_tease { |
|
0% { |
|
transform: translateX(-40px); |
|
border-right: 1px solid #ffe300b5; |
|
} |
|
10% { |
|
transform: translateX(0px); |
|
} |
|
20% { |
|
transform: translateX(40px); |
|
} |
|
30% { |
|
transform: translateX(-20px); |
|
} |
|
40% { |
|
transform: translateX(0px); |
|
} |
|
50% { |
|
transform: translateX(20px); |
|
} |
|
60% { |
|
transform: translateX(-5px); |
|
} |
|
70% { |
|
transform: translateX(0px); |
|
} |
|
80% { |
|
transform: translateX(5px); |
|
border-right: 1px solid #ffe300b5; |
|
} |
|
90% { |
|
transform: translateX(0px); |
|
} |
|
} |
|
|
|
#image-container { |
|
display: flex; |
|
flex-direction: row; |
|
flex-wrap: wrap; |
|
align-items: flex-start; |
|
justify-content: space-around; |
|
margin-left: calc(40% + 50px); |
|
margin-top: 20px; |
|
margin-bottom: 20px; |
|
width: 100%; |
|
} |
|
|
|
#alert { |
|
position: fixed; |
|
z-index: 1; |
|
opacity: 0; |
|
top: 10px; |
|
right: -52px; |
|
padding: 10px; |
|
color: #00ffe6; |
|
background-color: #008679; |
|
border: 1px solid #00ffe6; |
|
border-radius: 3px; |
|
box-shadow: 0 5px 20px #0000007d; |
|
} |
|
|
|
#alert.left { |
|
left: -52px; |
|
right: initial; |
|
} |
|
|
|
#alert.show { |
|
right: 12px; |
|
opacity: 1; |
|
transition: all 100ms ease-in; |
|
} |
|
|
|
#alert.left.show { |
|
left: 12px; |
|
right: initial; |
|
opacity: 1; |
|
transition: all 100ms ease-in; |
|
} |
|
|
|
footer { |
|
flex-shrink: 0; |
|
padding: 5px 10px; |
|
text-align: center; |
|
color: #aaa; |
|
background-color: #222; |
|
border-top: 1px solid black; |
|
font-size: 12px; |
|
} |
|
|
|
footer.special { |
|
color: #00ffe6; |
|
background-color: #008679; |
|
font-size: 14px; |
|
} |
|
|
|
footer > div { |
|
position: relative; |
|
opacity: 0.8; |
|
} |
|
|
|
footer a { |
|
text-decoration: none; |
|
color: #fff; |
|
} |
|
|
|
footer span strong { |
|
font-weight: bold; |
|
color: #fff; |
|
} |
|
|
|
#close_footer { |
|
position: absolute; |
|
top: 0; |
|
right: 0; |
|
} |
|
|
|
footer #close_footer strong { |
|
display: block; |
|
background-color: #aaa; |
|
color: #222; |
|
border-radius: 40px; |
|
line-height: 150%; |
|
cursor: pointer; |
|
} |
|
|
|
footer.special #close_footer strong { |
|
background-color: #00ffe6; |
|
color: #008679; |
|
} |
|
|
|
#layout.footerHidden #toggles { |
|
height: calc(100% - 40px); |
|
} |
|
|
|
#layout.footerHidden #gutter { |
|
height: calc(100%); |
|
} |
|
|
|
#layout.footerHidden footer { |
|
display: none; |
|
} |
|
|
|
.divider { |
|
border-bottom: 1px solid #333; |
|
margin: 10px 40px 5px 0; |
|
} |
|
|
|
#toggles.hide { |
|
opacity: 0; |
|
transition: opacity 50ms linear; |
|
} |
|
|
|
#options_prompts { |
|
display: none; |
|
} |
|
|
|
#options_info, |
|
#options_prompts, |
|
#options_artist_sort, |
|
#options_tag_sort { |
|
margin-right: 10px; |
|
} |
|
|
|
#options_prompts > span:first-child, |
|
#options_artist_sort > span:first-child, |
|
#options_tag_sort > span:first-child { |
|
margin-left: 21px; |
|
} |
|
|
|
#toggles #options_info .count { |
|
color: #ffe300; |
|
opacity: 0.8; |
|
font-weight: bold; |
|
} |
|
|
|
#options_info i { |
|
box-sizing: border-box; |
|
padding: 1px 7px 1px 5px; |
|
background-color: #777; |
|
border: 1px solid #ddd; |
|
border-radius: 2px; |
|
font-size: 12px; |
|
} |
|
|
|
#toggles label { |
|
margin: 0 20px 0 0; |
|
white-space: nowrap; |
|
opacity: 0.8; |
|
cursor: pointer; |
|
} |
|
|
|
#toggles label:hover { |
|
opacity: 1; |
|
} |
|
|
|
#toggles #artistsShown { |
|
margin: 0 0 0 21px; |
|
white-space: nowrap; |
|
position: relative; |
|
top: 1px; |
|
color: #ffe300; |
|
opacity: 0.8; |
|
} |
|
|
|
#toggles label.top_all { |
|
font-weight: bold; |
|
} |
|
|
|
#toggles label.top_control { |
|
color: #ffe300; |
|
} |
|
|
|
#toggles label.top_control.warning { |
|
color: #ff0000; |
|
} |
|
|
|
#toggles label.no_matches { |
|
opacity: 0.3; |
|
cursor: default; |
|
} |
|
|
|
#toggles label.category { |
|
color: #00d5c0; |
|
font-weight: bold; |
|
padding-bottom: 5px; |
|
margin: 10px 40px 0 0; |
|
border-bottom: 1px solid #333; |
|
} |
|
|
|
#toggles label.hidden { |
|
display: none; |
|
} |
|
|
|
#toggles label .most_used_indicator { |
|
display: inline-block; |
|
width: 14px; |
|
height: 14px; |
|
visibility: hidden; |
|
margin-right: -14px; |
|
position: relative; |
|
top: 1px; |
|
left: 4px; |
|
color: #ffe300; |
|
font-style: normal; |
|
} |
|
|
|
#toggles #artistsMatching { |
|
opacity: 0.8; |
|
cursor: default; |
|
} |
|
|
|
#toggles .count { |
|
opacity: 0.5; |
|
} |
|
|
|
#toggles .link { |
|
display: inline-block; |
|
width: 20px; |
|
height: 20px; |
|
opacity: 0.7; |
|
cursor: pointer; |
|
box-sizing: border-box; |
|
margin-left: 5px; |
|
padding-left: 2px; |
|
border-radius: 4px; |
|
line-height: 130%; |
|
} |
|
|
|
#toggles .link.selected { |
|
background-color: #444; |
|
opacity: 1; |
|
cursor: default; |
|
} |
|
|
|
#toggles .link:hover { |
|
opacity: 1; |
|
} |
|
|
|
#toggles .link:hover::after { |
|
position: absolute; |
|
top: 20px; |
|
left: 20px; |
|
background-color: black; |
|
padding: 0px 4px; |
|
border: 1px solid #777; |
|
border-radius: 3px; |
|
color: #ddd; |
|
box-shadow: 0 5px 10px black; |
|
} |
|
|
|
#infoI:hover::after { |
|
content: 'instructions'; |
|
} |
|
|
|
#infoA:hover::after { |
|
content: 'about'; |
|
} |
|
|
|
#infoX:hover::after { |
|
content: 'export'; |
|
} |
|
|
|
#promptA:hover::after { |
|
content: 'artwork'; |
|
} |
|
|
|
#promptP:hover::after { |
|
content: 'portraits'; |
|
} |
|
|
|
#promptL:hover::after { |
|
content: 'landscapes'; |
|
} |
|
|
|
#sortAA:hover::after { |
|
content: 'alpha'; |
|
} |
|
|
|
#sortAR:hover::after { |
|
content: 'random'; |
|
} |
|
|
|
#sortTA:hover::after { |
|
content: 'alpha'; |
|
} |
|
|
|
#sortTC:hover::after { |
|
content: 'count'; |
|
} |
|
|
|
#info_switcher { |
|
display: flex; |
|
flex-direction: row; |
|
background-color: #111; |
|
} |
|
|
|
#info_switcher h2 { |
|
margin: 0; |
|
padding: 20px; |
|
white-space: nowrap; |
|
font-size: 16px; |
|
cursor: pointer; |
|
} |
|
|
|
#info_switcher h2:hover { |
|
background-color: #222; |
|
} |
|
|
|
#info_switcher h2.selected { |
|
background-color: #222; |
|
cursor: default; |
|
} |
|
|
|
#info_closer { |
|
position: absolute; |
|
right: 0; |
|
font-weight: normal; |
|
color: #555 |
|
} |
|
|
|
#information { |
|
display: none; |
|
flex-direction: column; |
|
z-index: 2; |
|
position: fixed; |
|
top: 50%; |
|
left: 50%; |
|
transform: translateX(-50%) translateY(-50%); |
|
width: 50%; |
|
max-width: 600px; |
|
height: 50%; |
|
border: 4px solid #ffe30080; |
|
border-radius: 20px; |
|
box-shadow: 0 10px 20px #000; |
|
background-color: #222; |
|
overflow: hidden; |
|
} |
|
|
|
#information.shown { |
|
display: flex; |
|
} |
|
|
|
.information_section { |
|
display: none; |
|
padding: 20px; |
|
box-sizing: border-box; |
|
overflow-y: scroll; |
|
} |
|
|
|
.information_section.selected { |
|
display: block; |
|
} |
|
|
|
.information_section h2, .information_section h3, .information_section ul{ |
|
margin-top: 0; |
|
margin-left: 0; |
|
} |
|
|
|
.information_section h3 { |
|
margin-bottom: 10px; |
|
font-size: 16px; |
|
color: #ffe300; |
|
} |
|
|
|
.information_section a { |
|
color: #00ffe7; |
|
font-weight: bold; |
|
text-decoration: none; |
|
} |
|
|
|
.information_section a:hover { |
|
color: #fff; |
|
} |
|
|
|
.information_section .buttons { |
|
display: flex; |
|
flex-direction: row; |
|
margin-bottom: 20px; |
|
} |
|
|
|
.information_section .buttons div { |
|
display: inline-block; |
|
margin-right: 10px; |
|
padding: 4px 8px; |
|
opacity: 0.8; |
|
border: 1px solid #ffe300; |
|
border-radius: 4px; |
|
cursor: pointer; |
|
white-space: nowrap; |
|
background-color: black; |
|
color: #ffe300; |
|
font-size: 12px; |
|
font-weight: bold; |
|
transition: opacity 100ms 200ms linear; |
|
} |
|
|
|
.information_section .buttons div:hover { |
|
opacity: 1; |
|
transition: opacity 100ms 0ms linear; |
|
} |
|
|
|
#information_actions { |
|
display: flex; |
|
flex-direction: column; |
|
} |
|
|
|
#info_search_input { |
|
width: 100%; |
|
margin-bottom: 20px; |
|
box-sizing: border-box; |
|
padding: 10px; |
|
border-radius: 4px; |
|
border: none; |
|
font-size: 16px; |
|
} |
|
|
|
#info_search_output { |
|
flex-grow: 1; |
|
|
|
min-height: 35px; |
|
display: flex; |
|
flex-direction: column; |
|
overflow-y: scroll; |
|
background-color: #333; |
|
border-radius: 4px; |
|
} |
|
|
|
#info_search_output label { |
|
opacity: 0.8; |
|
padding: 5px; |
|
} |
|
|
|
#info_search_output label:hover { |
|
opacity: 1; |
|
} |
|
|
|
#info_search_output label.hidden::after { |
|
content: 'low-use is hidden'; |
|
margin-left: 10px; |
|
position: relative; |
|
bottom: 1px; |
|
padding: 0px 6px; |
|
box-sizing: border-box; |
|
font-size: 12px; |
|
color: #00ffe5; |
|
background-color: black; |
|
border-radius: 2px; |
|
} |
|
|
|
#info_search_output i { |
|
display: none; |
|
} |
|
|
|
#info_search_output .count { |
|
opacity: 0.5; |
|
} |
|
|
|
#info_search_output input { |
|
margin-right: 10px; |
|
} |
|
|
|
#information_export textarea { |
|
width: 90%; |
|
height: 150px; |
|
margin-bottom: 10px; |
|
resize: vertical; |
|
background-color: #777; |
|
border: none; |
|
} |
|
|
|
#information_export #export_edits_list, |
|
#information_export #export_artists_list { |
|
background-color: #bbb; |
|
cursor: not-allowed; |
|
} |
|
|
|
#information_export #import_favorites_button, |
|
#information_export #delete_edits_button { |
|
color: #f77; |
|
border: 1px solid #f77; |
|
} |
|
|
|
#information_export #import_favorites_button:hover, |
|
#information_export #delete_edits_button:hover { |
|
opacity: 1; |
|
color: #f77; |
|
} |
|
|
|
#filtersHidingAll { |
|
display: none; |
|
font-size: 24px; |
|
color: #444; |
|
text-align: center; |
|
font-weight: bold; |
|
position: relative; |
|
top: 50%; |
|
transform: translate(0%, -50%); |
|
margin: 0 40px; |
|
line-height: 220%; |
|
} |
|
|
|
#filtersHidingAll.shown { |
|
display: block; |
|
} |
|
|
|
.image-item { |
|
position: relative; |
|
display: flex; |
|
flex-direction: column; |
|
align-items: center; |
|
padding: 10px; |
|
width: 256px; |
|
background-color: #222; |
|
border-radius: 2px; |
|
margin: 0 5px 20px 5px; |
|
box-shadow: 0 1px 0px #ffffff3d; |
|
border: 1px solid black; |
|
overflow: hidden; |
|
} |
|
|
|
.image-item.hidden { |
|
display: none; |
|
} |
|
|
|
.image-item > span { |
|
height: 84px; |
|
position: relative; |
|
display: block; |
|
width: 100%; |
|
} |
|
|
|
.image-item h3 { |
|
display: flex; |
|
justify-content: center; |
|
opacity: 0.8; |
|
cursor: pointer; |
|
height: 22px; |
|
} |
|
|
|
.image-item h4 { |
|
width: 258px; |
|
height: 52px; |
|
opacity: 0.5; |
|
cursor: pointer; |
|
overflow: hidden; |
|
position: absolute; |
|
left: -1px; |
|
padding-bottom: 6px; |
|
box-sizing: border-box; |
|
} |
|
|
|
.image-item h3:hover { |
|
opacity: 1; |
|
} |
|
|
|
.image-item h4:hover { |
|
z-index: 1; |
|
height: initial; |
|
opacity: 1; |
|
background-color: #222; |
|
border-bottom: 1px solid #111; |
|
color: #aaa; |
|
} |
|
|
|
.image-item h4.edit_mode { |
|
z-index: 1; |
|
top: 40px; |
|
width: 206px; |
|
height: 304px; |
|
box-sizing: border-box; |
|
padding: 6px 4px; |
|
display: flex; |
|
flex-direction: column; |
|
overflow-y: scroll; |
|
overflow-x: hidden; |
|
background-color: #fbc1c1; |
|
border-radius: 4px; |
|
border: 2px solid #b30000; |
|
box-shadow: inset 0px 3px 4px #00000096; |
|
text-align: left; |
|
font-size: 14px; |
|
color: #000; |
|
opacity: 1; |
|
cursor: default; |
|
} |
|
|
|
.image-item h4.edit_mode label { |
|
cursor: pointer; |
|
} |
|
|
|
#edit_mode_helper { |
|
position: relative; |
|
z-index: 2; |
|
display: flex; |
|
flex-direction: column; |
|
padding: 10px 0 0 20px; |
|
background-color: white; |
|
color: #777; |
|
} |
|
|
|
#edit_mode_helper span { |
|
white-space: nowrap; |
|
cursor: pointer; |
|
} |
|
|
|
.image-item .firstN { |
|
margin-right: 8px; |
|
white-space: nowrap; |
|
} |
|
|
|
.image-item .lastN { |
|
white-space: nowrap; |
|
} |
|
|
|
.image-item > div { |
|
width: 256px; |
|
height: 256px; |
|
text-align: center; |
|
border: 1px solid black; |
|
border-radius: 2px; |
|
overflow: hidden; |
|
} |
|
|
|
.image-item .imgTools { |
|
position: relative; |
|
height: 100%; |
|
background-color: #666; |
|
opacity: 0; |
|
transition: opacity 200ms 50ms linear; |
|
} |
|
|
|
.image-item:hover .imgTools { |
|
opacity: 1; |
|
} |
|
|
|
.image-item .imgTools > div { |
|
position: absolute; |
|
opacity: 0.7; |
|
cursor: pointer; |
|
} |
|
|
|
.image-item .imgTools > div:hover { |
|
opacity: 1; |
|
} |
|
|
|
.image-item .imgTools span { |
|
position: absolute; |
|
display: block; |
|
width: 24px; |
|
height: 24px; |
|
border-radius: 4px; |
|
top: 50%; |
|
left: 50%; |
|
transform: translate(-50%, -50%); |
|
box-sizing: border-box; |
|
background-color: #545454; |
|
box-shadow: 0 0 5px #777 |
|
} |
|
|
|
.image-item .art_prev { |
|
bottom: 0; |
|
left: 0; |
|
width: 50px; |
|
height: 50px; |
|
background-color: #333; |
|
border-radius: 0px 4px 0px 0px; |
|
} |
|
|
|
.image-item .art_next { |
|
bottom: 0; |
|
right: 0; |
|
width: 50px; |
|
height: 50px; |
|
background-color: #333; |
|
border-radius: 4px 0px 0px 0px; |
|
} |
|
|
|
.image-item .art_edit { |
|
top: 0; |
|
right: 0; |
|
width: 50px; |
|
height: 50px; |
|
background-color: #333; |
|
border-radius: 0px 0px 0px 4px; |
|
} |
|
|
|
.image-item .art_star { |
|
top: 0; |
|
left: 64px; |
|
width: 128px; |
|
height: 100%; |
|
} |
|
|
|
.image-item .art_star span { |
|
font-size: 48px; |
|
width: 60px; |
|
height: 60px; |
|
line-height: 120%; |
|
padding: 0; |
|
filter: grayscale(100%); |
|
background-color: initial; |
|
box-shadow: none; |
|
} |
|
|
|
.image-item .imgBox { |
|
position: relative; |
|
z-index: 0; |
|
top: -256px; |
|
left: 0px; |
|
width: 256px; |
|
aspect-ratio: 1 / 1.33; |
|
overflow: hidden; |
|
border-radius: 2px; |
|
background-color: #111; |
|
text-align: left; |
|
cursor: pointer; |
|
animation-name: reduce; |
|
animation-duration: 100ms; |
|
animation-timing-function: linear; |
|
animation-iteration-count: 1; |
|
animation-direction: forward; |
|
} |
|
|
|
.image-item:hover .imgBox { |
|
position: fixed; |
|
z-index: 1; |
|
top: 0px; |
|
left: 20px; |
|
|
|
width: 40%; |
|
cursor: not-allowed; |
|
transform: translateY(20px); |
|
animation-name: enlarge; |
|
animation-duration: 100ms; |
|
animation-timing-function: east-out; |
|
animation-iteration-count: 1; |
|
animation-direction: forward; |
|
} |
|
|
|
@keyframes enlarge { |
|
0% { |
|
opacity: 0; |
|
transform: translateY(0px); |
|
} |
|
100% { |
|
opacity: 1; |
|
transform: translateY(20px); |
|
} |
|
} |
|
|
|
@keyframes reduce { |
|
0% { |
|
opacity: 0; |
|
} |
|
100% { |
|
opacity: 1; |
|
} |
|
} |
|
|
|
.image-item .deprecated { |
|
color: #888; |
|
text-align: center; |
|
display: block; |
|
padding: 70px 40px 0px 40px; |
|
} |
|
|
|
.image-item img { |
|
display: block; |
|
width: 256px; |
|
position: absolute; |
|
top: 0; |
|
} |
|
|
|
.image-item .imgBox img.hidden { |
|
display: none; |
|
} |
|
|
|
.image-item:hover .imgBox img { |
|
width: 100%; |
|
z-index: 1; |
|
box-shadow: -10px 10px 20px rgba(0,0,0,0.6); |
|
} |
|
|
|
.image-item:hover .imgBox img.hidden { |
|
display: initial; |
|
width: 33%; |
|
position: relative; |
|
top: 75%; |
|
box-shadow: initial; |
|
z-index: 0; |
|
} |
|
|
|
.image-item.favorite { |
|
border: 1px solid #ffc10080; |
|
box-shadow: 0 0px 15px #ffe20045; |
|
} |
|
|
|
.image-item.favorite .art_star span { |
|
filter: grayscale(0%); |
|
} |
|
|
|
.image-item.edit_mode { |
|
border: 1px solid #f00; |
|
box-shadow: 0 0px 15px #ff0000b8; |
|
} |
|
|
|
#layout.edit_mode #toggles { |
|
width: calc(100% - 40px); |
|
transition: width 200ms ease-out; |
|
} |
|
|
|
#layout.edit_mode #gutter { |
|
left: calc(100% - 40px); |
|
transition: left 200ms ease-out; |
|
} |
|
|
|
#layout.edit_mode #image-container { |
|
opacity: 0.2; |
|
margin-left: 100%; |
|
overflow: hidden; |
|
transition: width 200ms ease-out; |
|
} |
|
|
|
#edit_most_used { |
|
color: #ffe300; |
|
opacity: 0.8; |
|
cursor: pointer; |
|
margin: 5px 0 0 21px; |
|
} |
|
|
|
#edit_most_used:hover { |
|
opacity: 1; |
|
} |
|
|
|
#edit_most_used.hidden { |
|
display: none; |
|
} |
|
|
|
#layout.edit_mode #edit_most_used { |
|
font-weight: bold; |
|
color: #ff0000; |
|
} |
|
|
|
#layout.edit_mode .top_control, |
|
#layout.edit_mode .divider, |
|
#layout.edit_mode #options_prompts, |
|
#layout.edit_mode #options_tag_sort, |
|
#layout.edit_mode #options_artist_sort, |
|
#layout.edit_mode #options_info, |
|
#layout.edit_mode .category .count { |
|
visibility: hidden; |
|
} |
|
|
|
#layout.edit_mode .category { |
|
color: #fff; |
|
opacity: 0.5; |
|
} |
|
|
|
#layout.edit_mode .category:hover { |
|
cursor: default; |
|
opacity: 0.5; |
|
} |
|
|
|
#layout.edit_mode [data-category-name="important"] { |
|
opacity: 1; |
|
color: #ffe300; |
|
} |
|
|
|
#layout.edit_mode [data-category-name="important"]:hover { |
|
opacity: 1; |
|
} |
|
|
|
#layout.edit_mode #toggles .was_moved { |
|
font-weight: bold; |
|
color: #ffe300; |
|
} |
|
|
|
#layout.edit_mode #toggles input { |
|
visibility: hidden; |
|
} |
|
|
|
#layout.edit_mode #toggles .most_used_indicator { |
|
visibility: visible; |
|
} |
|
|
