Hello, i’m using the Enhanced cloze add-on, on both desktop and mobile version. I use night mode on both, but the color are strange in Anki Droid.
Here’s the full CSS code:
#card-body {
font: 17px/1.65em ‘Avenir Next’;
text-align: justify;
margin-top: 50px;
margin-bottom: 60px;
}
#card-body .title{
font: bold 20px/1.65em ‘Avenir Next’;
margin-bottom: 5px;
text-align: center;
}
.content {
padding-left: 0.5em;
border-left: 4px solid transparent;
}
.header {
font: bold 17px/1.5em;
padding-left: 0.5em;
}
.header-red {
border-left: 4px solid #db4437;
color: #db4437;
}
.header-green {
border-left: 4px solid #0f9d58;
color: #0f9d58;
}
.header-blue {
border-left: 4px solid #4285f4;
color: #4285f4;
}
.header-yellow {
border-left: 4px solid #f4b400;
color: #f4b400;
}
.genuine-cloze[show-state=“hint”] {
border-bottom: 2px solid #ff5c82;
background-color: #ff96af;
}
.pseudo-cloze[show-state=“hint”] {
border-bottom: 2px solid #4285f4;
background-color: #87b1ff;
}
#show-one-cloze-left,
#show-one-cloze-right,
#no-more-cloze {
height: 100%;
width: 30px;
position: fixed;
z-index: 9;
top: 0;
background-color: transparent;
}
#show-one-cloze-left {
left: 0;
}
#show-one-cloze-right {
right: 0;
}
#no-more-cloze {
width: 10px;
background-color: #db4437;
left: 0;
display: none;
}
#show-all-pseudo-clozes {
height: 20px;
width: 100%;
position: fixed;
z-index: 9;
top: 0;
left: 0;
background-color: transparent;
}
.mobile ol,
.mobile ul,
.mobile li {
margin-left: -0.5em;
}
.mobile li {
margin: 0.1em, inherit;
}
table {
border-collapse: collapse;
margin: 0.5em;
}
thead tr,
tfoot tr {
border-top: 2px solid #0f9d58;
border-bottom: 2px solid #0f9d58;
}
td,
th {
border: 1px solid #0f9d58;
padding: 0.3em 0.5em;
}
hr {
border-top: 1px solid #aaaaaa;
width: 100%;
margin: 0;
padding: 0;
}
pre {
border-left: 2px solid #0f9d58;
padding-left: 10px;
}
code,
kbd,
var,
samp,
tt {
background-color: #fdf3d6;
}
.disable-select {
-webkit-touch-callout: none;
user-select: none;
}