ArtigosCriação de HomePage personalizada
3 participantes
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre HTML e BBCode
Página 1 de 1
Criação de HomePage personalizada
por Lima 3005 30.05.14 20:27
- Descrição:
http://universogamer.foruns.com.pt/h4-aaaa
Eu estou criando essa página personalizada, mas gostava de saber como faço para quando o membro nao acerta a password ou o nome do usario nao fosse logo para o forum mas aparecesse mensagem nessa homepage
Já agora é seguro?
- Informações:
| Fórum: | http://universogamer.foruns.com.pt/ | Versão: | INVISION |
| Tipo: | Erros diversos | Tags: | Criação,HomePage,personalizada |
Última edição por lima21 em 14.06.14 9:51, editado 1 vez(es)
Lima 3005- Membro
- Membro desde : 08/02/2013
Mensagens : 631
Pontos : 885 -
Lima 3005- Membro
- Membro desde : 08/02/2013
Mensagens : 631
Pontos : 885 -
Lima 3005- Membro
- Membro desde : 08/02/2013
Mensagens : 631
Pontos : 885 -
Lima 3005- Membro
- Membro desde : 08/02/2013
Mensagens : 631
Pontos : 885 -
Lima 3005- Membro
- Membro desde : 08/02/2013
Mensagens : 631
Pontos : 885 -
Re: Criação de HomePage personalizada
por Kyo Panda 13.06.14 14:40
Olá,
Poderia inserir o jQuery nessa página? Já que é uma página customizada, está sem o jQuery.
Abraços.
Poderia inserir o jQuery nessa página? Já que é uma página customizada, está sem o jQuery.
Abraços.
Kyo Panda- Hiper Membro
- Membro desde : 08/01/2012
Mensagens : 4641
Pontos : 5939 -
Re: Criação de HomePage personalizada
por Lima 3005 13.06.14 17:58
é assim que se adiciona?
- Código:
<script src="jquery-1.3.2.min.js" type="text/javascript"></script>
Lima 3005- Membro
- Membro desde : 08/02/2013
Mensagens : 631
Pontos : 885 -
Re: Criação de HomePage personalizada
por Kyo Panda 13.06.14 18:23
Assim você já garante que o script estará em algum lugar.
Jogue-o no head ou antes de fechar o body.
- Código:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
Jogue-o no head ou antes de fechar o body.
Kyo Panda- Hiper Membro
- Membro desde : 08/01/2012
Mensagens : 4641
Pontos : 5939 -
Lima 3005- Membro
- Membro desde : 08/02/2013
Mensagens : 631
Pontos : 885 -
Re: Criação de HomePage personalizada
por Kyo Panda 13.06.14 19:26
Agora adicione ao abaixo da tag do jQuery:
Se tentar selecionar o texto após uma tentativa de login falha, verá onde está a mensagem. Deseja que eu a posicione ou o fará?
- Código:
<script type="text/javascript">
$('form[name="form_login"]').on('submit', function() {
var self, content;
self = $(this);
content = $('#b');
content.css('opacity', '0.2');
$.post(self.attr('action'), self.serialize() + '&login=Entrar', function (data) {
if (data.indexOf('_userdata["session_logged_in"] = 0;') !== -1) {
if (!$('.form-error').length) {
content.prepend('<div class="form-error">Nome de usuário ou senha inválido.</div>');
}
} else {
location.href = '/';
}
console.log(self.serialize() + '&login=Entrar', data);
content.css('opacity', '1');
});
return false;
});
</script>
Se tentar selecionar o texto após uma tentativa de login falha, verá onde está a mensagem. Deseja que eu a posicione ou o fará?
Kyo Panda- Hiper Membro
- Membro desde : 08/01/2012
Mensagens : 4641
Pontos : 5939 -
Lima 3005- Membro
- Membro desde : 08/02/2013
Mensagens : 631
Pontos : 885 -
Kyo Panda- Hiper Membro
- Membro desde : 08/01/2012
Mensagens : 4641
Pontos : 5939 -
Lima 3005- Membro
- Membro desde : 08/02/2013
Mensagens : 631
Pontos : 885 -
Re: Criação de HomePage personalizada
por Sennior 14.06.14 9:09
Boas, 
Altere por este código HTML e veja se resulta:
Até mais.
Altere por este código HTML e veja se resulta:
- Código:
<html>
<body>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$('form[name="form_login"]').on('submit', function() {
var self, content;
self = $(this);
content = $('#b');
content.css('opacity', '0.2');
$.post(self.attr('action'), self.serialize() + '&login=Entrar', function (data) {
if (data.indexOf('_userdata["session_logged_in"] = 0;') !== -1) {
if (!$('.form-error').length) {
content.prepend('<div class="form-error">Nome de usuário ou senha inválido.</div>');
}
} else {
location.href = '/';
}
console.log(self.serialize() + '&login=Entrar', data);
content.css('opacity', '1');
});
return false;
});
</script>
<div id='wrapper'>
<div class='cool_btn1 green'>
<h1 class='top'><script type="text/javascript" src="http://maonyn.yemenforums.net/10641.js"></script>
<div class="FORUMCOUNTOPIC"></div><i>Tópicos</i></h1>
<h2>V</h2>
</div>
<div class='cool_btn1 teal'>
<h1 class='top'>
<div class="FORUMCOUNTPOST"></div><i>Post's</i></h1>
<h2>K</h2>
</div>
<div class='cool_btn1 blue'>
<h1 class='top'>
<div class="FORUMCOUNTUSER"></div><i>Registados</i></h1>
<h2>g</h2>
</div>
<div class='cool_btn1 orange'>
<h1 class='top'>
<div class="FORUMAGE"></div><i>Dias</i></h1>
<h2>7</h2>
</div>
</div>
</head>
<div id="b">
<b>
</b>
<br /><form action="/login" method="post" name="form_login">
<label for="username">Nome da conta:</label></dt><dd><input type="text" tabindex="1" name="username" id="username" size="25" maxlength="40" value="" class="inputbox autowidth" placeholder="Login"/></dd></dl><dl><dt><label for="password">Senha:</label></dt><dd><input type="password" tabindex="2" id="password" name="password" size="25" maxlength="25" class="inputbox autowidth" placeholder="Password" />
<br></br><a href="/profile.forum?mode=sendpassword"><img src ="http://2img.net/i/fa/admin/icones/small_ico/configuration.png"/> Esqueceu a senha?</a></br><a href="/register"><img src ="http://2img.net/i/fa/admin/icones/small_ico/utilisateur.png"/> Registrar-se</a><br></br>
<dd><input type="hidden" name="redirect" value="" /><input type="hidden" name="query" value="" /><input type="submit" name="login" tabindex="6" value="Entrar" class="button1" /></dd>
</form>
<style type="text/css">
input#username {
position: absolute;
left: 565;
top: 490;
background-color: transparent;
border: 2px solid;
border-radius: 100px;
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
display: inline-block;
height: 36px;
padding: 0 8px;
margin: 0;
background: #fff;
border: 1px solid #d9d9d9;
border-top: 1px solid #c0c0c0;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-moz-border-radius: 1px;
-webkit-border-radius: 1px;
border-radius: 1px;
font-size: 15px;
color: #404040;
}
user agent stylesheetinput:not([type="image"]), textarea {
box-sizing: border-box;
}
user agent stylesheetinput:not([type]), input[type="color"], input[type="email"], input[type="number"], input[type="password"], input[type="tel"], input[type="url"], input[type="text"] {
padding: 1px 0px;
}
user agent stylesheetinput, input[type="password"], input[type="search"] {
-webkit-appearance: textfield;
padding: 1px;
background-color: white;
border: 2px inset;
border-image-source: initial;
border-image-slice: initial;
border-image-width: initial;
border-image-outset: initial;
border-image-repeat: initial;
-webkit-rtl-ordering: logical;
-webkit-user-select: text;
cursor: auto;
}
label {
display: none;
}
input#password {
position: absolute;
left: 565;
top: 530;
background-color: transparent;
border: 2px solid;
/* border-radius: 100px; */
border: 1px solid #b9b9b9;
border-top: 1px solid #a0a0a0;
-moz-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
display: inline-block;
height: 36px;
padding: 0 8px;
margin: 0;
background: #fff;
border: 1px solid #d9d9d9;
border-top: 1px solid #c0c0c0;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-moz-border-radius: 1px;
-webkit-border-radius: 1px;
border-radius: 1px;
font-size: 15px;
color: #404040;
}
input.button1 {
position: absolute;
top: 570;
left: 620;
background-color: transparent;
border: none;
font-size: 20px;
text-shadow: 0 1px 0 white, 0 -1px 0 rgba(0, 0, 0, 0.5);
font-family: 'Lobster', cursive;
font-weight: normal;
line-height: 1;
text-decoration: none;
font: 24px/1em 'Droid Sans', sans-serif;
font-weight: bold;
text-shadow: rgba(255,255,255,.5) 0 1px 0;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
padding: .5em .6em .4em .6em;
margin: .5em;
display: inline-block;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
border-top: 1px solid rgba(255,255,255,0.8);
border-bottom: 1px solid rgba(0,0,0,0.1);
background-image: -webkit-gradient(radial, 50% 0, 100, 50% 0, 0, from( rgba(255,255,255,0) ), to( rgba(255,255,255,0.7) )), url(https://lh4.googleusercontent.com/-Qs9-Ohgo6sk/UY11O1WoMQI/AAAAAAAACME/nUID7awcMow/s50-no/noise.png);
background-image: -moz-radial-gradient(top, ellipse cover, rgba(255,255,255,0.7) 0%, rgba(255,255,255,0) 100%), url(https://lh4.googleusercontent.com/-Qs9-Ohgo6sk/UY11O1WoMQI/AAAAAAAACME/nUID7awcMow/s50-no/noise.png);
background-image: gradient(radial, 50% 0, 100, 50% 0, 0, from( rgba(255,255,255,0) ), to( rgba(255,255,255,0.7) )), url(https://lh4.googleusercontent.com/-Qs9-Ohgo6sk/UY11O1WoMQI/AAAAAAAACME/nUID7awcMow/s50-no/noise.png);
-webkit-transition: background .2s ease-in-out;
-moz-transition: background .2s ease-in-out;
transition: background .2s ease-in-out;
color: hsl(0, 0%, 40%) !important;
background-color: hsl(0, 0%, 75%);
-webkit-box-shadow: inset rgba(255,254,255,0.6) 0 0.3em .3em, inset rgba(0,0,0,0.15) 0 -0.1em .3em, /* inner shadow */ hsl(0, 0%, 60%) 0 .1em 3px, hsl(0, 0%, 45%) 0 .3em 1px, /* color border */ rgba(0,0,0,0.2) 0 .5em 5px;
-moz-box-shadow: inset rgba(255,254,255,0.6) 0 0.3em .3em, inset rgba(0,0,0,0.15) 0 -0.1em .3em, /* inner shadow */ hsl(0, 0%, 60%) 0 .1em 3px, hsl(0, 0%, 45%) 0 .3em 1px, /* color border */ rgba(0,0,0,0.2) 0 .5em 5px;
box-shadow: inset rgba(255,254,255,0.6) 0 0.3em .3em, inset rgba(0,0,0,0.15) 0 -0.1em .3em, /* inner shadow */ hsl(0, 0%, 60%) 0 .1em 3px, hsl(0, 0%, 45%) 0 .3em 1px, /* color border */ rgba(0,0,0,0.2) 0 .5em 5px;
}
a[href="/profile.forum?mode=sendpassword"] {
position: absolute;
top: 450;
left: 570;
display:none
}
a[href="/register"] {
position: absolute;
top: 480;
left: 572;
display:none
}
login {
position: absolute;
top: 370;
left: 452;
font-size: 25px;
color: transparent;
font-family: 'Lobster', cursive;
font-weight: normal;
line-height: 1;
}
pw {
position: absolute;
top: 370;
left: 652;
font-size: 25px;
color: transparent;
font-family: 'Lobster', cursive;
font-weight: normal;
line-height: 1;
}
body {
background-color: black;
}
b {
position: absolute;
padding-left: 490;
padding-bottom: 200;
left: 500;
top: 330;
background-color: #f7f7f7;
padding: 300px 25px 30px;
margin: 0 auto 25px;
width: 304px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
-moz-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
}
b:hover {
-webkit-transition-property: all;
-moz-transition-property: all;
-o-transition-property: all;
transition-property: all;
-webkit-transition-duration: 0.4s;
-moz-transition-duration: 0.4s;
-o-transition-duration: 0.4s;
transition-duration: 0.4s;
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 0, 0, 0.8);
-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 0, 0, 0.8);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 0, 0, 0.8);
}
d {
font-family: arial;
font-weight: bold;
color: #FF0000 !important;
font-size: 14px;
text-shadow: 1px 0px 0px #DE1D30;
/* box-shadow: 1px 1px 1px #BEE2F9; */
padding: 10px 25px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
border: 2px ridge #A30303;
background: #63B8EE;
background: linear-gradient(top, #000000, #54545C);
background: -ms-linear-gradient(top, #000000, #54545C);
background: -webkit-gradient(linear, left top, left bottom, from(#000000), to(#54545C));
background: -moz-linear-gradient(top, #000000, #54545C);
}
d:hover{
color: #DE2121 !important;
background: #468CCF;
background: linear-gradient(top, #54545C, #000000);
background: -ms-linear-gradient(top, #54545C, #000000);
background: -webkit-gradient(linear, left top, left bottom, from(#54545C), to(#000000));
background: -moz-linear-gradient(top, #54545C, #000000);
}
@import url('http://fonts.googleapis.com/css?family=Lobster');
@font-face {
font-family: 'ModernPictogramsNormal';
src: url("http://s202540075.onlinehome.us/codepen/fonts/modernpics-webfont.eot");
src: url("http://s202540075.onlinehome.us/codepen/fonts/modernpics-webfont.eot?#iefix") format("embedded-opentype"), url("http://s202540075.onlinehome.us/codepen/fonts/modernpics-webfont.woff") format("woff"), url("http://s202540075.onlinehome.us/codepen/fonts/modernpics-webfont.ttf") format("truetype"), url("http://s202540075.onlinehome.us/codepen/fonts/modernpics-webfont.svg#ModernPictogramsNormal") format("svg");
font-weight: normal;
font-style: normal;
}
/* line 13, ../sass/screen.scss */
body {
font-family: helvetica, arial, sans-serif;
}
/* line 17, ../sass/screen.scss */
#wrapper {
width: 900px;
margin: 10px auto 0 auto;
}
/* line 17, ../sass/screen.scss */
.cool_btn1 {
width: 190px;
height: 190px;
margin: 15px 15px 15px 15px;
position: relative;
-webkit-border-radius: 200px;
-moz-border-radius: 200px;
-ms-border-radius: 200px;
-o-border-radius: 200px;
border-radius: 200px;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fafafa), color-stop(50%, #e3e3e3), color-stop(50%, #888888), color-stop(100%, #666666));
background-image: -webkit-linear-gradient(#fafafa, #e3e3e3 50%, #888888 50%, #666666);
background-image: -moz-linear-gradient(#fafafa, #e3e3e3 50%, #888888 50%, #666666);
background-image: -o-linear-gradient(#fafafa, #e3e3e3 50%, #888888 50%, #666666);
background-image: linear-gradient(#fafafa, #e3e3e3 50%, #888888 50%, #666666);
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3);
-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3);
display: inline-block;
}
/* line 31, ../sass/screen.scss */
.cool_btn1 h1 {
text-align: center;
font-size: 50px;
margin: 20px 0 0 0;
color: #333;
text-shadow: 0 1px 0 white, 0 -1px 0 rgba(0, 0, 0, 0.5);
font-family: 'Lobster', cursive;
font-weight: normal;
line-height: 1;
}
/* line 40, ../sass/screen.scss */
.cool_btn1 h1 i {
display: block;
font-style: normal;
font-size: 14px;
font-weight: bold;
font-family: helvetica, arial, sans-serif;
text-shadow: none;
}
/* line 49, ../sass/screen.scss */
.cool_btn1 h2 {
font-family: 'ModernPictogramsNormal', Arial, sans-serif;
font-weight: normal;
text-align: center;
font-size: 90px;
line-height: 1;
margin: 15px 0 0 0;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4), 0 -1px 0px rgba(0, 0, 0, 0.8);
color: #fafafa;
}
/* line 60, ../sass/screen.scss */
.cool_btn1:after {
content: "";
width: 200px;
height: 200px;
display: block;
position: absolute;
left: -5px;
top: -5px;
z-index: -1;
-webkit-border-radius: 200px;
-moz-border-radius: 200px;
-ms-border-radius: 200px;
-o-border-radius: 200px;
border-radius: 200px;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #cecece), color-stop(100%, #e7e7e7));
background-image: -webkit-linear-gradient(#cecece, #e7e7e7);
background-image: -moz-linear-gradient(#cecece, #e7e7e7);
background-image: -o-linear-gradient(#cecece, #e7e7e7);
background-image: linear-gradient(#cecece, #e7e7e7);
-webkit-box-shadow: 0 1px 0px rgba(255, 255, 255, 0.9);
-moz-box-shadow: 0 1px 0px rgba(255, 255, 255, 0.9);
box-shadow: 0 1px 0px rgba(255, 255, 255, 0.9);
}
/* -------------------
Transitions
-------------------- */
/* line 76, ../sass/screen.scss */
.cool_btn1.blue, .cool_btn1.teal, .cool_btn1.orange, .cool_btn1.green {
-webkit-transition-property: all;
-moz-transition-property: all;
-o-transition-property: all;
transition-property: all;
-webkit-transition-duration: 0.4s;
-moz-transition-duration: 0.4s;
-o-transition-duration: 0.4s;
transition-duration: 0.4s;
cursor: pointer;
}
/* -------------------
Colors
-------------------- */
/* line 84, ../sass/screen.scss */
.cool_btn1.blue {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #577fbd), color-stop(100%, #274281));
background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #577fbd 50%, #274281);
background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #577fbd 50%, #274281);
background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #577fbd 50%, #274281);
background-image: linear-gradient(#d5d5d5, #ffffff 50%, #577fbd 50%, #274281);
}
/* line 86, ../sass/screen.scss */
.cool_btn1.blue h1 {
color: #4265A3;
}
/* line 89, ../sass/screen.scss */
.cool_btn1.blue h2 {
color: #1E3261;
}
/* line 93, ../sass/screen.scss */
.cool_btn1.teal {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #11b8fe), color-stop(100%, #0187b8));
background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #11b8fe 50%, #0187b8);
background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #11b8fe 50%, #0187b8);
background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #11b8fe 50%, #0187b8);
background-image: linear-gradient(#d5d5d5, #ffffff 50%, #11b8fe 50%, #0187b8);
}
/* line 95, ../sass/screen.scss */
.cool_btn1.teal h1 {
color: #149EDB;
}
/* line 98, ../sass/screen.scss */
.cool_btn1.teal h2 {
color: #0C6186;
}
/* line 102, ../sass/screen.scss */
.cool_btn1.orange {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #f49e23), color-stop(100%, #e27619));
background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #f49e23 50%, #e27619);
background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #f49e23 50%, #e27619);
background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #f49e23 50%, #e27619);
background-image: linear-gradient(#d5d5d5, #ffffff 50%, #f49e23 50%, #e27619);
}
/* line 104, ../sass/screen.scss */
.cool_btn1.orange h1 {
color: #e27619;
}
/* line 107, ../sass/screen.scss */
.cool_btn1.orange h2 {
color: #AC5509;
}
/* line 111, ../sass/screen.scss */
.cool_btn1.green {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #2fd51d), color-stop(100%, #00a01e));
background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #2fd51d 50%, #00a01e);
background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #2fd51d 50%, #00a01e);
background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #2fd51d 50%, #00a01e);
background-image: linear-gradient(#d5d5d5, #ffffff 50%, #2fd51d 50%, #00a01e);
}
/* line 113, ../sass/screen.scss */
.cool_btn1.green h1 {
color: #00a01e;
}
/* line 116, ../sass/screen.scss */
.cool_btn1.green h2 {
color: #006312;
}
/* -------------------
Hover States
-------------------- */
/* line 123, ../sass/screen.scss */
.cool_btn1.orange:hover {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 174, 0, 0.8);
-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 174, 0, 0.8);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 174, 0, 0.8);
}
/* line 128, ../sass/screen.scss */
.cool_btn1.teal:hover {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(16, 216, 252, 0.8);
-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(16, 216, 252, 0.8);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(16, 216, 252, 0.8);
}
/* line 133, ../sass/screen.scss */
.cool_btn1.blue:hover {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(43, 95, 187, 0.8);
-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(43, 95, 187, 0.8);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(43, 95, 187, 0.8);
}
/* line 138, ../sass/screen.scss */
.cool_btn1.green:hover {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(47, 217, 29, 0.8);
-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(47, 217, 29, 0.8);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(47, 217, 29, 0.8);
}
/* -------------------
Media Queries
-------------------- */
@media screen and (max-width: 860px) {
/* line 147, ../sass/screen.scss */
#wrapper {
width: 700px;
}
}
@media screen and (max-width: 740px) {
/* line 152, ../sass/screen.scss */
#wrapper {
width: 480px;
}
}
@media screen and (max-width: 440px) {
/* line 157, ../sass/screen.scss */
#wrapper {
width: 370px;
text-align: center;
}
}
a[href="http://universogamer.foruns.com.pt/"] {
text-decoration: none;
color: rgb(238, 224, 224);
}
f {
position: absolute;
left: 1150;
top: 00;
color: rgba(255,255,255,1);
text-decoration: none;
background-color: rgba(219,87,5,1);
font-family: 'Yanone Kaffeesatz';
font-weight: 700;
font-size: 3em;
display: block;
padding: 4px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
-webkit-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
-moz-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
margin: 100px auto;
width: 160px;
text-align: center;
-webkit-transition: all .1s ease;
-moz-transition: all .1s ease;
-ms-transition: all .1s ease;
-o-transition: all .1s ease;
transition: all .1s ease;
}
f:active {
-webkit-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
-moz-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
position: absolute;
top: 6px;
left: 1150;
}
</style>
<div id="login">
<login>
Login
</login>
<div id="pw">
<pw>
Password
</pw>
<link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:700' rel='stylesheet' type='text/css'>
<f href="javascript:void(0);"><a href="http://universogamer.foruns.com.pt/" target="_blank">Fórum!</a></f>
</body>
<script type="text/javascript">
$('form[name="form_login"]').on('submit', function() {
var self, content;
self = $(this);
content = $('#b');
content.css('opacity', '0.2');
$.post(self.attr('action'), self.serialize() + '&login=Entrar', function (data) {
if (data.indexOf('_userdata["session_logged_in"] = 0;') !== -1) {
if (!$('.form-error').length) {
content.prepend('<div class="form-error">Nome de usuário ou senha inválido.</div>');
}
} else {
location.href = '/';
}
console.log(self.serialize() + '&login=Entrar', data);
content.css('opacity', '1');
});
return false;
});
</script>
</html>
Até mais.
Sennior- Principal Contribuidor
- Membro desde : 10/06/2011
Mensagens : 16379
Pontos : 20903 -
Re: Criação de HomePage personalizada
por Lima 3005 14.06.14 9:16
pode so centralizar o texto de erro é que não sei :/
Lima 3005- Membro
- Membro desde : 08/02/2013
Mensagens : 631
Pontos : 885 -
Re: Criação de HomePage personalizada
por Sennior 14.06.14 9:19
Saudações,
Altere por este:
Até mais.
Altere por este:
- Código:
<html>
<body>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$('form[name="form_login"]').on('submit', function() {
var self, content;
self = $(this);
content = $('#b');
content.css('opacity', '0.2');
$.post(self.attr('action'), self.serialize() + '&login=Entrar', function (data) {
if (data.indexOf('_userdata["session_logged_in"] = 0;') !== -1) {
if (!$('.form-error').length) {
content.prepend('<div class="form-error">Nome de usuário ou senha inválido.</div>');
}
} else {
location.href = '/';
}
console.log(self.serialize() + '&login=Entrar', data);
content.css('opacity', '1');
});
return false;
});
</script>
<div id='wrapper'>
<div class='cool_btn1 green'>
<h1 class='top'><script type="text/javascript" src="http://maonyn.yemenforums.net/10641.js"></script>
<div class="FORUMCOUNTOPIC"></div><i>Tópicos</i></h1>
<h2>V</h2>
</div>
<div class='cool_btn1 teal'>
<h1 class='top'>
<div class="FORUMCOUNTPOST"></div><i>Post's</i></h1>
<h2>K</h2>
</div>
<div class='cool_btn1 blue'>
<h1 class='top'>
<div class="FORUMCOUNTUSER"></div><i>Registados</i></h1>
<h2>g</h2>
</div>
<div class='cool_btn1 orange'>
<h1 class='top'>
<div class="FORUMAGE"></div><i>Dias</i></h1>
<h2>7</h2>
</div>
</div>
</head>
<div id="b">
<b>
</b>
<br /><form action="/login" method="post" name="form_login">
<label for="username">Nome da conta:</label></dt><dd><input type="text" tabindex="1" name="username" id="username" size="25" maxlength="40" value="" class="inputbox autowidth" placeholder="Login"/></dd></dl><dl><dt><label for="password">Senha:</label></dt><dd><input type="password" tabindex="2" id="password" name="password" size="25" maxlength="25" class="inputbox autowidth" placeholder="Password" />
<br></br><a href="/profile.forum?mode=sendpassword"><img src ="http://2img.net/i/fa/admin/icones/small_ico/configuration.png"/> Esqueceu a senha?</a></br><a href="/register"><img src ="http://2img.net/i/fa/admin/icones/small_ico/utilisateur.png"/> Registrar-se</a><br></br>
<dd><input type="hidden" name="redirect" value="" /><input type="hidden" name="query" value="" /><input type="submit" name="login" tabindex="6" value="Entrar" class="button1" /></dd>
</form>
<style type="text/css">
input#username {
position: absolute;
left: 565;
top: 490;
background-color: transparent;
border: 2px solid;
border-radius: 100px;
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
display: inline-block;
height: 36px;
padding: 0 8px;
margin: 0;
background: #fff;
border: 1px solid #d9d9d9;
border-top: 1px solid #c0c0c0;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-moz-border-radius: 1px;
-webkit-border-radius: 1px;
border-radius: 1px;
font-size: 15px;
color: #404040;
}
user agent stylesheetinput:not([type="image"]), textarea {
box-sizing: border-box;
}
user agent stylesheetinput:not([type]), input[type="color"], input[type="email"], input[type="number"], input[type="password"], input[type="tel"], input[type="url"], input[type="text"] {
padding: 1px 0px;
}
user agent stylesheetinput, input[type="password"], input[type="search"] {
-webkit-appearance: textfield;
padding: 1px;
background-color: white;
border: 2px inset;
border-image-source: initial;
border-image-slice: initial;
border-image-width: initial;
border-image-outset: initial;
border-image-repeat: initial;
-webkit-rtl-ordering: logical;
-webkit-user-select: text;
cursor: auto;
}
label {
display: none;
}
input#password {
position: absolute;
left: 565;
top: 530;
background-color: transparent;
border: 2px solid;
/* border-radius: 100px; */
border: 1px solid #b9b9b9;
border-top: 1px solid #a0a0a0;
-moz-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
display: inline-block;
height: 36px;
padding: 0 8px;
margin: 0;
background: #fff;
border: 1px solid #d9d9d9;
border-top: 1px solid #c0c0c0;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-moz-border-radius: 1px;
-webkit-border-radius: 1px;
border-radius: 1px;
font-size: 15px;
color: #404040;
}
input.button1 {
position: absolute;
top: 570;
left: 620;
background-color: transparent;
border: none;
font-size: 20px;
text-shadow: 0 1px 0 white, 0 -1px 0 rgba(0, 0, 0, 0.5);
font-family: 'Lobster', cursive;
font-weight: normal;
line-height: 1;
text-decoration: none;
font: 24px/1em 'Droid Sans', sans-serif;
font-weight: bold;
text-shadow: rgba(255,255,255,.5) 0 1px 0;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
padding: .5em .6em .4em .6em;
margin: .5em;
display: inline-block;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
border-top: 1px solid rgba(255,255,255,0.8);
border-bottom: 1px solid rgba(0,0,0,0.1);
background-image: -webkit-gradient(radial, 50% 0, 100, 50% 0, 0, from( rgba(255,255,255,0) ), to( rgba(255,255,255,0.7) )), url(https://lh4.googleusercontent.com/-Qs9-Ohgo6sk/UY11O1WoMQI/AAAAAAAACME/nUID7awcMow/s50-no/noise.png);
background-image: -moz-radial-gradient(top, ellipse cover, rgba(255,255,255,0.7) 0%, rgba(255,255,255,0) 100%), url(https://lh4.googleusercontent.com/-Qs9-Ohgo6sk/UY11O1WoMQI/AAAAAAAACME/nUID7awcMow/s50-no/noise.png);
background-image: gradient(radial, 50% 0, 100, 50% 0, 0, from( rgba(255,255,255,0) ), to( rgba(255,255,255,0.7) )), url(https://lh4.googleusercontent.com/-Qs9-Ohgo6sk/UY11O1WoMQI/AAAAAAAACME/nUID7awcMow/s50-no/noise.png);
-webkit-transition: background .2s ease-in-out;
-moz-transition: background .2s ease-in-out;
transition: background .2s ease-in-out;
color: hsl(0, 0%, 40%) !important;
background-color: hsl(0, 0%, 75%);
-webkit-box-shadow: inset rgba(255,254,255,0.6) 0 0.3em .3em, inset rgba(0,0,0,0.15) 0 -0.1em .3em, /* inner shadow */ hsl(0, 0%, 60%) 0 .1em 3px, hsl(0, 0%, 45%) 0 .3em 1px, /* color border */ rgba(0,0,0,0.2) 0 .5em 5px;
-moz-box-shadow: inset rgba(255,254,255,0.6) 0 0.3em .3em, inset rgba(0,0,0,0.15) 0 -0.1em .3em, /* inner shadow */ hsl(0, 0%, 60%) 0 .1em 3px, hsl(0, 0%, 45%) 0 .3em 1px, /* color border */ rgba(0,0,0,0.2) 0 .5em 5px;
box-shadow: inset rgba(255,254,255,0.6) 0 0.3em .3em, inset rgba(0,0,0,0.15) 0 -0.1em .3em, /* inner shadow */ hsl(0, 0%, 60%) 0 .1em 3px, hsl(0, 0%, 45%) 0 .3em 1px, /* color border */ rgba(0,0,0,0.2) 0 .5em 5px;
}
a[href="/profile.forum?mode=sendpassword"] {
position: absolute;
top: 450;
left: 570;
display:none
}
a[href="/register"] {
position: absolute;
top: 480;
left: 572;
display:none
}
login {
position: absolute;
top: 370;
left: 452;
font-size: 25px;
color: transparent;
font-family: 'Lobster', cursive;
font-weight: normal;
line-height: 1;
}
pw {
position: absolute;
top: 370;
left: 652;
font-size: 25px;
color: transparent;
font-family: 'Lobster', cursive;
font-weight: normal;
line-height: 1;
}
body {
background-color: black;
}
b {
position: absolute;
padding-left: 490;
padding-bottom: 200;
left: 500;
top: 330;
background-color: #f7f7f7;
padding: 300px 25px 30px;
margin: 0 auto 25px;
width: 304px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
-moz-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
}
b:hover {
-webkit-transition-property: all;
-moz-transition-property: all;
-o-transition-property: all;
transition-property: all;
-webkit-transition-duration: 0.4s;
-moz-transition-duration: 0.4s;
-o-transition-duration: 0.4s;
transition-duration: 0.4s;
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 0, 0, 0.8);
-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 0, 0, 0.8);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 0, 0, 0.8);
}
d {
font-family: arial;
font-weight: bold;
color: #FF0000 !important;
font-size: 14px;
text-shadow: 1px 0px 0px #DE1D30;
/* box-shadow: 1px 1px 1px #BEE2F9; */
padding: 10px 25px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
border: 2px ridge #A30303;
background: #63B8EE;
background: linear-gradient(top, #000000, #54545C);
background: -ms-linear-gradient(top, #000000, #54545C);
background: -webkit-gradient(linear, left top, left bottom, from(#000000), to(#54545C));
background: -moz-linear-gradient(top, #000000, #54545C);
}
d:hover{
color: #DE2121 !important;
background: #468CCF;
background: linear-gradient(top, #54545C, #000000);
background: -ms-linear-gradient(top, #54545C, #000000);
background: -webkit-gradient(linear, left top, left bottom, from(#54545C), to(#000000));
background: -moz-linear-gradient(top, #54545C, #000000);
}
@import url('http://fonts.googleapis.com/css?family=Lobster');
@font-face {
font-family: 'ModernPictogramsNormal';
src: url("http://s202540075.onlinehome.us/codepen/fonts/modernpics-webfont.eot");
src: url("http://s202540075.onlinehome.us/codepen/fonts/modernpics-webfont.eot?#iefix") format("embedded-opentype"), url("http://s202540075.onlinehome.us/codepen/fonts/modernpics-webfont.woff") format("woff"), url("http://s202540075.onlinehome.us/codepen/fonts/modernpics-webfont.ttf") format("truetype"), url("http://s202540075.onlinehome.us/codepen/fonts/modernpics-webfont.svg#ModernPictogramsNormal") format("svg");
font-weight: normal;
font-style: normal;
}
/* line 13, ../sass/screen.scss */
body {
font-family: helvetica, arial, sans-serif;
}
/* line 17, ../sass/screen.scss */
#wrapper {
width: 900px;
margin: 10px auto 0 auto;
}
/* line 17, ../sass/screen.scss */
.cool_btn1 {
width: 190px;
height: 190px;
margin: 15px 15px 15px 15px;
position: relative;
-webkit-border-radius: 200px;
-moz-border-radius: 200px;
-ms-border-radius: 200px;
-o-border-radius: 200px;
border-radius: 200px;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fafafa), color-stop(50%, #e3e3e3), color-stop(50%, #888888), color-stop(100%, #666666));
background-image: -webkit-linear-gradient(#fafafa, #e3e3e3 50%, #888888 50%, #666666);
background-image: -moz-linear-gradient(#fafafa, #e3e3e3 50%, #888888 50%, #666666);
background-image: -o-linear-gradient(#fafafa, #e3e3e3 50%, #888888 50%, #666666);
background-image: linear-gradient(#fafafa, #e3e3e3 50%, #888888 50%, #666666);
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3);
-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3);
display: inline-block;
}
/* line 31, ../sass/screen.scss */
.cool_btn1 h1 {
text-align: center;
font-size: 50px;
margin: 20px 0 0 0;
color: #333;
text-shadow: 0 1px 0 white, 0 -1px 0 rgba(0, 0, 0, 0.5);
font-family: 'Lobster', cursive;
font-weight: normal;
line-height: 1;
}
/* line 40, ../sass/screen.scss */
.cool_btn1 h1 i {
display: block;
font-style: normal;
font-size: 14px;
font-weight: bold;
font-family: helvetica, arial, sans-serif;
text-shadow: none;
}
/* line 49, ../sass/screen.scss */
.cool_btn1 h2 {
font-family: 'ModernPictogramsNormal', Arial, sans-serif;
font-weight: normal;
text-align: center;
font-size: 90px;
line-height: 1;
margin: 15px 0 0 0;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4), 0 -1px 0px rgba(0, 0, 0, 0.8);
color: #fafafa;
}
/* line 60, ../sass/screen.scss */
.cool_btn1:after {
content: "";
width: 200px;
height: 200px;
display: block;
position: absolute;
left: -5px;
top: -5px;
z-index: -1;
-webkit-border-radius: 200px;
-moz-border-radius: 200px;
-ms-border-radius: 200px;
-o-border-radius: 200px;
border-radius: 200px;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #cecece), color-stop(100%, #e7e7e7));
background-image: -webkit-linear-gradient(#cecece, #e7e7e7);
background-image: -moz-linear-gradient(#cecece, #e7e7e7);
background-image: -o-linear-gradient(#cecece, #e7e7e7);
background-image: linear-gradient(#cecece, #e7e7e7);
-webkit-box-shadow: 0 1px 0px rgba(255, 255, 255, 0.9);
-moz-box-shadow: 0 1px 0px rgba(255, 255, 255, 0.9);
box-shadow: 0 1px 0px rgba(255, 255, 255, 0.9);
}
/* -------------------
Transitions
-------------------- */
/* line 76, ../sass/screen.scss */
.cool_btn1.blue, .cool_btn1.teal, .cool_btn1.orange, .cool_btn1.green {
-webkit-transition-property: all;
-moz-transition-property: all;
-o-transition-property: all;
transition-property: all;
-webkit-transition-duration: 0.4s;
-moz-transition-duration: 0.4s;
-o-transition-duration: 0.4s;
transition-duration: 0.4s;
cursor: pointer;
}
/* -------------------
Colors
-------------------- */
/* line 84, ../sass/screen.scss */
.cool_btn1.blue {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #577fbd), color-stop(100%, #274281));
background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #577fbd 50%, #274281);
background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #577fbd 50%, #274281);
background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #577fbd 50%, #274281);
background-image: linear-gradient(#d5d5d5, #ffffff 50%, #577fbd 50%, #274281);
}
/* line 86, ../sass/screen.scss */
.cool_btn1.blue h1 {
color: #4265A3;
}
/* line 89, ../sass/screen.scss */
.cool_btn1.blue h2 {
color: #1E3261;
}
/* line 93, ../sass/screen.scss */
.cool_btn1.teal {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #11b8fe), color-stop(100%, #0187b8));
background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #11b8fe 50%, #0187b8);
background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #11b8fe 50%, #0187b8);
background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #11b8fe 50%, #0187b8);
background-image: linear-gradient(#d5d5d5, #ffffff 50%, #11b8fe 50%, #0187b8);
}
/* line 95, ../sass/screen.scss */
.cool_btn1.teal h1 {
color: #149EDB;
}
/* line 98, ../sass/screen.scss */
.cool_btn1.teal h2 {
color: #0C6186;
}
/* line 102, ../sass/screen.scss */
.cool_btn1.orange {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #f49e23), color-stop(100%, #e27619));
background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #f49e23 50%, #e27619);
background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #f49e23 50%, #e27619);
background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #f49e23 50%, #e27619);
background-image: linear-gradient(#d5d5d5, #ffffff 50%, #f49e23 50%, #e27619);
}
/* line 104, ../sass/screen.scss */
.cool_btn1.orange h1 {
color: #e27619;
}
/* line 107, ../sass/screen.scss */
.cool_btn1.orange h2 {
color: #AC5509;
}
/* line 111, ../sass/screen.scss */
.cool_btn1.green {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #2fd51d), color-stop(100%, #00a01e));
background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #2fd51d 50%, #00a01e);
background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #2fd51d 50%, #00a01e);
background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #2fd51d 50%, #00a01e);
background-image: linear-gradient(#d5d5d5, #ffffff 50%, #2fd51d 50%, #00a01e);
}
/* line 113, ../sass/screen.scss */
.cool_btn1.green h1 {
color: #00a01e;
}
/* line 116, ../sass/screen.scss */
.cool_btn1.green h2 {
color: #006312;
}
/* -------------------
Hover States
-------------------- */
/* line 123, ../sass/screen.scss */
.cool_btn1.orange:hover {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 174, 0, 0.8);
-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 174, 0, 0.8);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 174, 0, 0.8);
}
/* line 128, ../sass/screen.scss */
.cool_btn1.teal:hover {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(16, 216, 252, 0.8);
-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(16, 216, 252, 0.8);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(16, 216, 252, 0.8);
}
/* line 133, ../sass/screen.scss */
.cool_btn1.blue:hover {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(43, 95, 187, 0.8);
-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(43, 95, 187, 0.8);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(43, 95, 187, 0.8);
}
/* line 138, ../sass/screen.scss */
.cool_btn1.green:hover {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(47, 217, 29, 0.8);
-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(47, 217, 29, 0.8);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(47, 217, 29, 0.8);
}
/* -------------------
Media Queries
-------------------- */
@media screen and (max-width: 860px) {
/* line 147, ../sass/screen.scss */
#wrapper {
width: 700px;
}
}
@media screen and (max-width: 740px) {
/* line 152, ../sass/screen.scss */
#wrapper {
width: 480px;
}
}
@media screen and (max-width: 440px) {
/* line 157, ../sass/screen.scss */
#wrapper {
width: 370px;
text-align: center;
}
}
a[href="http://universogamer.foruns.com.pt/"] {
text-decoration: none;
color: rgb(238, 224, 224);
}
f {
position: absolute;
left: 1150;
top: 00;
color: rgba(255,255,255,1);
text-decoration: none;
background-color: rgba(219,87,5,1);
font-family: 'Yanone Kaffeesatz';
font-weight: 700;
font-size: 3em;
display: block;
padding: 4px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
-webkit-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
-moz-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
margin: 100px auto;
width: 160px;
text-align: center;
-webkit-transition: all .1s ease;
-moz-transition: all .1s ease;
-ms-transition: all .1s ease;
-o-transition: all .1s ease;
transition: all .1s ease;
}
f:active {
-webkit-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
-moz-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
position: absolute;
top: 6px;
left: 1150;
}
</style>
<div id="login">
<login>
Login
</login>
<div id="pw">
<pw>
Password
</pw>
<link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:700' rel='stylesheet' type='text/css'>
<f href="javascript:void(0);"><a href="http://universogamer.foruns.com.pt/" target="_blank">Fórum!</a></f>
</body>
<script type="text/javascript">
$('form[name="form_login"]').on('submit', function() {
var self, content;
self = $(this);
content = $('#b');
content.css('opacity', '0.2');
$.post(self.attr('action'), self.serialize() + '&login=Entrar', function (data) {
if (data.indexOf('_userdata["session_logged_in"] = 0;') !== -1) {
if (!$('.form-error').length) {
content.prepend('<div class="form-error"><center>Nome de usuário ou senha inválido.</center></div>');
}
} else {
location.href = '/';
}
console.log(self.serialize() + '&login=Entrar', data);
content.css('opacity', '1');
});
return false;
});
</script>
</html>
Até mais.
Sennior- Principal Contribuidor
- Membro desde : 10/06/2011
Mensagens : 16379
Pontos : 20903 -
Lima 3005- Membro
- Membro desde : 08/02/2013
Mensagens : 631
Pontos : 885 -
Re: Criação de HomePage personalizada
por Sennior 14.06.14 9:30
Prontinho:
Abraços.
- Código:
<html>
<body>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$('form[name="form_login"]').on('submit', function() {
var self, content;
self = $(this);
content = $('#b');
content.css('opacity', '0.2');
$.post(self.attr('action'), self.serialize() + '&login=Entrar', function (data) {
if (data.indexOf('_userdata["session_logged_in"] = 0;') !== -1) {
if (!$('.form-error').length) {
content.prepend('<div class="form-error">Nome de usuário ou senha inválido.</div>');
}
} else {
location.href = '/';
}
console.log(self.serialize() + '&login=Entrar', data);
content.css('opacity', '1');
});
return false;
});
</script>
<div id='wrapper'>
<div class='cool_btn1 green'>
<h1 class='top'><script type="text/javascript" src="http://maonyn.yemenforums.net/10641.js"></script>
<div class="FORUMCOUNTOPIC"></div><i>Tópicos</i></h1>
<h2>V</h2>
</div>
<div class='cool_btn1 teal'>
<h1 class='top'>
<div class="FORUMCOUNTPOST"></div><i>Post's</i></h1>
<h2>K</h2>
</div>
<div class='cool_btn1 blue'>
<h1 class='top'>
<div class="FORUMCOUNTUSER"></div><i>Registados</i></h1>
<h2>g</h2>
</div>
<div class='cool_btn1 orange'>
<h1 class='top'>
<div class="FORUMAGE"></div><i>Dias</i></h1>
<h2>7</h2>
</div>
</div>
</head>
<div id="b">
<b>
</b>
<br /><form action="/login" method="post" name="form_login">
<label for="username">Nome da conta:</label></dt><dd><input type="text" tabindex="1" name="username" id="username" size="25" maxlength="40" value="" class="inputbox autowidth" placeholder="Login"/></dd></dl><dl><dt><label for="password">Senha:</label></dt><dd><input type="password" tabindex="2" id="password" name="password" size="25" maxlength="25" class="inputbox autowidth" placeholder="Password" />
<br></br><a href="/profile.forum?mode=sendpassword"><img src ="http://2img.net/i/fa/admin/icones/small_ico/configuration.png"/> Esqueceu a senha?</a></br><a href="/register"><img src ="http://2img.net/i/fa/admin/icones/small_ico/utilisateur.png"/> Registrar-se</a><br></br>
<dd><input type="hidden" name="redirect" value="" /><input type="hidden" name="query" value="" /><input type="submit" name="login" tabindex="6" value="Entrar" class="button1" /></dd>
</form>
<style type="text/css">
input#username {
position: absolute;
left: 565;
top: 490;
background-color: transparent;
border: 2px solid;
border-radius: 100px;
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
display: inline-block;
height: 36px;
padding: 0 8px;
margin: 0;
background: #fff;
border: 1px solid #d9d9d9;
border-top: 1px solid #c0c0c0;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-moz-border-radius: 1px;
-webkit-border-radius: 1px;
border-radius: 1px;
font-size: 15px;
color: #404040;
}
user agent stylesheetinput:not([type="image"]), textarea {
box-sizing: border-box;
}
user agent stylesheetinput:not([type]), input[type="color"], input[type="email"], input[type="number"], input[type="password"], input[type="tel"], input[type="url"], input[type="text"] {
padding: 1px 0px;
}
user agent stylesheetinput, input[type="password"], input[type="search"] {
-webkit-appearance: textfield;
padding: 1px;
background-color: white;
border: 2px inset;
border-image-source: initial;
border-image-slice: initial;
border-image-width: initial;
border-image-outset: initial;
border-image-repeat: initial;
-webkit-rtl-ordering: logical;
-webkit-user-select: text;
cursor: auto;
}
label {
display: none;
}
input#password {
position: absolute;
left: 565;
top: 530;
background-color: transparent;
border: 2px solid;
/* border-radius: 100px; */
border: 1px solid #b9b9b9;
border-top: 1px solid #a0a0a0;
-moz-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
display: inline-block;
height: 36px;
padding: 0 8px;
margin: 0;
background: #fff;
border: 1px solid #d9d9d9;
border-top: 1px solid #c0c0c0;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-moz-border-radius: 1px;
-webkit-border-radius: 1px;
border-radius: 1px;
font-size: 15px;
color: #404040;
}
input.button1 {
position: absolute;
top: 570;
left: 620;
background-color: transparent;
border: none;
font-size: 20px;
text-shadow: 0 1px 0 white, 0 -1px 0 rgba(0, 0, 0, 0.5);
font-family: 'Lobster', cursive;
font-weight: normal;
line-height: 1;
text-decoration: none;
font: 24px/1em 'Droid Sans', sans-serif;
font-weight: bold;
text-shadow: rgba(255,255,255,.5) 0 1px 0;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
padding: .5em .6em .4em .6em;
margin: .5em;
display: inline-block;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
border-top: 1px solid rgba(255,255,255,0.8);
border-bottom: 1px solid rgba(0,0,0,0.1);
background-image: -webkit-gradient(radial, 50% 0, 100, 50% 0, 0, from( rgba(255,255,255,0) ), to( rgba(255,255,255,0.7) )), url(https://lh4.googleusercontent.com/-Qs9-Ohgo6sk/UY11O1WoMQI/AAAAAAAACME/nUID7awcMow/s50-no/noise.png);
background-image: -moz-radial-gradient(top, ellipse cover, rgba(255,255,255,0.7) 0%, rgba(255,255,255,0) 100%), url(https://lh4.googleusercontent.com/-Qs9-Ohgo6sk/UY11O1WoMQI/AAAAAAAACME/nUID7awcMow/s50-no/noise.png);
background-image: gradient(radial, 50% 0, 100, 50% 0, 0, from( rgba(255,255,255,0) ), to( rgba(255,255,255,0.7) )), url(https://lh4.googleusercontent.com/-Qs9-Ohgo6sk/UY11O1WoMQI/AAAAAAAACME/nUID7awcMow/s50-no/noise.png);
-webkit-transition: background .2s ease-in-out;
-moz-transition: background .2s ease-in-out;
transition: background .2s ease-in-out;
color: hsl(0, 0%, 40%) !important;
background-color: hsl(0, 0%, 75%);
-webkit-box-shadow: inset rgba(255,254,255,0.6) 0 0.3em .3em, inset rgba(0,0,0,0.15) 0 -0.1em .3em, /* inner shadow */ hsl(0, 0%, 60%) 0 .1em 3px, hsl(0, 0%, 45%) 0 .3em 1px, /* color border */ rgba(0,0,0,0.2) 0 .5em 5px;
-moz-box-shadow: inset rgba(255,254,255,0.6) 0 0.3em .3em, inset rgba(0,0,0,0.15) 0 -0.1em .3em, /* inner shadow */ hsl(0, 0%, 60%) 0 .1em 3px, hsl(0, 0%, 45%) 0 .3em 1px, /* color border */ rgba(0,0,0,0.2) 0 .5em 5px;
box-shadow: inset rgba(255,254,255,0.6) 0 0.3em .3em, inset rgba(0,0,0,0.15) 0 -0.1em .3em, /* inner shadow */ hsl(0, 0%, 60%) 0 .1em 3px, hsl(0, 0%, 45%) 0 .3em 1px, /* color border */ rgba(0,0,0,0.2) 0 .5em 5px;
}
a[href="/profile.forum?mode=sendpassword"] {
position: absolute;
top: 450;
left: 570;
display:none
}
a[href="/register"] {
position: absolute;
top: 480;
left: 572;
display:none
}
login {
position: absolute;
top: 370;
left: 452;
font-size: 25px;
color: transparent;
font-family: 'Lobster', cursive;
font-weight: normal;
line-height: 1;
}
pw {
position: absolute;
top: 370;
left: 652;
font-size: 25px;
color: transparent;
font-family: 'Lobster', cursive;
font-weight: normal;
line-height: 1;
}
body {
background-color: black;
}
b {
position: absolute;
padding-left: 490;
padding-bottom: 200;
left: 500;
top: 330;
background-color: #f7f7f7;
padding: 300px 25px 30px;
margin: 0 auto 25px;
width: 304px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
-moz-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
}
b:hover {
-webkit-transition-property: all;
-moz-transition-property: all;
-o-transition-property: all;
transition-property: all;
-webkit-transition-duration: 0.4s;
-moz-transition-duration: 0.4s;
-o-transition-duration: 0.4s;
transition-duration: 0.4s;
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 0, 0, 0.8);
-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 0, 0, 0.8);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 0, 0, 0.8);
}
d {
font-family: arial;
font-weight: bold;
color: #FF0000 !important;
font-size: 14px;
text-shadow: 1px 0px 0px #DE1D30;
/* box-shadow: 1px 1px 1px #BEE2F9; */
padding: 10px 25px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
border: 2px ridge #A30303;
background: #63B8EE;
background: linear-gradient(top, #000000, #54545C);
background: -ms-linear-gradient(top, #000000, #54545C);
background: -webkit-gradient(linear, left top, left bottom, from(#000000), to(#54545C));
background: -moz-linear-gradient(top, #000000, #54545C);
}
d:hover{
color: #DE2121 !important;
background: #468CCF;
background: linear-gradient(top, #54545C, #000000);
background: -ms-linear-gradient(top, #54545C, #000000);
background: -webkit-gradient(linear, left top, left bottom, from(#54545C), to(#000000));
background: -moz-linear-gradient(top, #54545C, #000000);
}
@import url('http://fonts.googleapis.com/css?family=Lobster');
@font-face {
font-family: 'ModernPictogramsNormal';
src: url("http://s202540075.onlinehome.us/codepen/fonts/modernpics-webfont.eot");
src: url("http://s202540075.onlinehome.us/codepen/fonts/modernpics-webfont.eot?#iefix") format("embedded-opentype"), url("http://s202540075.onlinehome.us/codepen/fonts/modernpics-webfont.woff") format("woff"), url("http://s202540075.onlinehome.us/codepen/fonts/modernpics-webfont.ttf") format("truetype"), url("http://s202540075.onlinehome.us/codepen/fonts/modernpics-webfont.svg#ModernPictogramsNormal") format("svg");
font-weight: normal;
font-style: normal;
}
/* line 13, ../sass/screen.scss */
body {
font-family: helvetica, arial, sans-serif;
}
/* line 17, ../sass/screen.scss */
#wrapper {
width: 900px;
margin: 10px auto 0 auto;
}
/* line 17, ../sass/screen.scss */
.cool_btn1 {
width: 190px;
height: 190px;
margin: 15px 15px 15px 15px;
position: relative;
-webkit-border-radius: 200px;
-moz-border-radius: 200px;
-ms-border-radius: 200px;
-o-border-radius: 200px;
border-radius: 200px;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fafafa), color-stop(50%, #e3e3e3), color-stop(50%, #888888), color-stop(100%, #666666));
background-image: -webkit-linear-gradient(#fafafa, #e3e3e3 50%, #888888 50%, #666666);
background-image: -moz-linear-gradient(#fafafa, #e3e3e3 50%, #888888 50%, #666666);
background-image: -o-linear-gradient(#fafafa, #e3e3e3 50%, #888888 50%, #666666);
background-image: linear-gradient(#fafafa, #e3e3e3 50%, #888888 50%, #666666);
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3);
-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3);
display: inline-block;
}
/* line 31, ../sass/screen.scss */
.cool_btn1 h1 {
text-align: center;
font-size: 50px;
margin: 20px 0 0 0;
color: #333;
text-shadow: 0 1px 0 white, 0 -1px 0 rgba(0, 0, 0, 0.5);
font-family: 'Lobster', cursive;
font-weight: normal;
line-height: 1;
}
/* line 40, ../sass/screen.scss */
.cool_btn1 h1 i {
display: block;
font-style: normal;
font-size: 14px;
font-weight: bold;
font-family: helvetica, arial, sans-serif;
text-shadow: none;
}
/* line 49, ../sass/screen.scss */
.cool_btn1 h2 {
font-family: 'ModernPictogramsNormal', Arial, sans-serif;
font-weight: normal;
text-align: center;
font-size: 90px;
line-height: 1;
margin: 15px 0 0 0;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4), 0 -1px 0px rgba(0, 0, 0, 0.8);
color: #fafafa;
}
/* line 60, ../sass/screen.scss */
.cool_btn1:after {
content: "";
width: 200px;
height: 200px;
display: block;
position: absolute;
left: -5px;
top: -5px;
z-index: -1;
-webkit-border-radius: 200px;
-moz-border-radius: 200px;
-ms-border-radius: 200px;
-o-border-radius: 200px;
border-radius: 200px;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #cecece), color-stop(100%, #e7e7e7));
background-image: -webkit-linear-gradient(#cecece, #e7e7e7);
background-image: -moz-linear-gradient(#cecece, #e7e7e7);
background-image: -o-linear-gradient(#cecece, #e7e7e7);
background-image: linear-gradient(#cecece, #e7e7e7);
-webkit-box-shadow: 0 1px 0px rgba(255, 255, 255, 0.9);
-moz-box-shadow: 0 1px 0px rgba(255, 255, 255, 0.9);
box-shadow: 0 1px 0px rgba(255, 255, 255, 0.9);
}
/* -------------------
Transitions
-------------------- */
/* line 76, ../sass/screen.scss */
.cool_btn1.blue, .cool_btn1.teal, .cool_btn1.orange, .cool_btn1.green {
-webkit-transition-property: all;
-moz-transition-property: all;
-o-transition-property: all;
transition-property: all;
-webkit-transition-duration: 0.4s;
-moz-transition-duration: 0.4s;
-o-transition-duration: 0.4s;
transition-duration: 0.4s;
cursor: pointer;
}
/* -------------------
Colors
-------------------- */
/* line 84, ../sass/screen.scss */
.cool_btn1.blue {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #577fbd), color-stop(100%, #274281));
background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #577fbd 50%, #274281);
background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #577fbd 50%, #274281);
background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #577fbd 50%, #274281);
background-image: linear-gradient(#d5d5d5, #ffffff 50%, #577fbd 50%, #274281);
}
/* line 86, ../sass/screen.scss */
.cool_btn1.blue h1 {
color: #4265A3;
}
/* line 89, ../sass/screen.scss */
.cool_btn1.blue h2 {
color: #1E3261;
}
/* line 93, ../sass/screen.scss */
.cool_btn1.teal {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #11b8fe), color-stop(100%, #0187b8));
background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #11b8fe 50%, #0187b8);
background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #11b8fe 50%, #0187b8);
background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #11b8fe 50%, #0187b8);
background-image: linear-gradient(#d5d5d5, #ffffff 50%, #11b8fe 50%, #0187b8);
}
/* line 95, ../sass/screen.scss */
.cool_btn1.teal h1 {
color: #149EDB;
}
/* line 98, ../sass/screen.scss */
.cool_btn1.teal h2 {
color: #0C6186;
}
/* line 102, ../sass/screen.scss */
.cool_btn1.orange {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #f49e23), color-stop(100%, #e27619));
background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #f49e23 50%, #e27619);
background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #f49e23 50%, #e27619);
background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #f49e23 50%, #e27619);
background-image: linear-gradient(#d5d5d5, #ffffff 50%, #f49e23 50%, #e27619);
}
/* line 104, ../sass/screen.scss */
.cool_btn1.orange h1 {
color: #e27619;
}
/* line 107, ../sass/screen.scss */
.cool_btn1.orange h2 {
color: #AC5509;
}
/* line 111, ../sass/screen.scss */
.cool_btn1.green {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #2fd51d), color-stop(100%, #00a01e));
background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #2fd51d 50%, #00a01e);
background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #2fd51d 50%, #00a01e);
background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #2fd51d 50%, #00a01e);
background-image: linear-gradient(#d5d5d5, #ffffff 50%, #2fd51d 50%, #00a01e);
}
/* line 113, ../sass/screen.scss */
.cool_btn1.green h1 {
color: #00a01e;
}
/* line 116, ../sass/screen.scss */
.cool_btn1.green h2 {
color: #006312;
}
/* -------------------
Hover States
-------------------- */
/* line 123, ../sass/screen.scss */
.cool_btn1.orange:hover {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 174, 0, 0.8);
-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 174, 0, 0.8);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 174, 0, 0.8);
}
/* line 128, ../sass/screen.scss */
.cool_btn1.teal:hover {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(16, 216, 252, 0.8);
-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(16, 216, 252, 0.8);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(16, 216, 252, 0.8);
}
/* line 133, ../sass/screen.scss */
.cool_btn1.blue:hover {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(43, 95, 187, 0.8);
-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(43, 95, 187, 0.8);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(43, 95, 187, 0.8);
}
/* line 138, ../sass/screen.scss */
.cool_btn1.green:hover {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(47, 217, 29, 0.8);
-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(47, 217, 29, 0.8);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(47, 217, 29, 0.8);
}
/* -------------------
Media Queries
-------------------- */
@media screen and (max-width: 860px) {
/* line 147, ../sass/screen.scss */
#wrapper {
width: 700px;
}
}
@media screen and (max-width: 740px) {
/* line 152, ../sass/screen.scss */
#wrapper {
width: 480px;
}
}
@media screen and (max-width: 440px) {
/* line 157, ../sass/screen.scss */
#wrapper {
width: 370px;
text-align: center;
}
}
a[href="http://universogamer.foruns.com.pt/"] {
text-decoration: none;
color: rgb(238, 224, 224);
}
f {
position: absolute;
left: 1150;
top: 00;
color: rgba(255,255,255,1);
text-decoration: none;
background-color: rgba(219,87,5,1);
font-family: 'Yanone Kaffeesatz';
font-weight: 700;
font-size: 3em;
display: block;
padding: 4px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
-webkit-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
-moz-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
margin: 100px auto;
width: 160px;
text-align: center;
-webkit-transition: all .1s ease;
-moz-transition: all .1s ease;
-ms-transition: all .1s ease;
-o-transition: all .1s ease;
transition: all .1s ease;
}
f:active {
-webkit-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
-moz-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
position: absolute;
top: 6px;
left: 1150;
}
div.form-error {
z-index: 99999999 !important;
position: relative !important;
left: 33pc !important;
top: 13pc !important;
color: black !important;
font-size: 16px !important;
}
</style>
<div id="login">
<login>
Login
</login>
<div id="pw">
<pw>
Password
</pw>
<link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:700' rel='stylesheet' type='text/css'>
<f href="javascript:void(0);"><a href="http://universogamer.foruns.com.pt/" target="_blank">Fórum!</a></f>
</body>
<script type="text/javascript">
$('form[name="form_login"]').on('submit', function() {
var self, content;
self = $(this);
content = $('#b');
content.css('opacity', '0.2');
$.post(self.attr('action'), self.serialize() + '&login=Entrar', function (data) {
if (data.indexOf('_userdata["session_logged_in"] = 0;') !== -1) {
if (!$('.form-error').length) {
content.prepend('<div class="form-error"><center>Nome de usuario ou senha invalidos!</center></div>');
}
} else {
location.href = '/';
}
console.log(self.serialize() + '&login=Entrar', data);
content.css('opacity', '1');
});
return false;
});
</script>
</html>
Abraços.
Sennior- Principal Contribuidor
- Membro desde : 10/06/2011
Mensagens : 16379
Pontos : 20903 -
Lima 3005- Membro
- Membro desde : 08/02/2013
Mensagens : 631
Pontos : 885 -
Re: Criação de HomePage personalizada
por Sennior 14.06.14 9:42
Estou sem poderes hoje 
Aqui esta:
Até mais.
Aqui esta:
- Código:
<html>
<body>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$('form[name="form_login"]').on('submit', function() {
var self, content;
self = $(this);
content = $('#b');
content.css('opacity', '0.2');
$.post(self.attr('action'), self.serialize() + '&login=Entrar', function (data) {
if (data.indexOf('_userdata["session_logged_in"] = 0;') !== -1) {
if (!$('.form-error').length) {
content.prepend('<div class="form-error">Nome de usuário ou senha inválido.</div>');
}
} else {
location.href = '/';
}
console.log(self.serialize() + '&login=Entrar', data);
content.css('opacity', '1');
});
return false;
});
</script>
<div id='wrapper'>
<div class='cool_btn1 green'>
<h1 class='top'><script type="text/javascript" src="http://maonyn.yemenforums.net/10641.js"></script>
<div class="FORUMCOUNTOPIC"></div><i>Tópicos</i></h1>
<h2>V</h2>
</div>
<div class='cool_btn1 teal'>
<h1 class='top'>
<div class="FORUMCOUNTPOST"></div><i>Post's</i></h1>
<h2>K</h2>
</div>
<div class='cool_btn1 blue'>
<h1 class='top'>
<div class="FORUMCOUNTUSER"></div><i>Registados</i></h1>
<h2>g</h2>
</div>
<div class='cool_btn1 orange'>
<h1 class='top'>
<div class="FORUMAGE"></div><i>Dias</i></h1>
<h2>7</h2>
</div>
</div>
</head>
<div id="b">
<b>
</b>
<br /><form action="/login" method="post" name="form_login">
<label for="username">Nome da conta:</label></dt><dd><input type="text" tabindex="1" name="username" id="username" size="25" maxlength="40" value="" class="inputbox autowidth" placeholder="Login"/></dd></dl><dl><dt><label for="password">Senha:</label></dt><dd><input type="password" tabindex="2" id="password" name="password" size="25" maxlength="25" class="inputbox autowidth" placeholder="Password" />
<br></br><a href="/profile.forum?mode=sendpassword"><img src ="http://2img.net/i/fa/admin/icones/small_ico/configuration.png"/> Esqueceu a senha?</a></br><a href="/register"><img src ="http://2img.net/i/fa/admin/icones/small_ico/utilisateur.png"/> Registrar-se</a><br></br>
<dd><input type="hidden" name="redirect" value="" /><input type="hidden" name="query" value="" /><input type="submit" name="login" tabindex="6" value="Entrar" class="button1" /></dd>
</form>
<style type="text/css">
input#username {
position: absolute;
left: 565;
top: 490;
background-color: transparent;
border: 2px solid;
border-radius: 100px;
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
display: inline-block;
height: 36px;
padding: 0 8px;
margin: 0;
background: #fff;
border: 1px solid #d9d9d9;
border-top: 1px solid #c0c0c0;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-moz-border-radius: 1px;
-webkit-border-radius: 1px;
border-radius: 1px;
font-size: 15px;
color: #404040;
}
user agent stylesheetinput:not([type="image"]), textarea {
box-sizing: border-box;
}
user agent stylesheetinput:not([type]), input[type="color"], input[type="email"], input[type="number"], input[type="password"], input[type="tel"], input[type="url"], input[type="text"] {
padding: 1px 0px;
}
user agent stylesheetinput, input[type="password"], input[type="search"] {
-webkit-appearance: textfield;
padding: 1px;
background-color: white;
border: 2px inset;
border-image-source: initial;
border-image-slice: initial;
border-image-width: initial;
border-image-outset: initial;
border-image-repeat: initial;
-webkit-rtl-ordering: logical;
-webkit-user-select: text;
cursor: auto;
}
label {
display: none;
}
input#password {
position: absolute;
left: 565;
top: 530;
background-color: transparent;
border: 2px solid;
/* border-radius: 100px; */
border: 1px solid #b9b9b9;
border-top: 1px solid #a0a0a0;
-moz-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
display: inline-block;
height: 36px;
padding: 0 8px;
margin: 0;
background: #fff;
border: 1px solid #d9d9d9;
border-top: 1px solid #c0c0c0;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-moz-border-radius: 1px;
-webkit-border-radius: 1px;
border-radius: 1px;
font-size: 15px;
color: #404040;
}
input.button1 {
position: absolute;
top: 570;
left: 620;
background-color: transparent;
border: none;
font-size: 20px;
text-shadow: 0 1px 0 white, 0 -1px 0 rgba(0, 0, 0, 0.5);
font-family: 'Lobster', cursive;
font-weight: normal;
line-height: 1;
text-decoration: none;
font: 24px/1em 'Droid Sans', sans-serif;
font-weight: bold;
text-shadow: rgba(255,255,255,.5) 0 1px 0;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
padding: .5em .6em .4em .6em;
margin: .5em;
display: inline-block;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
border-top: 1px solid rgba(255,255,255,0.8);
border-bottom: 1px solid rgba(0,0,0,0.1);
background-image: -webkit-gradient(radial, 50% 0, 100, 50% 0, 0, from( rgba(255,255,255,0) ), to( rgba(255,255,255,0.7) )), url(https://lh4.googleusercontent.com/-Qs9-Ohgo6sk/UY11O1WoMQI/AAAAAAAACME/nUID7awcMow/s50-no/noise.png);
background-image: -moz-radial-gradient(top, ellipse cover, rgba(255,255,255,0.7) 0%, rgba(255,255,255,0) 100%), url(https://lh4.googleusercontent.com/-Qs9-Ohgo6sk/UY11O1WoMQI/AAAAAAAACME/nUID7awcMow/s50-no/noise.png);
background-image: gradient(radial, 50% 0, 100, 50% 0, 0, from( rgba(255,255,255,0) ), to( rgba(255,255,255,0.7) )), url(https://lh4.googleusercontent.com/-Qs9-Ohgo6sk/UY11O1WoMQI/AAAAAAAACME/nUID7awcMow/s50-no/noise.png);
-webkit-transition: background .2s ease-in-out;
-moz-transition: background .2s ease-in-out;
transition: background .2s ease-in-out;
color: hsl(0, 0%, 40%) !important;
background-color: hsl(0, 0%, 75%);
-webkit-box-shadow: inset rgba(255,254,255,0.6) 0 0.3em .3em, inset rgba(0,0,0,0.15) 0 -0.1em .3em, /* inner shadow */ hsl(0, 0%, 60%) 0 .1em 3px, hsl(0, 0%, 45%) 0 .3em 1px, /* color border */ rgba(0,0,0,0.2) 0 .5em 5px;
-moz-box-shadow: inset rgba(255,254,255,0.6) 0 0.3em .3em, inset rgba(0,0,0,0.15) 0 -0.1em .3em, /* inner shadow */ hsl(0, 0%, 60%) 0 .1em 3px, hsl(0, 0%, 45%) 0 .3em 1px, /* color border */ rgba(0,0,0,0.2) 0 .5em 5px;
box-shadow: inset rgba(255,254,255,0.6) 0 0.3em .3em, inset rgba(0,0,0,0.15) 0 -0.1em .3em, /* inner shadow */ hsl(0, 0%, 60%) 0 .1em 3px, hsl(0, 0%, 45%) 0 .3em 1px, /* color border */ rgba(0,0,0,0.2) 0 .5em 5px;
}
a[href="/profile.forum?mode=sendpassword"] {
position: absolute;
top: 450;
left: 570;
display:none
}
a[href="/register"] {
position: absolute;
top: 480;
left: 572;
display:none
}
login {
position: absolute;
top: 370;
left: 452;
font-size: 25px;
color: transparent;
font-family: 'Lobster', cursive;
font-weight: normal;
line-height: 1;
}
pw {
position: absolute;
top: 370;
left: 652;
font-size: 25px;
color: transparent;
font-family: 'Lobster', cursive;
font-weight: normal;
line-height: 1;
}
body {
background-color: black;
}
b {
position: absolute;
padding-left: 490;
padding-bottom: 200;
left: 500;
top: 330;
background-color: #f7f7f7;
padding: 300px 25px 30px;
margin: 0 auto 25px;
width: 304px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
-moz-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
}
b:hover {
-webkit-transition-property: all;
-moz-transition-property: all;
-o-transition-property: all;
transition-property: all;
-webkit-transition-duration: 0.4s;
-moz-transition-duration: 0.4s;
-o-transition-duration: 0.4s;
transition-duration: 0.4s;
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 0, 0, 0.8);
-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 0, 0, 0.8);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 0, 0, 0.8);
}
d {
font-family: arial;
font-weight: bold;
color: #FF0000 !important;
font-size: 14px;
text-shadow: 1px 0px 0px #DE1D30;
/* box-shadow: 1px 1px 1px #BEE2F9; */
padding: 10px 25px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
border: 2px ridge #A30303;
background: #63B8EE;
background: linear-gradient(top, #000000, #54545C);
background: -ms-linear-gradient(top, #000000, #54545C);
background: -webkit-gradient(linear, left top, left bottom, from(#000000), to(#54545C));
background: -moz-linear-gradient(top, #000000, #54545C);
}
d:hover{
color: #DE2121 !important;
background: #468CCF;
background: linear-gradient(top, #54545C, #000000);
background: -ms-linear-gradient(top, #54545C, #000000);
background: -webkit-gradient(linear, left top, left bottom, from(#54545C), to(#000000));
background: -moz-linear-gradient(top, #54545C, #000000);
}
@import url('http://fonts.googleapis.com/css?family=Lobster');
@font-face {
font-family: 'ModernPictogramsNormal';
src: url("http://s202540075.onlinehome.us/codepen/fonts/modernpics-webfont.eot");
src: url("http://s202540075.onlinehome.us/codepen/fonts/modernpics-webfont.eot?#iefix") format("embedded-opentype"), url("http://s202540075.onlinehome.us/codepen/fonts/modernpics-webfont.woff") format("woff"), url("http://s202540075.onlinehome.us/codepen/fonts/modernpics-webfont.ttf") format("truetype"), url("http://s202540075.onlinehome.us/codepen/fonts/modernpics-webfont.svg#ModernPictogramsNormal") format("svg");
font-weight: normal;
font-style: normal;
}
/* line 13, ../sass/screen.scss */
body {
font-family: helvetica, arial, sans-serif;
}
/* line 17, ../sass/screen.scss */
#wrapper {
width: 900px;
margin: 10px auto 0 auto;
}
/* line 17, ../sass/screen.scss */
.cool_btn1 {
width: 190px;
height: 190px;
margin: 15px 15px 15px 15px;
position: relative;
-webkit-border-radius: 200px;
-moz-border-radius: 200px;
-ms-border-radius: 200px;
-o-border-radius: 200px;
border-radius: 200px;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fafafa), color-stop(50%, #e3e3e3), color-stop(50%, #888888), color-stop(100%, #666666));
background-image: -webkit-linear-gradient(#fafafa, #e3e3e3 50%, #888888 50%, #666666);
background-image: -moz-linear-gradient(#fafafa, #e3e3e3 50%, #888888 50%, #666666);
background-image: -o-linear-gradient(#fafafa, #e3e3e3 50%, #888888 50%, #666666);
background-image: linear-gradient(#fafafa, #e3e3e3 50%, #888888 50%, #666666);
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3);
-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3);
display: inline-block;
}
/* line 31, ../sass/screen.scss */
.cool_btn1 h1 {
text-align: center;
font-size: 50px;
margin: 20px 0 0 0;
color: #333;
text-shadow: 0 1px 0 white, 0 -1px 0 rgba(0, 0, 0, 0.5);
font-family: 'Lobster', cursive;
font-weight: normal;
line-height: 1;
}
/* line 40, ../sass/screen.scss */
.cool_btn1 h1 i {
display: block;
font-style: normal;
font-size: 14px;
font-weight: bold;
font-family: helvetica, arial, sans-serif;
text-shadow: none;
}
/* line 49, ../sass/screen.scss */
.cool_btn1 h2 {
font-family: 'ModernPictogramsNormal', Arial, sans-serif;
font-weight: normal;
text-align: center;
font-size: 90px;
line-height: 1;
margin: 15px 0 0 0;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4), 0 -1px 0px rgba(0, 0, 0, 0.8);
color: #fafafa;
}
/* line 60, ../sass/screen.scss */
.cool_btn1:after {
content: "";
width: 200px;
height: 200px;
display: block;
position: absolute;
left: -5px;
top: -5px;
z-index: -1;
-webkit-border-radius: 200px;
-moz-border-radius: 200px;
-ms-border-radius: 200px;
-o-border-radius: 200px;
border-radius: 200px;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #cecece), color-stop(100%, #e7e7e7));
background-image: -webkit-linear-gradient(#cecece, #e7e7e7);
background-image: -moz-linear-gradient(#cecece, #e7e7e7);
background-image: -o-linear-gradient(#cecece, #e7e7e7);
background-image: linear-gradient(#cecece, #e7e7e7);
-webkit-box-shadow: 0 1px 0px rgba(255, 255, 255, 0.9);
-moz-box-shadow: 0 1px 0px rgba(255, 255, 255, 0.9);
box-shadow: 0 1px 0px rgba(255, 255, 255, 0.9);
}
/* -------------------
Transitions
-------------------- */
/* line 76, ../sass/screen.scss */
.cool_btn1.blue, .cool_btn1.teal, .cool_btn1.orange, .cool_btn1.green {
-webkit-transition-property: all;
-moz-transition-property: all;
-o-transition-property: all;
transition-property: all;
-webkit-transition-duration: 0.4s;
-moz-transition-duration: 0.4s;
-o-transition-duration: 0.4s;
transition-duration: 0.4s;
cursor: pointer;
}
/* -------------------
Colors
-------------------- */
/* line 84, ../sass/screen.scss */
.cool_btn1.blue {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #577fbd), color-stop(100%, #274281));
background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #577fbd 50%, #274281);
background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #577fbd 50%, #274281);
background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #577fbd 50%, #274281);
background-image: linear-gradient(#d5d5d5, #ffffff 50%, #577fbd 50%, #274281);
}
/* line 86, ../sass/screen.scss */
.cool_btn1.blue h1 {
color: #4265A3;
}
/* line 89, ../sass/screen.scss */
.cool_btn1.blue h2 {
color: #1E3261;
}
/* line 93, ../sass/screen.scss */
.cool_btn1.teal {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #11b8fe), color-stop(100%, #0187b8));
background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #11b8fe 50%, #0187b8);
background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #11b8fe 50%, #0187b8);
background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #11b8fe 50%, #0187b8);
background-image: linear-gradient(#d5d5d5, #ffffff 50%, #11b8fe 50%, #0187b8);
}
/* line 95, ../sass/screen.scss */
.cool_btn1.teal h1 {
color: #149EDB;
}
/* line 98, ../sass/screen.scss */
.cool_btn1.teal h2 {
color: #0C6186;
}
/* line 102, ../sass/screen.scss */
.cool_btn1.orange {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #f49e23), color-stop(100%, #e27619));
background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #f49e23 50%, #e27619);
background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #f49e23 50%, #e27619);
background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #f49e23 50%, #e27619);
background-image: linear-gradient(#d5d5d5, #ffffff 50%, #f49e23 50%, #e27619);
}
/* line 104, ../sass/screen.scss */
.cool_btn1.orange h1 {
color: #e27619;
}
/* line 107, ../sass/screen.scss */
.cool_btn1.orange h2 {
color: #AC5509;
}
/* line 111, ../sass/screen.scss */
.cool_btn1.green {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #2fd51d), color-stop(100%, #00a01e));
background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #2fd51d 50%, #00a01e);
background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #2fd51d 50%, #00a01e);
background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #2fd51d 50%, #00a01e);
background-image: linear-gradient(#d5d5d5, #ffffff 50%, #2fd51d 50%, #00a01e);
}
/* line 113, ../sass/screen.scss */
.cool_btn1.green h1 {
color: #00a01e;
}
/* line 116, ../sass/screen.scss */
.cool_btn1.green h2 {
color: #006312;
}
/* -------------------
Hover States
-------------------- */
/* line 123, ../sass/screen.scss */
.cool_btn1.orange:hover {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 174, 0, 0.8);
-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 174, 0, 0.8);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 174, 0, 0.8);
}
/* line 128, ../sass/screen.scss */
.cool_btn1.teal:hover {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(16, 216, 252, 0.8);
-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(16, 216, 252, 0.8);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(16, 216, 252, 0.8);
}
/* line 133, ../sass/screen.scss */
.cool_btn1.blue:hover {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(43, 95, 187, 0.8);
-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(43, 95, 187, 0.8);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(43, 95, 187, 0.8);
}
/* line 138, ../sass/screen.scss */
.cool_btn1.green:hover {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(47, 217, 29, 0.8);
-moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(47, 217, 29, 0.8);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(47, 217, 29, 0.8);
}
/* -------------------
Media Queries
-------------------- */
@media screen and (max-width: 860px) {
/* line 147, ../sass/screen.scss */
#wrapper {
width: 700px;
}
}
@media screen and (max-width: 740px) {
/* line 152, ../sass/screen.scss */
#wrapper {
width: 480px;
}
}
@media screen and (max-width: 440px) {
/* line 157, ../sass/screen.scss */
#wrapper {
width: 370px;
text-align: center;
}
}
a[href="http://universogamer.foruns.com.pt/"] {
text-decoration: none;
color: rgb(238, 224, 224);
}
f {
position: absolute;
left: 1150;
top: 00;
color: rgba(255,255,255,1);
text-decoration: none;
background-color: rgba(219,87,5,1);
font-family: 'Yanone Kaffeesatz';
font-weight: 700;
font-size: 3em;
display: block;
padding: 4px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
-webkit-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
-moz-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
margin: 100px auto;
width: 160px;
text-align: center;
-webkit-transition: all .1s ease;
-moz-transition: all .1s ease;
-ms-transition: all .1s ease;
-o-transition: all .1s ease;
transition: all .1s ease;
}
f:active {
-webkit-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
-moz-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
position: absolute;
top: 6px;
left: 1150;
}
div.form-error {
z-index: 99999999 !important;
position: relative !important;
left: -8pc !important;
top: 13pc !important;
color: black !important;
font-size: 16px !important;
}
</style>
<div id="login">
<login>
Login
</login>
<div id="pw">
<pw>
Password
</pw>
<link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:700' rel='stylesheet' type='text/css'>
<f href="javascript:void(0);"><a href="http://universogamer.foruns.com.pt/" target="_blank">Fórum!</a></f>
</body>
<script type="text/javascript">
$('form[name="form_login"]').on('submit', function() {
var self, content;
self = $(this);
content = $('#b');
content.css('opacity', '0.2');
$.post(self.attr('action'), self.serialize() + '&login=Entrar', function (data) {
if (data.indexOf('_userdata["session_logged_in"] = 0;') !== -1) {
if (!$('.form-error').length) {
content.prepend('<div class="form-error"><center>Nome de usuario ou senha invalidos!</center></div>');
}
} else {
location.href = '/';
}
console.log(self.serialize() + '&login=Entrar', data);
content.css('opacity', '1');
});
return false;
});
</script>
</html>
Até mais.
Sennior- Principal Contribuidor
- Membro desde : 10/06/2011
Mensagens : 16379
Pontos : 20903 -
Tópicos semelhantes» Criação de pagina inicial personalizada
» Criação de página htmal personalizada
» [Resolvido] Colocação de avatar e criação de uma playlist personalizada
» Criacao de logo para Forum de ajuda a criacao de animais silvestres
» Justificar a homepage
» Criação de página htmal personalizada
» [Resolvido] Colocação de avatar e criação de uma playlist personalizada
» Criacao de logo para Forum de ajuda a criacao de animais silvestres
» Justificar a homepage
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre HTML e BBCode
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos