DIY Desktop Site Customisation - Use at own risk

archfi · 24-07-2021 06:18PM

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

Yes, the guys who shared have kept me here.

fritzelly · 24-07-2021 06:19PM

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

smuggler.ie · 24-07-2021 06: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 06:21PM

Yeah post it

smuggler.ie · 24-07-2021 06: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 06:25PM

Post your CSS

archfi · 24-07-2021 06:25PM

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

smuggler.ie · 24-07-2021 06:26PM

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

Thanks. Currently loaded

Compliled1 v0.1.txt

fritzelly · 24-07-2021 06:33PM

Removing this it looks fine to me

border: 1px solid #4d4d4d;

smuggler.ie · 24-07-2021 06: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 06: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 06: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 07: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 07:23PM

I'm not following you with whats wrong

https://youtu.be/5VjkSQNyGWM

smuggler.ie · 24-07-2021 07: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 07: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 07: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 08:01PM

p.s.

You can't have 1.5px 😉

smuggler.ie · 24-07-2021 08:04PM

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

smuggler.ie · 24-07-2021 08: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 08: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 12:12PM

You guys have workaround for this ?

no CSS code applied

CSS on

25-07-2021 12: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 12: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 12: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 12: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 01: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.