Hudson_mod

Poor show Squarespace. I'd say this was a basic site requirement these days.

@herzworks probably a copy paste error from me in the thread 😄

You just need to add "!important" eg:

.header .header-nav .header-nav-item--folder .header-nav-folder-content {
  background: rgba(0,0,0,0.5) !Important;
}

Hi @bangank36 within the carousel on the homepage there's a circle which has some text in it (it's an svg), that would be a good example.

Thanks

Site URL: https://theministryofdesign.co.uk

Is there a way to add an animation effect to a custom code block? I've some svgs using some custom code blocks but want them to 'fade in' - any ideas?

Thanks in advance.

@jaeveedee, @tuanphan - I've managed to alter the check box & radio box elements (see below) - it's a little more work to change the drop down selection menus and I haven't had any success with those yet. Any input would be great…

/* Radio Buttons */
input[type="radio"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.option input[type="radio"]:active {
  cursor:pointer;
  width:30px;
  height:30px;
  background-color:#0e1021;
  border-radius:50%;
}
/* Selected */
.option input[type="radio"]:checked {
  cursor:pointer;
  width:30px;
  height:30px;
  background-color:#e9530d;
  border-radius:50%;
}

.option input[type="radio"] {
/* un-selected */
  background-clip: content-box;
  border: 4px solid #e9530d;
  border-radius: 50%;
  content: " ";
  cursor:pointer;
  width:30px;
  height:30px;
}

/* check boxes */
input[type="checkbox"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.option input[type="checkbox"]:active {
  cursor:pointer;
  width:30px;
  height:30px;
  background-color:#0e1021;
  border-radius:50%;
}
/* Selected */
.option input[type="checkbox"]:checked {
  cursor:pointer;
  width:30px;
  height:30px;
  background-color:#e9530d;
  border-radius:50%;
}

.option input[type="checkbox"] {
/* un-selected */
  background-clip: content-box;
  border: 4px solid #e9530d;
  border-radius: 50%;
  content: " ";
  cursor:pointer;

Hi @tuanphan, I'm looking to change the color and size to fit in more with the rest of the site so the dot on the boxes is orange, the circle around is white. The same for drop downs too really, just so they fit in a bit better.

Thanks for the help.

Hi,

https://theministryofdesign.co.uk/projects/survey

PW: helpmetuan

Thanks for the advice.

Site URL: https://www.theministryofdesign.co.uk

@tuanphan is it possible to style radio buttons, drop downs & check boxes within forms? I’ve managed to do input fields & text styles but can’t work out how to do the radio boxes etc. Any help would be greatly appreciated.