Author Topic: StingRay's Dark Theme for CWP  (Read 30916 times)

0 Members and 1 Guest are viewing this topic.

Offline
*
StingRay's Dark Theme for CWP
« on: September 27, 2017, 07:08:08 PM »
Looking for a dark theme but can't find one, or you can't seem to override the hardcoded styles that the developers have purposely have you wait for a themeing solution? Well, I made a little script that accomplishes this, which you can run each time CWP gets updated and rewrites over your custom.css.

Head over to my Github: https://github.com/rayleesg/dark_cwp

Offline
*
Re: StingRay's Dark Theme for CWP
« Reply #1 on: September 30, 2017, 10:28:32 PM »
tried this script and got:

[root@]# ./dark_cwp
StingRay's Total Dark Theme for CWP
###################################

chmod: changing permissions of `custom.css': Operation not permitted
./dark_cwp: line 8: custom.css: Permission denied
./dark_cwp: line 9: custom.css: Permission denied
./dark_cwp: line 10: custom.css: Permission denied
./dark_cwp: line 11: custom.css: Permission denied
./dark_cwp: line 12: custom.css: Permission denied
./dark_cwp: line 13: custom.css: Permission denied
./dark_cwp: line 14: custom.css: Permission denied
./dark_cwp: line 15: custom.css: Permission denied
./dark_cwp: line 16: custom.css: Permission denied
./dark_cwp: line 17: custom.css: Permission denied
./dark_cwp: line 18: custom.css: Permission denied
./dark_cwp: line 19: custom.css: Permission denied
./dark_cwp: line 20: custom.css: Permission denied
./dark_cwp: line 21: custom.css: Permission denied
./dark_cwp: line 22: custom.css: Permission denied
./dark_cwp: line 23: custom.css: Permission denied
./dark_cwp: line 24: custom.css: Permission denied
./dark_cwp: line 25: custom.css: Permission denied
./dark_cwp: line 26: custom.css: Permission denied
./dark_cwp: line 27: custom.css: Permission denied
./dark_cwp: line 28: custom.css: Permission denied
./dark_cwp: line 29: custom.css: Permission denied
./dark_cwp: line 30: custom.css: Permission denied
./dark_cwp: line 31: custom.css: Permission denied
./dark_cwp: line 32: custom.css: Permission denied
./dark_cwp: line 33: custom.css: Permission denied
./dark_cwp: line 34: custom.css: Permission denied
./dark_cwp: line 35: custom.css: Permission denied


haven't looked to far into it yet, but here's my specs:
Distro Name: CentOS release 6.9 (Final)
Kernel Version: 2.6.32-696.10.1.el6.x86_64
CWP version: 0.9.8.272

Offline
*
Re: StingRay's Dark Theme for CWP
« Reply #2 on: October 01, 2017, 03:02:50 PM »
chattr -i custom.ss or rf -rf custom.css entirely,

then run the script

Offline
*
Re: StingRay's Dark Theme for CWP
« Reply #3 on: October 02, 2017, 02:45:13 AM »
That worked!  8)

Offline
***
Re: StingRay's Dark Theme for CWP
« Reply #4 on: October 02, 2017, 07:01:32 AM »
Nah. Didn`t work for me on CWP6. Added in the script chattr -i after cd to custom.css and chattr +i at the end of the script. I run the script, it insert everything in the custom.css - nothing. Moved custom.css to /root and run the script - nothing. Logged out, logged in - same. Am I doing something wrong?
UNIX is a very simple OS, but you have to be a GENIUS to understand it ...

Offline
*
Re: StingRay's Dark Theme for CWP
« Reply #5 on: October 30, 2017, 10:33:26 AM »
Sorry for the late reply Darkness. You'd have to find custom.css in /usr/local/cwpsrv/htdocs/admin/design/css and you have to place any custom.css changes there. That's what my script does. If it worked for darkroom, should work for you too?

Offline
***
Re: StingRay's Dark Theme for CWP
« Reply #6 on: October 30, 2017, 07:05:36 PM »
CWP should switch to Bottstrap 3 or better 4 first

Offline
**
Re: StingRay's Dark Theme for CWP
« Reply #7 on: October 30, 2017, 08:57:42 PM »
@become It is already on Bootstrap3. That "Supr" theme is based on Bootstrap3.

The main problem is that CWP does not use any templating engine. Everything is hardcoded. Basically with only .css files you can't do much. And atm even .css files are locked so you can't edit them at all...unless you do some sneaky things to unlock them, but as I said, you can't do much even with unlocked .css. If you want to create custom design without html code itself you can't do much.

Offline
*
Re: StingRay's Dark Theme for CWP
« Reply #8 on: October 31, 2017, 09:45:59 AM »
For all of you that have poblem installing this script this is how I personally did it because it caused errors other way

1) Use some SFTP program and gain root access using it (WinSCP in my opinion is best)
2) Go To /usr/local/cwpsrv/htdocs/admin/design/css and copy custom.css to personal computer somewhere
3) Edit custom.css file on PC using editor from your opinion with options from script (gist with clear code - https://gist.github.com/markoidzan/e0bf9527205a04bef3df09aa1509212b)
4) DELETE original custom.css file
5) Upload edited custom.css file
6) Restart cwpsrv with service cwpsrv restart in SSH
7) enjoy in theme

Offline
**
Re: StingRay's Dark Theme for CWP
« Reply #9 on: October 31, 2017, 11:12:52 AM »
@midzan21 How did you manage to delete locked custom.css?

EDIt: Ok, I found way.
Code: [Select]
cd /usr/local/cwpsrv/htdocs/admin/design
chattr -d -suSiadAc ./css/
cd /usr/local/cwpsrv/htdocs/admin/design/css
chattr -a FILE_NAME
chattr -i FILE_NAME
« Last Edit: October 31, 2017, 11:20:30 AM by Gogo »

Offline
*
Re: StingRay's Dark Theme for CWP
« Reply #10 on: November 02, 2017, 02:14:49 AM »
one quick req... the "X" in the corner of popup windows like yum manager are almost invisible. can those be more prominent?

Offline
*
Re: StingRay's Dark Theme for CWP
« Reply #11 on: November 22, 2018, 11:32:08 AM »
THANK YOU @raylee <3
I was waiting for an admin dark theme for years!!!

Offline
*
Re: StingRay's Dark Theme for CWP
« Reply #12 on: July 01, 2019, 03:47:49 AM »
Thank-you raylee, midzan21  and Gogo. I used both your tips and successfully applied StingRay's dark theme. Looks great!

  • Distro Name: CentOS Linux release 7.6.1810 (Core)
  • CWPpro version: 0.9.8.838

For all of you that have poblem installing this script this is how I personally did it because it caused errors other way

1) Use some SFTP program and gain root access using it (WinSCP in my opinion is best)
2) Go To /usr/local/cwpsrv/htdocs/admin/design/css and copy custom.css to personal computer somewhere
3) Edit custom.css file on PC using editor from your opinion with options from script (gist with clear code - https://gist.github.com/markoidzan/e0bf9527205a04bef3df09aa1509212b)
4) DELETE original custom.css file
5) Upload edited custom.css file
6) Restart cwpsrv with service cwpsrv restart in SSH
7) enjoy in theme

@midzan21 How did you manage to delete locked custom.css?

EDIt: Ok, I found way.
Code: [Select]
cd /usr/local/cwpsrv/htdocs/admin/design
chattr -d -suSiadAc ./css/
cd /usr/local/cwpsrv/htdocs/admin/design/css
chattr -a FILE_NAME
chattr -i FILE_NAME


Offline
*
Re: StingRay's Dark Theme for CWP
« Reply #13 on: May 14, 2020, 12:48:22 AM »
If someone need, I EDITED the dark theme of raylee, now its dark gray instead of black, also added blue colors and dark text on dark background fixed.
Here is the code of /usr/local/cwpsrv/htdocs/admin/design/css/custom.css:
Code: [Select]
html,.deleted
{
/*background:#000;*/
-webkit-filter:invert(0.92) hue-rotate(180deg)!important;
-moz-filter:invert(0.92) hue-rotate(180deg)!important;
filter:invert(0.92) hue-rotate(180deg)!important;
filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=0,xray=0,mirror=0,invert=0.92,opacity=1,rotation=2)!important;
-webkit-transition:100ms ease all;
transition:100ms ease all;
-o-transition-duration:100ms ease all
}

img,embed[flashvars],[type*="application/x-shockwave-flash"],[type*="application/x-silverlight"]
{
-webkit-filter:invert(0.92) hue-rotate(180deg)!important;
-moz-filter:invert(0.92) hue-rotate(180deg)!important;
filter:invert(0.92) hue-rotate(180deg)!important;
filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=0,xray=0,mirror=0,invert=0.92,opacity=1,rotation=2)!important;
}

tr > td > a > img,th > a > img
{
filter:url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'invert\'><feColorMatrix type=\'matrix\' values=\'-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 0 0 0 1 0\'/></filter></svg>#invert")!important;-webkit-filter:hue-rotate(180deg)!important;
filter:hue-rotate(180deg)!important;
filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=0,xray=0,mirror=0,invert=0,opacity=1,rotation=2)!important
}

/*sergdev*/
#sidebar .sidenav .mainnav ul li
{
background-color: #f4f6ff;
}

div:not(.navbar-header)>a, li>a:not(.active), .panel-heading, .title.mb0
{
background-image: linear-gradient(to bottom, #fafafa 0%, #f3f5ff 100%) !important;
}

.panel .panel-body, .input-group-addon, .panel-body pre, #myTabContent22
{
background-color: #f3f5ff;
}

.panel-heading span, .progress-bar font, #myTabService li.active a, #myTabService li.active a i::before
{
color: #454545 !important;
}

.navbar-brand
{
font-size: 0 !important;
}

.navbar-brand .slogan
{
display: none;
}

.navbar-brand::before
{
content: 'YOUR_HOSTNAME.';
    font-size: 30px;
}

.navbar-brand::after
{
content: 'admin';
font-size: 14px;
    color: #6b6b6b;
}
« Last Edit: May 14, 2020, 12:53:49 AM by sergdev777 »