Menu

  • Unknown's avatar
    neatandclean · Member ·

    Hello, 2 easy requests. Hope you can help me!

    1. Can someone please give me the CSS to change the mobile “Menu” to color #00fef8 from what it is now? Here’s the color that’s showing up now: https://cloudup.com/cNhh9Bb9LXE

    2. On mobile and desktop, I’d rather not have my blog indicate any page happens to be a view of a tag: ( Example: https://cloudup.com/cpgxANkwVQ9 ) …….If need be or easier, I’d like all the circled elements to be the same exact color as my blog’s background color ( #00355F )

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar
    thesacredpath · Member ·

    Hi there, go to Customize > CSS, delete all the informational text in that window, and paste in the following custom CSS to change the color of the menu toggle. 

    .site-header .menu-toggle, .site-header .menu-toggle:hover, .site-header .menu-toggle:active {
    border-color: #00fef8 !important;
    color: #00fef8 !important;
}

    The following will remove the header title from the tags pages. Date archive and category pages would still show a similar title. 

    .tag .page-header {
    display: none;
}

    If you wish to hide that header from tag, date archive and category pages, then use the following instead. 

    .archive .page-header {
    display: none;
}
  • Unknown's avatar
    neatandclean · Member ·

    Thank you thesacredpath, the 3rd one seems great. As for the 1st, I’m scared to delete anything because this is what I have there already (To your eyes, it might be an epic mess Haha) and I’m scared to delete anything in it because it’s working out well: 

    .entry-title, #site-navigation a, .widget .widget-title {
	color: #8b99a5 !important;
}

Le
.wf-active body {
	font-family: Verdana;
	font-size: 20.7px;
	color: #CCFFFF;
	line-height: 1.65;
}

h1, h2 {
	color: white;
	line-height: 1.65;
}

p {
	color: #FFFFFF;
}

img {
	border: 0;
}

/* =Global
----------------------------------------------- */
body,
button,
input,
select,
textarea {
	color: #000000;
	font-size: 16px;
	font-size: 1.6rem;
	font-family: serif;
	line-height: 1.5;
}

select {
	font-family: Helvetica, Arial;
	font-size: 13px !important;
/* webkit annoyingly only lets  elements have a font-size of either 9px, 11px or 13px; forcing this to 13px maintains consistency */
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
	clear: both;
}

hr {
	margin-bottom: 1.5em;
	height: 1px;
	border: 0;
	background-color: #ccc;
}

/* Text elements */
p {
	margin-bottom: 1em;
}

ul, ol {
	margin: 0 0 1.5em 3em;
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

li > ol, li > ul {
	margin-bottom: 0;
	margin-left: 1.5em;
}

dt {
	font-weight: bold;
}

dd {
	margin: .5em 1.5em 1.5em;
}

b, strong {
	font-weight: bold;
}

dfn, cite, em, i {
	font-style: italic;
}

blockquote {
	margin-left: 1em;
	border-color: #0B0C18;
	padding-left: 20px;
}

blockquote cite {
	font-size: 70%;
}

*/
a {
	color: #bbc7d3;
	text-decoration: none;
}

a:visited {
	color: #bbc7d3;
	text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 20px 0;
	color: #bbc7d3;
	letter-spacing: -1px;
	font-weight: 700;
	line-height: 1.2;
	-webkit-hyphens: none;
	-moz-hyphens: none;
	hyphens: none;
	word-wrap: break-word;
}

a:hover,
a:focus,
a:active {
	color: #57ad68;
	text-decoration: underline;
}

.entry-title a {
	color: #bbc7d3;
	text-decoration: none;
}

.entry-title a:hover {
	color: #fff9c0;
}

.entry-meta a:hover {
	color: #fff9c0;
}
  • Unknown's avatar
    neatandclean · Member ·

    As you can see, I fly blind when it comes to CSS …I rely on the kindness of Happiness Engineers like you

  • Unknown's avatar
    siobhyb · Member ·

    Hi Alex,

    Richard was referring to the instructions that appear at the very top of the CSS editor when you first being adding to it. The instructions usually appear as follows:

    /*
Welcome to Custom CSS!

CSS (Cascading Style Sheets) is a kind of code that tells the browser how
to render a web page. You may delete these comments and get started with
your customizations.

By default, your stylesheet will be loaded after the theme stylesheets,
which means that your rules can take precedence and override the theme CSS
rules. Just write here what you want to change, you don't need to copy all
your theme's stylesheet content.

If you need any further help, ask in the CSS Customization forum.
*/

    I can see that you’ve already deleted those instructions and started adding custom CSS. :) You can therefore safely ignore that particular part of Richard’s advice and copy/paste the CSS he provided at the bottom of your existing code.

  • The topic ‘Menu’ is closed to new replies.