mirror of https://gitlab.com/bashrc2/epicyon
Change the implementation of grayscale
parent
7ec9ecfc6e
commit
dabf1334fd
|
|
@ -1,5 +1,4 @@
|
|||
:root {
|
||||
--grayscale: 0%;
|
||||
--main-bg-color: #282c37;
|
||||
--calendar-bg-color: #eee;
|
||||
--lines-color: black;
|
||||
|
|
@ -39,7 +38,6 @@ body {
|
|||
font-family: 'Montserrat';
|
||||
font-weight: 700;
|
||||
min-height: 100vh;
|
||||
filter: grayscale(var(--grayscale));
|
||||
}
|
||||
|
||||
main {
|
||||
|
|
@ -182,12 +180,10 @@ tr:nth-child(even) > .calendar__day__cell:nth-child(even) {
|
|||
}
|
||||
|
||||
.calendardayicon {
|
||||
filter: grayscale(var(--grayscale));
|
||||
width: 100%
|
||||
}
|
||||
|
||||
.buttonprev {
|
||||
filter: grayscale(var(--grayscale));
|
||||
float: left;
|
||||
width: 10%;
|
||||
-ms-transform: translateY(30%);
|
||||
|
|
@ -195,7 +191,6 @@ tr:nth-child(even) > .calendar__day__cell:nth-child(even) {
|
|||
}
|
||||
|
||||
.buttonnext {
|
||||
filter: grayscale(var(--grayscale));
|
||||
float: right;
|
||||
width: 10%;
|
||||
-ms-transform: translateY(30%) scaleX(-1);
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
@charset "UTF-8";
|
||||
|
||||
:root {
|
||||
--grayscale: 0%;
|
||||
--main-bg-color: #282c37;
|
||||
--link-bg-color: #282c37;
|
||||
--main-fg-color: #dddddd;
|
||||
|
|
@ -50,7 +49,6 @@ body, html {
|
|||
max-width: 100%;
|
||||
min-width: 600px;
|
||||
margin: 5% auto;
|
||||
filter: grayscale(var(--grayscale));
|
||||
}
|
||||
|
||||
a, u {
|
||||
|
|
@ -91,7 +89,6 @@ a:link {
|
|||
}
|
||||
|
||||
.followAvatar img {
|
||||
filter: grayscale(var(--grayscale));
|
||||
border-radius: 10%;
|
||||
width: 20%;
|
||||
min-width: 200px;
|
||||
|
|
@ -171,7 +168,6 @@ input[type=text] {
|
|||
}
|
||||
|
||||
.options img {
|
||||
filter: grayscale(var(--grayscale));
|
||||
width: 15%;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
@charset "UTF-8";
|
||||
|
||||
:root {
|
||||
--grayscale: 0%;
|
||||
--main-bg-color: #282c37;
|
||||
--link-bg-color: #282c37;
|
||||
--main-fg-color: #dddddd;
|
||||
|
|
@ -41,7 +40,6 @@ body, html {
|
|||
min-width: 600px;
|
||||
margin: 0 auto;
|
||||
font-size: var(--font-size);
|
||||
filter: grayscale(var(--grayscale));
|
||||
}
|
||||
|
||||
a, u {
|
||||
|
|
@ -98,13 +96,11 @@ button:hover {
|
|||
}
|
||||
|
||||
.imgcontainer {
|
||||
filter: grayscale(var(--grayscale));
|
||||
text-align: center;
|
||||
margin: 24px 0 12px 0;
|
||||
}
|
||||
|
||||
img.avatar {
|
||||
filter: grayscale(var(--grayscale));
|
||||
width: 40%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
@charset "UTF-8";
|
||||
|
||||
:root {
|
||||
--grayscale: 0%;
|
||||
--main-bg-color: #282c37;
|
||||
--link-bg-color: #282c37;
|
||||
--dropdown-fg-color: #dddddd;
|
||||
|
|
@ -71,7 +70,6 @@ body, html {
|
|||
min-width: 950px;
|
||||
margin: 0 auto;
|
||||
font-size: var(--font-size);
|
||||
filter: grayscale(var(--grayscale));
|
||||
}
|
||||
|
||||
a, u {
|
||||
|
|
@ -109,7 +107,6 @@ a:link {
|
|||
}
|
||||
|
||||
.rssfeed img {
|
||||
filter: grayscale(var(--grayscale));
|
||||
width: 5%;
|
||||
float: right;
|
||||
}
|
||||
|
|
@ -147,7 +144,6 @@ a:link {
|
|||
}
|
||||
|
||||
.hero-image img {
|
||||
filter: grayscale(var(--grayscale));
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
|
|
@ -179,7 +175,6 @@ a:link {
|
|||
}
|
||||
|
||||
.hero-text img.emoji {
|
||||
filter: grayscale(var(--grayscale));
|
||||
width: 50px;
|
||||
padding: 0 0;
|
||||
margin: 0 0;
|
||||
|
|
@ -311,7 +306,6 @@ a:link {
|
|||
}
|
||||
|
||||
.container img.emoji {
|
||||
filter: grayscale(var(--grayscale));
|
||||
float: none;
|
||||
width: 50px;
|
||||
margin-left: 0px;
|
||||
|
|
@ -322,7 +316,6 @@ a:link {
|
|||
}
|
||||
|
||||
.hero-text img.emojiprofile {
|
||||
filter: grayscale(var(--grayscale));
|
||||
float: none;
|
||||
width: 50px;
|
||||
margin-left: 0px;
|
||||
|
|
@ -356,7 +349,6 @@ a:link {
|
|||
}
|
||||
|
||||
.container img.announceOrReply {
|
||||
filter: grayscale(var(--grayscale));
|
||||
float: none;
|
||||
width: 30px;
|
||||
margin: 0 0;
|
||||
|
|
@ -366,7 +358,6 @@ a:link {
|
|||
}
|
||||
|
||||
.container img.DMicon {
|
||||
filter: grayscale(var(--grayscale));
|
||||
float: none;
|
||||
width: 40px;
|
||||
margin: 0 0;
|
||||
|
|
@ -389,14 +380,12 @@ a:link {
|
|||
}
|
||||
|
||||
.container img.attachment {
|
||||
filter: grayscale(var(--grayscale));
|
||||
max-width: 120%;
|
||||
margin-left: 5%;
|
||||
width: 120%;
|
||||
padding-bottom: 3%;
|
||||
}
|
||||
.container img.right {
|
||||
filter: grayscale(var(--grayscale));
|
||||
float: var(--icons-side);
|
||||
margin-left: 0px;
|
||||
margin-right:0;
|
||||
|
|
@ -404,7 +393,6 @@ a:link {
|
|||
margin: 0 0;
|
||||
}
|
||||
.containericons img.right {
|
||||
filter: grayscale(var(--grayscale));
|
||||
float: var(--icons-side);
|
||||
margin-left: 20px;
|
||||
margin-right: 0;
|
||||
|
|
@ -538,7 +526,6 @@ input[type=submit]:hover {
|
|||
}
|
||||
|
||||
.dropdown img {
|
||||
filter: grayscale(var(--grayscale));
|
||||
opacity: 1.0;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
|
|
@ -563,7 +550,6 @@ input[type=submit]:hover {
|
|||
}
|
||||
|
||||
.search-result img {
|
||||
filter: grayscale(var(--grayscale));
|
||||
width: 7%;
|
||||
padding: 0px 30px;
|
||||
}
|
||||
|
|
@ -588,7 +574,6 @@ input[type=submit]:hover {
|
|||
}
|
||||
|
||||
.dropdown-content img {
|
||||
filter: grayscale(var(--grayscale));
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
padding: 0px 0px;
|
||||
|
|
@ -638,7 +623,6 @@ input[type=submit]:hover {
|
|||
}
|
||||
|
||||
.dropbtn img {
|
||||
filter: grayscale(var(--grayscale));
|
||||
opacity: 1.0;
|
||||
width: 3%;
|
||||
height: 3%;
|
||||
|
|
@ -652,7 +636,6 @@ div.gallery:hover {
|
|||
}
|
||||
|
||||
div.gallery img {
|
||||
filter: grayscale(var(--grayscale));
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
|
@ -896,7 +879,6 @@ aside .toggle-inside li {
|
|||
text-align: center;
|
||||
}
|
||||
.container img {
|
||||
filter: grayscale(var(--grayscale));
|
||||
float: left;
|
||||
max-width: 400px;
|
||||
width: 5%;
|
||||
|
|
@ -905,12 +887,10 @@ aside .toggle-inside li {
|
|||
border-radius: var(--image-corners);
|
||||
}
|
||||
.container img.emojisearch {
|
||||
filter: grayscale(var(--grayscale));
|
||||
width: 15%;
|
||||
float: right;
|
||||
}
|
||||
.container img.emojicalendar {
|
||||
filter: grayscale(var(--grayscale));
|
||||
float: left;
|
||||
max-width: 400px;
|
||||
width: 8%;
|
||||
|
|
@ -918,7 +898,6 @@ aside .toggle-inside li {
|
|||
transform: translateY(-25%);
|
||||
}
|
||||
.container img.timelineicon {
|
||||
filter: grayscale(var(--grayscale));
|
||||
float: var(--icons-side);
|
||||
margin-left: 0px;
|
||||
margin-right:0;
|
||||
|
|
@ -927,7 +906,6 @@ aside .toggle-inside li {
|
|||
width: 50px;
|
||||
}
|
||||
.container img.emojiheader {
|
||||
filter: grayscale(var(--grayscale));
|
||||
float: none;
|
||||
width: 25px;
|
||||
margin-left: 0px;
|
||||
|
|
@ -937,7 +915,6 @@ aside .toggle-inside li {
|
|||
vertical-align: middle;
|
||||
}
|
||||
.containericons img {
|
||||
filter: grayscale(var(--grayscale));
|
||||
float: var(--icons-side);
|
||||
max-width: 200px;
|
||||
width: 3%;
|
||||
|
|
@ -945,7 +922,6 @@ aside .toggle-inside li {
|
|||
border-radius: 0%;
|
||||
}
|
||||
div.mediaicons img {
|
||||
filter: grayscale(var(--grayscale));
|
||||
float: right;
|
||||
max-width: 200px;
|
||||
width: 6%;
|
||||
|
|
@ -953,7 +929,6 @@ aside .toggle-inside li {
|
|||
border-radius: 0%;
|
||||
}
|
||||
div.mediaavatar img {
|
||||
filter: grayscale(var(--grayscale));
|
||||
float: left;
|
||||
max-width: 200px;
|
||||
width: 5%;
|
||||
|
|
@ -961,7 +936,6 @@ aside .toggle-inside li {
|
|||
border-radius: 0%;
|
||||
}
|
||||
.timeline-avatar img {
|
||||
filter: grayscale(var(--grayscale));
|
||||
opacity: 1.0;
|
||||
width: 8%;
|
||||
height: 8%;
|
||||
|
|
@ -1217,24 +1191,20 @@ aside .toggle-inside li {
|
|||
font-family: Arial, Helvetica, sans-serif;
|
||||
}
|
||||
.hero-text img.qrcode {
|
||||
filter: grayscale(var(--grayscale));
|
||||
border-radius: 1%;
|
||||
width: 5%;
|
||||
min-width: 20px;
|
||||
}
|
||||
.hero-text img.title {
|
||||
filter: grayscale(var(--grayscale));
|
||||
border-radius: 1%;
|
||||
width: 15%;
|
||||
}
|
||||
#msgscope label img {
|
||||
filter: grayscale(var(--grayscale));
|
||||
width: 46px;
|
||||
height: 46px;
|
||||
padding: 0px 0px;
|
||||
}
|
||||
.toggle-msgScope img {
|
||||
filter: grayscale(var(--grayscale));
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
padding: 0px 0px;
|
||||
|
|
@ -1310,7 +1280,6 @@ aside .toggle-inside li {
|
|||
text-align: center;
|
||||
}
|
||||
.container img {
|
||||
filter: grayscale(var(--grayscale));
|
||||
float: left;
|
||||
max-width: 400px;
|
||||
width: 15%;
|
||||
|
|
@ -1319,12 +1288,10 @@ aside .toggle-inside li {
|
|||
border-radius: var(--image-corners);
|
||||
}
|
||||
.container img.emojisearch {
|
||||
filter: grayscale(var(--grayscale));
|
||||
width: 25%;
|
||||
float: right;
|
||||
}
|
||||
.container img.emojicalendar {
|
||||
filter: grayscale(var(--grayscale));
|
||||
float: left;
|
||||
max-width: 400px;
|
||||
width: 12%;
|
||||
|
|
@ -1332,7 +1299,6 @@ aside .toggle-inside li {
|
|||
transform: translateY(-25%);
|
||||
}
|
||||
.container img.timelineicon {
|
||||
filter: grayscale(var(--grayscale));
|
||||
float: var(--icons-side);
|
||||
margin-left: 0px;
|
||||
margin-right:0;
|
||||
|
|
@ -1341,7 +1307,6 @@ aside .toggle-inside li {
|
|||
width: 100px;
|
||||
}
|
||||
.container img.emojiheader {
|
||||
filter: grayscale(var(--grayscale));
|
||||
float: none;
|
||||
width: 45px;
|
||||
margin-left: 0px;
|
||||
|
|
@ -1351,7 +1316,6 @@ aside .toggle-inside li {
|
|||
vertical-align: middle;
|
||||
}
|
||||
div.mediaavatar img {
|
||||
filter: grayscale(var(--grayscale));
|
||||
float: left;
|
||||
max-width: 200px;
|
||||
width: 8%;
|
||||
|
|
@ -1359,7 +1323,6 @@ aside .toggle-inside li {
|
|||
border-radius: 0%;
|
||||
}
|
||||
div.mediaicons img {
|
||||
filter: grayscale(var(--grayscale));
|
||||
float: right;
|
||||
max-width: 200px;
|
||||
width: 10%;
|
||||
|
|
@ -1367,7 +1330,6 @@ aside .toggle-inside li {
|
|||
border-radius: 0%;
|
||||
}
|
||||
.containericons img {
|
||||
filter: grayscale(var(--grayscale));
|
||||
float: var(--icons-side);
|
||||
max-width: 200px;
|
||||
width: 7%;
|
||||
|
|
@ -1375,7 +1337,6 @@ aside .toggle-inside li {
|
|||
border-radius: 0%;
|
||||
}
|
||||
.timeline-avatar img {
|
||||
filter: grayscale(var(--grayscale));
|
||||
opacity: 1.0;
|
||||
width: 15%;
|
||||
height: 15%;
|
||||
|
|
@ -1631,24 +1592,20 @@ aside .toggle-inside li {
|
|||
font-family: Arial, Helvetica, sans-serif;
|
||||
}
|
||||
.hero-text img.qrcode {
|
||||
filter: grayscale(var(--grayscale));
|
||||
border-radius: 1%;
|
||||
width: 15%;
|
||||
min-width: 20px;
|
||||
}
|
||||
.hero-text img.title {
|
||||
filter: grayscale(var(--grayscale));
|
||||
border-radius: 1%;
|
||||
width: 25%;
|
||||
}
|
||||
#msgscope label img {
|
||||
filter: grayscale(var(--grayscale));
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
padding: 0px 0px;
|
||||
}
|
||||
.toggle-msgScope img {
|
||||
filter: grayscale(var(--grayscale));
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
margin: -15px 0px;
|
||||
|
|
|
|||
51
theme.py
51
theme.py
|
|
@ -106,9 +106,8 @@ def setThemeFromDict(baseDir: str, name: str, themeParams: {}) -> None:
|
|||
cssfile.write(css)
|
||||
|
||||
|
||||
def setSingleThemeParam(baseDir: str,
|
||||
paramName: str, paramValue: str) -> None:
|
||||
"""Sets a single theme parameter across all css files
|
||||
def enableGrayscale(baseDir: str) -> None:
|
||||
"""Enables grayscale for the current theme
|
||||
"""
|
||||
themeFiles = ('epicyon.css', 'login.css', 'follow.css',
|
||||
'suspended.css', 'calendar.css', 'blog.css')
|
||||
|
|
@ -118,10 +117,39 @@ def setSingleThemeParam(baseDir: str,
|
|||
continue
|
||||
with open(templateFilename, 'r') as cssfile:
|
||||
css = cssfile.read()
|
||||
css = setCSSparam(css, paramName, paramValue)
|
||||
if 'grayscale' not in css:
|
||||
css = \
|
||||
css.replace('body, html {',
|
||||
'body, html {\n filter: grayscale(100%);')
|
||||
filename = baseDir + '/' + filename
|
||||
with open(filename, 'w') as cssfile:
|
||||
cssfile.write(css)
|
||||
grayscaleFilename = baseDir + '/accounts/.grayscale'
|
||||
if not os.path.isfile(grayscaleFilename):
|
||||
with open(grayscaleFilename, 'w') as grayfile:
|
||||
grayfile.write(' ')
|
||||
|
||||
|
||||
def disableGrayscale(baseDir: str) -> None:
|
||||
"""Disables grayscale for the current theme
|
||||
"""
|
||||
themeFiles = ('epicyon.css', 'login.css', 'follow.css',
|
||||
'suspended.css', 'calendar.css', 'blog.css')
|
||||
for filename in themeFiles:
|
||||
templateFilename = baseDir + '/' + filename
|
||||
if not os.path.isfile(templateFilename):
|
||||
continue
|
||||
with open(templateFilename, 'r') as cssfile:
|
||||
css = cssfile.read()
|
||||
if 'grayscale' in css:
|
||||
css = \
|
||||
css.replace('\n filter: grayscale(100%);', '')
|
||||
filename = baseDir + '/' + filename
|
||||
with open(filename, 'w') as cssfile:
|
||||
cssfile.write(css)
|
||||
grayscaleFilename = baseDir + '/accounts/.grayscale'
|
||||
if os.path.isfile(grayscaleFilename):
|
||||
os.remove(grayscaleFilename)
|
||||
|
||||
|
||||
def setCustomFont(baseDir: str):
|
||||
|
|
@ -163,21 +191,6 @@ def setCustomFont(baseDir: str):
|
|||
cssfile.write(css)
|
||||
|
||||
|
||||
def enableGrayscale(baseDir: str):
|
||||
setSingleThemeParam(baseDir, 'grayscale', '100%')
|
||||
grayscaleFilename = baseDir + '/accounts/.grayscale'
|
||||
if not os.path.isfile(grayscaleFilename):
|
||||
with open(grayscaleFilename, 'w') as grayfile:
|
||||
grayfile.write(' ')
|
||||
|
||||
|
||||
def disableGrayscale(baseDir: str):
|
||||
setSingleThemeParam(baseDir, 'grayscale', '0%')
|
||||
grayscaleFilename = baseDir + '/accounts/.grayscale'
|
||||
if os.path.isfile(grayscaleFilename):
|
||||
os.remove(grayscaleFilename)
|
||||
|
||||
|
||||
def setThemeDefault(baseDir: str):
|
||||
removeTheme(baseDir)
|
||||
setThemeInConfig(baseDir, 'default')
|
||||
|
|
|
|||
Loading…
Reference in New Issue