Recent Posts
![1984_05_0067[1].jpg](/images/uploads/g/thumbnails/thumb-1745561851343_6915.jpg)
GgucGt
No.765
CSS theme.
The colours are kindoff bad now and background is a bit low effort. I will change them probably by tommorow. I want to add some of my animations too, don't know if it is possible though.
body {
background: url('https://bharatchan.com/images/uploads/meta/1745429254529_3817.png') no-repeat center center fixed !important;
background-size: cover !important;
color: #de2f2f !important;
font-family: "Segoe UI", "Roboto", sans-serif !important;
}
.post-content {
color: #fa0019 !important;
font-size: 1.1rem !important;
}
.postFooter {
background-color: rgba(255,182,193,0.6) !important;
color: #5c0a25 !important;
font-size: 1rem !important;
padding: 5px 8px;
border-radius: 0 0 6px 6px;
backdrop-filter: blur(2px);
border-top: 1px solid #ffc0cb;
}
.post-content p.quote {
color: #161c21 !important;
}
.post, .catalog-thread {
background-color: rgba(220,186,222,0.75) !important;
border: 1px solid #8644a2 !important;
border-radius: 8px;
padding: 10px;
margin-bottom: 10px;
backdrop-filter: blur(4px);
}
.post .body {
color: #ffa500 !important;
font-size: 1.2rem !important;
}
a {
color: #000 !important;
}
a:hover {
color: #000 !important;
text-decoration: underline !important;
}
.catalog-thread .subject {
color: #ffab91 !important;
font-weight: bold !important;
}
.catalog-thread .teaser {
color: #de2f2f !important;
}
#topbar, .boardlist {
background-color: rgba(0,0,0,0.6) !important;
color: #eb8fda !important;
border-bottom: 1px solid #333 !important;
backdrop-filter: blur(3px);
}
input[type="submit"], button {
background-color: #333 !important;
color: #eba2d7 !important;
border: 1px solid #555 !important;
border-radius: 4px;
padding: 5px 10px;
}
input[type="submit"]:hover, button:hover {
background-color: #444 !important;
}
.post .postInfo, .post .postHeader {
background-color: rgba(255,182,193,0.6) !important;
color: #fff !important;
font-size: 1.1rem !important;
font-weight: bold;
padding: 6px 10px;
border-radius: 6px 6px 0 0;
backdrop-filter: blur(3px);
border-bottom: 1px solid #ffc0cb;
}
::-webkit-scrollbar {
width: 10px;
}
::-webkit-scrollbar-track {
background: rgba(30,30,30,0.5);
}
::-webkit-scrollbar-thumb {
background: #666;
border-radius: 5px;
}
::-webkit-scrollbar-thumb:hover {
background: #888;
}
GgucGt
No.766
>to do
>change font from bright red to something easier on the eyes
>reduce font size on various places
>serve different bg to mobile people
>change bg photo colour to less bright one and add more stuff
>some things are broken on mobile, fix them
>animation seem to be possible for some things
>a grey/black colour is applied on some buttons for some reason, change that
uW0H2l
No.767
bhery cute bhrata
80/IZa
No.768
>>765(OP)
yaar zoomer, also very nice.
80/IZa
No.769
As always if you are using aruna catalog theme, have edit following to change the base colors quickly - it's like broad brushstruck.
Once you get track of things - you can look into the elements and change their colors specifically
:root {
--primary-bg-color: #f4f1e1 !important; /* dusty parchment */
--secondary-bg-color: rgba(244, 241, 225, 0.8) !important;
--primary-dark-bg-color: #e8e3d8 !important;
--primary-border-color: rgba(119, 110, 95, 0.2) !important;
--secondary-border-color: rgba(89, 84, 74, 0.4) !important;
--primary-text-color: #3b362d !important; /* warm dark brown */
--secondary-text-color: #9d9589 !important; /* dusty grey-brown */
--primary-dark-text-color: #2e2a25 !important;
--primary-header-text-color: #6e675b !important;
--secondary-header-text-color: #afa89e !important;
--primary-shadow-color: rgba(70, 65, 60, 0.1) !important;
--primary-url-color: #3e3b85 !important; /* retro navy */
--secondary-url-color: #5c5672 !important;
}
body {
background-color: #f4f1e1;
background-image:
url(/images/big-billa-no-aa-mirror.png),
linear-gradient(to bottom, #f4f1e1 0, #e8e3d8 260px);
background-repeat: no-repeat;
background-position: bottom right;
background-attachment: fixed;
color: var(--primary-text-color);
font-family: 'Courier New', Courier, monospace;
font-size: 16px;
}
Change the values here quickly asper your need.
80/IZa
No.770
>>769
*aruna theme in general - these are main variables containing most of the colors used throughout the css.
You update them you change most of the colors. I wanted to completely streamline it - but never got a chance so css piled upon each other.
I will share the same for rest of the themes - though others also follow same pattern mostly except hiranya.
80/IZa
No.771
>>765(OP)
>I want to add some of my animations too, don't know if it is possible though.
You can already look through the classnames, elements - you know how to override using '!important' or css selectors. There you go.
Ogpwe+
No.772
Test
j11EqR
No.773
FIxed some colour combination issues, reduced font size, better background. Hover is working again. Still a work in progress though.
Doing some experiments with animations where one of the girls shows her ass when you submit a post or a thread.
.post-content p.quote {
color: #06402B !important;
}
.post:hover {
background-color: rgba(128, 0, 128, 0.4); !important
}
body {
background: url('https://bharatchan.com/images/uploads/meta/1745514487419_2855.png') no-repeat center center fixed !important;
background-size: cover !important;
font-family: "Segoe UI", "Roboto", sans-serif !important;
}
.post-content {
color: darkblue;
font-size: 1rem;
}
.post, .catalog-thread {
background-color: rgba(220,186,222,0.75);
border: 1px solid #8644a2 !important;
border-radius: 8px;
padding: 10px;
margin-bottom: 10px;
backdrop-filter: blur(4px);
}
.postHeader {
background-color: #dda0dd !important; /* Light purple (plum) */
}
.post-footer {
background-color: #dda0dd !important;
}
::-webkit-scrollbar {
width: 10px;
}
::-webkit-scrollbar-track {
background: rgba(30,30,30,0.5);
}
::-webkit-scrollbar-thumb {
background: #666;
border-radius: 5px;
}
::-webkit-scrollbar-thumb:hover {
backg
80/IZa
No.782
rpvA92
No.792
>>782
Thenks sir 
zN/axm
No.794
So apparently you can't detect "click" actions with css, hover and checkbox radio are the only possibilities. Ig I will have to work with that only.
zN/axm
No.795
Unrelated but basically made a working tampermonkey script to automatically write the Captchas using OCR. Still some problems though right now.
80/IZa
No.802
>>794
>So apparently you can't detect "click" actions with cs
huh what? `:active` pseudo class exist desu.
H0naDE
No.803
>>802
Who yeah forgot about that. That will probably work, I just want to play a gif anyways. Don't want to make things look too bloated
80/IZa
No.804
>>803
nice desu
HQxiK9
No.806
UPDATOOOO!!!!
Everything else is same, but NOW when you hover over the submit button you get to see a 2D GIRL'S ASS.
Change the gif to whatever you want, and change the size of position too.
.post-content p.quote {
color: #06402B !important;
}
.post:hover {
background-color: rgba(128, 0, 128, 0.2); !important
}
body {
background: url('https://bharatchan.com/images/uploads/meta/1745514487419_2855.png') no-repeat center center fixed;
background-size: cover !important;
font-family: "Segoe UI", "Roboto", sans-serif !important;
}
body:has(#form-submit-button:hover) {
/* Hover state: Define both layers explicitly */
background-image: url('https://bharatchan.com/images/uploads/meta/1745698052100_9531.gif'), url('https://bharatchan.com/images/uploads/meta/1745514487419_2855.png');
background-position: bottom right, center center;
background-repeat: no-repeat, no-repeat;
background-size: 200px auto, cover !important;
}
.post-content {
color: darkblue;
font-size: 1rem;
}
.post, .catalog-thread {
background-color: rgba(220,186,222,0.75);
border: 1px solid #8644a2 !important;
border-radius: 8px;
padding: 10px;
margin-bottom: 10px;
backdrop-filter: blur(4px);
}
.postHeader {
background-color: #dda0dd !important; /* Light purple (plum) */
}
.post-footer {
background-color: #dda0dd !important;
}
::-webkit-scrollbar {
width: 10px;
}
::-webkit-scrollbar-track {
background: rgba(30,30,30,0.5);
}
::-webkit-scrollbar-thumb {
background: #666;
border-radius: 5px;
}
::-webkit-scrollbar-thumb:hover {
background: #888;
}
HQxiK9
No.807
>>806
This is probably the final update to this theme unless I get a really good idea.
This gif hover state had to be implemented in a somewhat hacky way by uploading 2 images in the same background tag, (one is the image and other is the gif).
When you hover over the submit button the background state changes and the gif with the twerking is shows as a 2nd layer infront of the 1st one.
80/IZa
No.809
>>808
kek neat
80/IZa
No.810
tip
#form-submit-button.loading {
color: transparent;
border-color: #4CAF50;
background-color: #d4edda;
}
#form-submit-button.loading::after {
content: '';
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 25px;
height: 25px;
border-radius: 50%;
border: 3px solid white;
border-top: 3px solid #4CAF50;
animation: spin 1s linear infinite;
}
Overwrite this part, so whenever you post instead of anime girl in the corner you can have it over your submit button if you want to.
Q3LCoU
No.817
>>810
Hmm, but I like how it is for now
80/IZa
No.819
>>817
Sure sirs, just suggesting in case you want to tweak these things too.
M2qLA2
No.854
Suggest any ideas related to small projects, like website ideas, extensions, etc.
Anything besides mobile apps basically.
M2qLA2
No.855
Bump
hQM1F2
No.856
>>854
you could do with cafe-like night chan where theres a radio and a rating system for which songs to be played next, submitted and voted by users
+UAfbp
No.857
lazy lain theme
step 1 -> set theme to krsna
step 2 -> set custom css to below
body {
background: url('https://bharatchan.com/images/uploads/meta/1743626816029_9719.gif') no-repeat center center fixed;
background-size: cover !important;
}
M2qLA2
No.858
>>856
I can made that, do you know any good place to host a website for cheap while maintaining privacy?
I have like 500/month spare for this.
hQM1F2
No.859
>>858
sorry 'non cant really help with that, maybe making a dedicated thread on /g/ would help
(without derailing this thread too)
80/IZa
No.868
>>857
It goes really well with aruna theme ngl. Simpl but sweet.
80/IZa
No.869
>>858
use namecheap shared hosting - you can have node js etc.
if you want a vps there are vps providers which can go as low as 5$ usd but for monthly charge it will go around 8 to 10 usd.
BT6KVr
No.877
Dwjic/
No.893
>>765(OP)
I little unrelated but how do I post codes anons? Do i just copy paste it? I can't share my version (still working on it) unless I know how to post or share them
>Running this as a sample text
public class Main {
public static void main(String[] args) {
System.out.println("Hello, World!");
}
}
>One for CSS
<!DOCTYPE html>
<html>
<head>
<style>
p {
color: red;
text-align: center;
}
</style>
</head>
<body>
<p>Hello World!</p>
<p>These paragraphs are styled with CSS.</p>
</body>
</html>
1cyaQr
No.895
>>893
Paste your code between [ code ] and [ /code ] tags, remove the spaces in above
Dwjic/
No.896
>>895
[Code]Proximity test 1[/Code]
[Code]Proximity test 2 [/Code]
[Code] Proximity test 3 [/Code]
[Code]
Proximity test 4
[/Code]
[Code]public class Main {
public static void main(String[] args) {
System.out.println("Appreciate the Help, Anon");
}
}[/Code]
1cyaQr
No.897
>>896
small "c" sir
Dwjic/
No.898
>>896
//Testcase with caps correction
public class Main {
public static void main(String[] args) {
System.out.println("Rookie mistake");
}
}
WMC/AY
No.900
cyGk3Y
No.906
>>905
:root {
--primary-bg-color: #CCE4F7;
--secondary-bg-color: #B6CBFF;
--primary-dark-bg-color: #A0BFD8;
--primary-border-color: rgba(0,0,0,.1);
--secondary-border-color: #f0e0d6;
--primary-text-color: #19459e;
--secondary-text-color: #0A515E;
--primary-dark-text-color: rgb(119 76 57);
--primary-header-text-color: rgb(141, 68, 68);
--primary-shadow-color: rgba(0,0,0,.14);
--primary-url-color: #239
}
body {
background-image: url('https://bharatchan.com/images/uploads/gen/1746444973697_5788.jpg');
background-size: cover;
background-repeat: no-repeat;
}
/* navbar */
.navbar {
background-color: transparent;
}
/* navbar + dropdown */
.dropdown-menu::-webkit-scrollbar-thumb, .dropdown-menu li a:hover {
background-color: var(--primary-dark-bg-color);
color: var(--secondary-text-color);
}
li a:hover,li button:hover { color: var(--secondary-text-color) }
/* thread page */
.postHeader, .post-footer {
background-color: var(--secondary-bg-color);
}
/* things I don't want to see */
.banner, .recent-posts {
display: none;
}
g6SOGl
No.908
>>907
themx sirs. I will make changes as I learn more CSS.
