style
attributes in the HTML and do everything in CSS. You're also using a lot of obsolete attributes from HTML3/4 and not using the Bootstrap 3 grid system. I didn't do too much but here is some stuff cleaned up and I added an example of how to use the grid system. http://codepen.io/rjstone/pen/KgWOWa?editors=1000
<style>
.red-text {
color: red;
}
</style>
<h2 class="red-text">CatPhotoApp</h2>
<p size 16px class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
https://
transport, it blocked the access to the quote site. If I switched to http://
for loading the page, then it worked, although you're not formatting the quote, but looks like you are dumping the raw JSON output to the quote paragraph. But it works using http://
This was on firefox on windows
topic: random Quote machine
guys can you please help me in generating random colors on click in my js code
grantknaver sends brownie points to @sf-jd :sparkles: :thumbsup: :sparkles:
:cookie: 309 | @sf-jd |http://www.freecodecamp.com/sf-jd
// add this to body in your css
body {
transition: background .7s;
}
// Change js to this. You can also do this for the button ;)
$('body').css('background', '#' + colors[color]);
// take all this out
$(".html body").animate({
backgroundColor: colors[color],
color: colors[color]
}, 1000);
$(".button").animate({
backgroundColor: colors[color]
}, 1000);
// replace with this
$('body').css('background', '#' + colors[color]);
$('.button').css('background', '#' + colors[color]);
annunirmal sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 608 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
annunirmal sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: annunirmal already gave jdtdesigns points
$('body, .button').css('background', '#' + colors[color]);
hacu9 sends brownie points to @sorinr and @jdtdesigns :sparkles: :thumbsup: :sparkles:
:cookie: 730 | @sorinr |http://www.freecodecamp.com/sorinr
:cookie: 609 | @jdtdesigns |http://www.freecodecamp.com/jdtdesigns
$('.quote_text').css('color', '#' + colors[color]);
annunirmal sends brownie points to @jdtdesigns :sparkles: :thumbsup: :sparkles:
:warning: annunirmal already gave jdtdesigns points
annunirmal sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:cookie: 731 | @sorinr |http://www.freecodecamp.com/sorinr

input {
border: 0;
background: transparent; /* maybe don't need this? not sure */
border-bottom: 2px solid lightgrey;
}
dirtier sends brownie points to @alhazen1 :sparkles: :thumbsup: :sparkles:
:cookie: 374 | @alhazen1 |http://www.freecodecamp.com/alhazen1
zaturek sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 3490 | @sjames1958gm |http://www.freecodecamp.com/sjames1958gm
mones-cse sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:star2: 1411 | @kirbyedy |http://www.freecodecamp.com/kirbyedy
mones-cse sends brownie points to @kirbyedy :sparkles: :thumbsup: :sparkles:
:warning: mones-cse already gave kirbyedy points
@fhdhsni I'm trying this:
var URL_Wiki = 'https://crossorigin.me/https://' + lang
+ '.wikipedia.org/w/api.php?action=opensearch&profile=fuzzy'
+ '&redirects=resolve&search=' + q;
Does it work for you?
<img>
src
"${availableCars[currentCar].img || "imgs/cars/Skoda-Fabia-1.4.jpg"}"
"${availableCars[currentCar].img || 'imgs/cars/Skoda-Fabia-1.4.jpg'}"
fhdhsni sends brownie points to @josebarakat :sparkles: :thumbsup: :sparkles:
:cookie: 342 | @josebarakat |http://www.freecodecamp.com/josebarakat
Here is the complete snippet I am using from twitter in my JavaScript
window.twttr = (function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0],
t = window.twttr || {};
if (d.getElementById(id)) return t;
js = d.createElement(s);
js.id = id;
//js.src = "https://platform.twitter.com/widgets.js";
fjs.parentNode.insertBefore(js, fjs);
t._e = [];
t.ready = function(f) {
t._e.push(f);
};
return t;
}(document, "script", "twitter-wjs"));
.navbar-fixed-top {
background-color: white;
}
@staceyland First you need to remove all of this from your html:
<html>
<title>Stacey's Portfolio</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Yatra One">
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css">
<body>
Then add bootstrap, font-awesome in Settings->CSS. Next add jQuery in Settings->js. The quick add drop down menu is useful.
Add this to your css and you're good:
.navbar-fixed-top {
background-color: white;
}
<div style="margin:0 auto;max-width:600px;background:#ffffff;"><table role="presentation" cellpadding="0" cellspacing="0" style="font-size:0px;width:100%;background:#ffffff;" align="center" border="0" mc:repeatable="thumbnailWithText" mc:variant="thumbnailMain"><tbody><tr style="border-bottom: 2px solid #ededed;"><td style="text-align:center;vertical-align:top;font-size:0px;padding:20px;">
tarekalabd sends brownie points to @michielhuijse :sparkles: :thumbsup: :sparkles:
:cookie: 270 | @michielhuijse |http://www.freecodecamp.com/michielhuijse
<div style="margin:0 auto; max-width:600px; background:#ffffff;">
<table role="presentation" cellpadding="0" cellspacing="0" style="font-size:0px;width:100%;background:#ffffff;" align="center" border="0" mc:repeatable="thumbnailWithText" mc:variant="thumbnailMain">
<tbody>
<tr style="border-bottom: 2px solid #ededed;">
<td style="text-align:center;vertical-align:top;font-size:0px;padding:20px;"></td>
</tr>
</tbody>
</table>
</div>
<tr>
<div style="margin:0 auto;max-width:600px;background:#ffffff;">
<table role="presentation" cellpadding="0" cellspacing="0" style="font-size:0px;width:100%;background:#ffffff;" align="center" border="0" mc:repeatable="thumbnailWithText" mc:variant="thumbnailGreen">
<tbody>
<tr style="border-bottom: 2px solid #ededed;">
<td style="text-align:center;vertical-align:top;font-size:0px;padding:20px 20px 20px 15px;border-left: 5px solid #a5cf4a;">
background-color: rgba(170,170,170,.3);
.3
at the end adjusts the opacity of the color applied
camnicklaus sends brownie points to @amit-s and @tylermoeller :sparkles: :thumbsup: :sparkles:
:cookie: 329 | @amit-s |http://www.freecodecamp.com/amit-s
:cookie: 850 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
gbsimon87 sends brownie points to @alexanderdom :sparkles: :thumbsup: :sparkles:
:cookie: 386 | @alexanderdom |http://www.freecodecamp.com/alexanderdom
dirtier sends brownie points to @gbsimon87 :sparkles: :thumbsup: :sparkles:
:cookie: 342 | @gbsimon87 |http://www.freecodecamp.com/gbsimon87
dirtier sends brownie points to @alexanderdom :sparkles: :thumbsup: :sparkles:
:cookie: 387 | @alexanderdom |http://www.freecodecamp.com/alexanderdom
:cookie: 851 | @tylermoeller |http://www.freecodecamp.com/tylermoeller
dirtier sends brownie points to @tylermoeller :sparkles: :thumbsup: :sparkles:
<body data-spy="scroll" data-target="#exCollapsingNavbar2">
<div class="collapse navbar-toggleable-xs" id="exCollapsingNavbar2">
<a class="navbar-brand" href="#"><i class="code icon"></i> Karan Bhullar</a>
<ul class="nav navbar-nav">
<li class="nav-item">
<a class="nav-link" href="#skilly">Skills</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#projecty">Projects</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#contacty">Contact</a>
</li>
</ul>
<ul class="nav navbar-nav navbar-right pull-xs-right">
<li><a><i class="mail icon big"></i></a></li>
<li><a><i class="github icon big"></i></a></li>
</ul>
</div>