DIY Desktop Site Customisation - Use at own risk

archfi · 24-07-2021 7:18pm

https://www.boards.ie/discussion/comment/117655799#Comment_117655799

Yes, the guys who shared have kept me here.

fritzelly · 24-07-2021 7:19pm

Change the border to 1px - the 5px is squashing it

smuggler.ie · 24-07-2021 7:19pm

@fritzelly i can post full script i have if you willing to look into. perhaps i have some "dodgy" line, however some feeling that it comes from original unmoded code

fritzelly · 24-07-2021 7:21pm

Yeah post it

smuggler.ie · 24-07-2021 7:23pm

@fritzelly yeah, with 1px visually looks ok, but from code prospective its still wrong... or should i say different from other two

fritzelly · 24-07-2021 7:25pm

Post your CSS

archfi · 24-07-2021 7:25pm

Guys, please don't use codeblock formatting - page again freezing browser!

smuggler.ie · 24-07-2021 7:26pm

https://www.boards.ie/discussion/comment/117656901#Comment_117656901

Thanks. Currently loaded

Compliled1 v0.1.txt

fritzelly · 24-07-2021 7:33pm

Removing this it looks fine to me

border: 1px solid #4d4d4d;

smuggler.ie · 24-07-2021 7:34pm

https://www.boards.ie/discussion/comment/117656914#Comment_117656914

i have converted all of mine into quote, i think, on that purpose. Noted that it wasn't this bad in the morning 😕

smuggler.ie · 24-07-2021 7:53pm

https://www.boards.ie/discussion/comment/117656945#Comment_117656945

disabled ALL my code, applied ONLY yours suggeted in this post still can see button different size pushing over bottom border

fritzelly · 24-07-2021 7:58pm

You still have the height css by the looks of it - just take the code you linked to and remove the border css i referenced

smuggler.ie · 24-07-2021 8:14pm

@fritzelly bet you there is extra "border" and it cross with my code. Disabling bolded parts gives visual at glance, but then it breaks other section of code as white border is present above what would be expected if hover over ->> red, as it happens to other two buttons (amber, green)

.Reactions .ReactButton.Quote, .Reactions .ReactButton.ReactButton-Like, .Reactions .ReactButton.ReactButton-Flag, .Reactions .FlagMenu.ToggleFlyout {

width:95px!important;

/*height:30px!important;*/

background:linear-gradient(#ff9900,#2f2310/* #ffa31a*/);

color: #213244; /*this effects only Quote and Thanks buttons font if .Reactions .ReactButton.ReactButton-Flag disabled" */

/*border:1px solid #4d4d4d;*/

display:flex!important;

justify-content:center!important;

/*margin:4px!important*/}

Increase border: to 3px and you will see red frame appearing inside/beneath white, compare to other two buttons and you will see difference

.Reactions .ReactButton.ReactButton-Flag:hover,

.FlagMenu.ToggleFlyout:hover .ReactButton-Flag {

color:red!important;

border:1.5px solid #f00;}

Thanks for patience.

fritzelly · 24-07-2021 8:23pm

I'm not following you with whats wrong

https://youtu.be/5VjkSQNyGWM

smuggler.ie · 24-07-2021 8:32pm

Yes! Perfectly reflected on 3-4 s on vid - "Flag" button turn red background, but remain white frame, where other two perfectly change frame color respectively

fritzelly · 24-07-2021 8:42pm

https://www.boards.ie/discussion/comment/117657138#Comment_117657138

.FlagMenu {border:none !important}

.ReactButton-Flag {border: 1px solid white;}

a.ReactButton-Flag:hover {border: 1px solid red;}

smuggler.ie · 24-07-2021 8:57pm

https://www.boards.ie/discussion/comment/117657179#Comment_117657179

Bingo!

Only needed .FlagMenu{} , placed above ALL other related to buttons, then enabled

height:30px!important; /*not that it makes much difference here and now*/

border:1px solid #4d4d4d;

All buttons same border, color and size. behaviour as expected on hover

Thanks for tip, next is ....coming soon

need to learn more about coding 😎

Thanks again

fritzelly · 24-07-2021 9:01pm

p.s.

You can't have 1.5px 😉

smuggler.ie · 24-07-2021 9:04pm

let me ask - code commands order in sequence matter or am i mistaking?

smuggler.ie · 24-07-2021 9:07pm

https://www.boards.ie/discussion/comment/117657244#Comment_117657244

Seriously!, hmmm neither stylus nor Notepad++ complain about it. weird, but makes sence providing px is smalest unit 😀

fritzelly · 24-07-2021 9:15pm

https://www.boards.ie/discussion/comment/117657254#Comment_117657254

Depends...

Where the class has the same specificity then the last one wins but in this case ReactLabel wins as it has more specificity even tho its for the same element, but add !important to the span and it wins

.ReactLabel {color:red}

span{color:orange}

https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity

smuggler.ie · 25-07-2021 1:12pm

You guys have workaround for this ?

no CSS code applied

CSS on

25-07-2021 1:15pm

https://www.boards.ie/discussion/comment/117658929#Comment_117658929

The homepage and profile edit page can't be made full width or those options and the announcements go to the bottom of the screen.

  /* Check Homepage etc. for change width */
  if (window.location.pathname === "/") {
    $('body').addClass('no_wide');
  } else {
    var pathname = window.location.pathname.split('/');
    if (pathname[1] == "profile" && pathname[2] == "edit") {
      $('body').addClass('no_wide');
    }
  }

In my extension I'm working on, I exclude that class for widening the content.

archfi · 25-07-2021 1:20pm

https://www.boards.ie/discussion/comment/117658929#Comment_117658929

I'm using Stylus on firefox, there is an option to exclude current url which I have done for the edit profile page to show those options.

Extension icon-->Css active for boards (whatever the name you use) --> three dots--> exclude current url

(https://www.boards.ie/profile/edit/USERNAME)

smuggler.ie · 25-07-2021 1:27pm

@[Deleted User] guess its JS, unfortunatelly, on my third day in coding .....

@archfi this in turn would remove ALL stiling from that page, unless make separate stiling just for that section and control there. might try.

Thanks

smuggler.ie · 25-07-2021 1:35pm

seams got around it by moving these two on separate CSS and disableing for profile URL.

.Content.MainContent { width: 100% !important; flex-shrink: 0 !important; }

.Panel-main { display: none !important;}

archfi · 25-07-2021 2:43pm

https://www.boards.ie/discussion/comment/117656914#Comment_117656914

i hope whoever reported my post as spam was testing something...ignore my next sentence if that's the case.

Again, boards need to sort out the 'reaction' count or reset the flag reactions if they 'count' against users when they finally get their house in order - that is only giving a gun to genuinely problematic posters.