This is a read-only archive of the old Scratch 1.x Forums.
Try searching the current Scratch discussion forums.

Pages: 1 2 3 4

Topic closed

#76 2010-12-19 16:17:57

ProgrammingFreak
Scratcher
Registered: 2010-09-04
Posts: 1000+

Re: Want to make a Social Network?

Code:

index.php:

<html>
<head>
<link href="iconnect.css" rel="stylesheet" type="text/css">
<title>iConnect Social</title>
</head>
<body>
<tr>
<td name= "logo">
<img src="icon.gif" alt="The Logo">
</td>
<td name="navbar">
    <div align="center" width=800>
<ul id="nav" class="clearme">

      </li>
                                    <li id="active" ><a href="/">home</a></li>
                                    <li ><a href="support.php">support</a></li>
                                    <li ><a href="/about.php">about</a></li>
            </ul>

</td>
</div>
<td>
<h1><br>Welcome to Our Site</h1>
<a href="signup.php"><img src="adconn.gif" alt="signup today!"></a>

</td>
</tr>
</body>
</html>

Code:

/*-------------Standard Reusable Classes-----------*/ 

.standard_floating_div {
    width: 90%;
    float: left;
    margin-top: 5px;
}
.standard_floating_div_b{
    width: 90%;
    float: left;
    margin-top: 5px;
    margin-bottom: 10px;
}
.standard_menu {
    float: left;
    width: 100%;
    margin-top: 5px;
    padding-left: 2px;
    margin-bottom: 10px;
}
/*--------------------errors-----------------------*/
.std_error {
    text-decoration: none;
    font-weight: bold;
    font-size: small;
    color: #CC3300;
}
.login_error {
    float: left;
    height: 40px;
    width: 90%;
    font-weight: bold;
    font-size: small;
    color: #CC3300;
}
.login_content {
    float: left;
    width: 90%;
}
.login_header {
    float: left;
    width: 90%;
}
.login_row {
    float: left;
    width: 90%;
}
.login_submit {
    margin-top: 10px;
    float: left;
    width: 90%;
    margin-left: 10px;
}

/*--------------------standard menus------------------*/
.standard_menu {
    float: left;
    width: 100%;
    margin-top: 5px;
    padding-left: 2px;
    margin-bottom: 20px;
}
/*-------------------- basic---------------------*/ 
body {
    background-color: #FFFFFF;
    color: #333333;
    font-family: "Trebuchet MS", "Luxi Sans",Verdana, Arial, Helvetica, sans-serif;
    font-size: 13px;
    direction:ltr;
}

td, select, input, select {
    font: normal 1em "Trebuchet MS",  "Luxi Sans", Verdana,Helvetica, Arial, sans-serif;
}

.hidden
        {
        position:absolute;
        left:0px;
        top:-500px;
        width:1px;
        height:1px;
        overflow:hidden;
        }


a, a:link{
    color: #2A54AA;
    outline: none;
}

a:visited{
    color: #22468C;
}

a:hover, a:visited:hover{
    color: #3060C1;
}

a:active{
    color: #FF9933;
}

a img{
    border: 0;
}

p{
    margin: 0;
    padding: 6px 0;
}

td, th{
    margin: 0;
    padding: 0;
    vertical-align: top;
}

.clearme:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
}

.right{
    text-align: right;
}

.asterisk{
font-weight:bold;
text-decoration:none;
} 

/*-------------------- headers---------------------*/ 
h1{
    color: #111111;
    font-size: 1.3em;
    font-weight: bold;
    line-height: 1.5em;
    margin: 0;
    padding: 0;
    text-align: left;
}

h2{
    color: #222222;
    font-size: 20px;
    font-weight: bold;
    line-height: 1.3em;
    margin: 6px 0 0 0;
    padding: 0px;
}

h3{
    color: #333333;
    font-size: 18px;
    font-weight: normal;
    margin: 5px 0 5px 0;
    padding: 0;
}

h4{
    font-size: 16px;
    margin: 0;
    padding: 0 0 5px 0px;
}

h5{
    font-size: 14px;
    margin: 0;
    padding: 0 0 5px 0;
}

h6{
    font-size: 1em;
    margin: 0 10px;
    padding: 0;
}

/*-------------------- forms---------------------*/ 
form{
    margin: 0;
    padding: 0;
}

input, textarea{
    background-color: #F9F9F9;
    border: 1px solid #333333;
    color: #666666;
    padding: 1px 2px;
    vertical-align: baseline;
}
 input [type="checkbox"] {
border:0px !important;
padding:0 !important;
}
 .check {
border:0px !important;
padding:0 !important;
}

input:focus, textarea:focus{
    background-color: #FEFEFE;
    border: 1px solid #2A54AA;
    color: #333333;
}

input.button{
    background-color: #4070CF;
    background-image: url(../img/bg_button.png);
    background-repeat: repeat-x;
    border: 1px solid #22468C;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: bold;
    padding: 0 8px;
    text-decoration: none;
}

.button{
    background-color: #4070CF;
    background-image: url(../img/bg_button.png);
    background-repeat: repeat-x;
    border: 1px solid #22468C;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: bold;
    padding: 0 8px;
    text-decoration: none;
}

.themeaction {
    float: left;
    width: 100%;
    margin: 4px 0px;
}

.button2 {
    background-color: #4070CF;
    background-image: url(../img/bg_button.png);
    background-repeat: repeat-x;
    border: 1px solid #22468C;
    color: #FFFFFF;
    link: #FFFFFF;
    font-size: 14px;
    font-weight: bold;
    padding: 2px 5px;
    text-decoration: none;
}
.button2_selected {
    background-color: #4070CF;
    background-image: url(../img/bg_button.png);
    background-repeat: repeat-x;
    border: 1px solid #22468C;
    color: #FFC56C;
    link: #FFC56C;
    font-size: 14px;
    font-weight: bold;
    padding: 2px 5px;
    text-decoration: none;
}
label{
    background-color: #F9F9F9;
    display: block;
    float: left;
    font-weight: bold;
    padding: 4px;
    width: 140px;
}

form p{
    clear: left;
}

fieldset{
    padding: 10px;
}

legend{
    font-size: 16px;
    font-weight: bold;
}
.inputgroup{
    margin-left: 155px;
}

/*-------------------- layout---------------------*/ 
#container {
    background-color: #FFFFFF;
    margin: 0px auto;
    width: 780px;
}

/* only IE mac will see this */
* html>body #container{
    width: 800px;
}

#main {
    float: left;
    margin-right: 10px;
    margin-top: 10px;
    width: 540px;
}

.fullcontent{
    clear: both;
    padding: 10px 20px;
    margin:10px 0;
    background-image: url(../img/bg_fullwidth.png);
    background-repeat: no-repeat;
}

#header {
    padding: 0px;
}

#sidebar {
    float: right;
    margin-top: 10px;
    width: 230px;
}

#footer {
    background-image: url(../img/bg_footer.png);
    background-repeat: no-repeat;
    clear: both;
    font-size: 12px;
    line-height: 30px;
    padding: 0 10px;
    text-align: center;
    width: 100%;
}

#ipaddress {
    font-size: 8px;
    font-color: grey;
}

#info{
    color: #666666;
    font-size: 12px;
    line-height: 1.2em;
    padding: 10px 20px;
}

/*-------------------- header---------------------*/ 
#header #logo{
    float: left;
    width: 230px;
}

#header h1{
    float: left;
    margin: 0;
    padding: 0;
}

#header h2{
    color: #3060C1;
    font-size: 14px;
    margin: 0;
    padding: 0;
    text-align: center;
}

#header h1 a{
    background-image: url(../img/gr_logo_scratchr.png);
    background-repeat: no-repeat;
    float: left;
    height: 60px;
    margin: 0;
    padding: 0;
    text-indent: -9999px;
    width: 230px;
}

#userbar{
    background-image: url(../img/bg_userbar.png);
    background-repeat: no-repeat;
    float: left;
    font-size: 15px;
    height: 40px;
    line-height: 40px;
    margin: 0 10px;
    padding: 0 10px;
    width: 280px;
}

#userbar a{
    font-weight: bold;
}

#searchbar{
    background-image: url(../img/bg_searchbar.png);
    background-repeat: no-repeat;
    float: left;
    height: 40px;
    line-height: 40px;
    padding: 0 10px;
    width: 210px;
}

#searchbar input{
    max-width: 124px;
}

#logincontainer{
    width:770px;
    text-align: center;
    background-image: url(../img/bg_footer.png);
    background-repeat: no-repeat;
    background-position: bottom;
    margin-bottom: 0px;
    padding: 10px 5px 5px 5px;
    position: relative;
}

#notificationcontainer{
    width:770px;
    text-align: center;
    background-image: url(../img/bg_footer.png);
    background-repeat: no-repeat;
    background-position: bottom;
    margin-bottom: 0px;
    padding: 15px 5px 5px 5px;
    position: relative;
}

#announcement{
    float: left;
    width:770px;
    text-align: center;
    background-image: url(../img/bg_footer.png);
    background-repeat: no-repeat;
    background-position: bottom;
    margin-bottom: 0px;
    padding: 10px 5px 5px 5px;
    position: relative;
}

/*-------------------- nav---------------------*/ 
#nav {
    background-color: #790800;
    background-image: url(../img/bg_nav.png);
    background-repeat: no-repeat;
    float: right;
    margin: 0 0 10px 0;
    padding: 0 5px;
    width: 530px;
}

#nav li {
    float: left;
    list-style-type: none;
}

#nav a{
    border-right: 1px solid #22468C;
    color: #E7EBF7;
    float: left;
    font-size: 14px;
    font-weight: bold;
    line-height: 26px;
    padding: 2px 6px;
    text-decoration: none;
}

#nav a:hover{
    color: white;
}

#nav #langselect{
    float: right;
    margin-top: 2px;
}

#nav select{
    font-size: 12px;
}

#nav #active a{
    color: #FFC56C;
}
http://i.imgur.com/QizuVQI.png                      Check out my latest video to find out youtubers that I like!

Offline

 

#77 2010-12-19 16:41:41

blazerv82
Scratcher
Registered: 2008-03-20
Posts: 1000+

Re: Want to make a Social Network?

iConnect Hompage

Hopefully this is it. Let me know if you need anything else.

Pretty Hate Machine, Broken, Closer To God, The Downward Spiral, Further Down The Spiral, The Perfect Drug, The Fragile, And All That Could Have Been, With Teeth, Year Zero, Y34RZ3R0R3M1X3D, Ghosts I-IV, The Slip, Pretty Hate Machine 2010

Offline

 

#78 2010-12-19 16:56:45

ScratchReallyROCKS
Scratcher
Registered: 2009-04-22
Posts: 1000+

Re: Want to make a Social Network?

ProgrammingFreak wrote:

Code:

index.php:

<html>
<head>
<link href="iconnect.css" rel="stylesheet" type="text/css">
<title>iConnect Social</title>
</head>
<body>
<tr>
<td name= "logo">
<img src="icon.gif" alt="The Logo">
</td>
<td name="navbar">
    <div align="center" width=800>
<ul id="nav" class="clearme">

      </li>
                                    <li id="active" ><a href="/">home</a></li>
                                    <li ><a href="support.php">support</a></li>
                                    <li ><a href="/about.php">about</a></li>
            </ul>

</td>
</div>
<td>
<h1><br>Welcome to Our Site</h1>
<a href="signup.php"><img src="adconn.gif" alt="signup today!"></a>

</td>
</tr>
</body>
</html>

Code:

/*-------------Standard Reusable Classes-----------*/ 

.standard_floating_div {
    width: 90%;
    float: left;
    margin-top: 5px;
}
.standard_floating_div_b{
    width: 90%;
    float: left;
    margin-top: 5px;
    margin-bottom: 10px;
}
.standard_menu {
    float: left;
    width: 100%;
    margin-top: 5px;
    padding-left: 2px;
    margin-bottom: 10px;
}
/*--------------------errors-----------------------*/
.std_error {
    text-decoration: none;
    font-weight: bold;
    font-size: small;
    color: #CC3300;
}
.login_error {
    float: left;
    height: 40px;
    width: 90%;
    font-weight: bold;
    font-size: small;
    color: #CC3300;
}
.login_content {
    float: left;
    width: 90%;
}
.login_header {
    float: left;
    width: 90%;
}
.login_row {
    float: left;
    width: 90%;
}
.login_submit {
    margin-top: 10px;
    float: left;
    width: 90%;
    margin-left: 10px;
}

/*--------------------standard menus------------------*/
.standard_menu {
    float: left;
    width: 100%;
    margin-top: 5px;
    padding-left: 2px;
    margin-bottom: 20px;
}
/*-------------------- basic---------------------*/ 
body {
    background-color: #FFFFFF;
    color: #333333;
    font-family: "Trebuchet MS", "Luxi Sans",Verdana, Arial, Helvetica, sans-serif;
    font-size: 13px;
    direction:ltr;
}

td, select, input, select {
    font: normal 1em "Trebuchet MS",  "Luxi Sans", Verdana,Helvetica, Arial, sans-serif;
}

.hidden
        {
        position:absolute;
        left:0px;
        top:-500px;
        width:1px;
        height:1px;
        overflow:hidden;
        }


a, a:link{
    color: #2A54AA;
    outline: none;
}

a:visited{
    color: #22468C;
}

a:hover, a:visited:hover{
    color: #3060C1;
}

a:active{
    color: #FF9933;
}

a img{
    border: 0;
}

p{
    margin: 0;
    padding: 6px 0;
}

td, th{
    margin: 0;
    padding: 0;
    vertical-align: top;
}

.clearme:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
}

.right{
    text-align: right;
}

.asterisk{
font-weight:bold;
text-decoration:none;
} 

/*-------------------- headers---------------------*/ 
h1{
    color: #111111;
    font-size: 1.3em;
    font-weight: bold;
    line-height: 1.5em;
    margin: 0;
    padding: 0;
    text-align: left;
}

h2{
    color: #222222;
    font-size: 20px;
    font-weight: bold;
    line-height: 1.3em;
    margin: 6px 0 0 0;
    padding: 0px;
}

h3{
    color: #333333;
    font-size: 18px;
    font-weight: normal;
    margin: 5px 0 5px 0;
    padding: 0;
}

h4{
    font-size: 16px;
    margin: 0;
    padding: 0 0 5px 0px;
}

h5{
    font-size: 14px;
    margin: 0;
    padding: 0 0 5px 0;
}

h6{
    font-size: 1em;
    margin: 0 10px;
    padding: 0;
}

/*-------------------- forms---------------------*/ 
form{
    margin: 0;
    padding: 0;
}

input, textarea{
    background-color: #F9F9F9;
    border: 1px solid #333333;
    color: #666666;
    padding: 1px 2px;
    vertical-align: baseline;
}
 input [type="checkbox"] {
border:0px !important;
padding:0 !important;
}
 .check {
border:0px !important;
padding:0 !important;
}

input:focus, textarea:focus{
    background-color: #FEFEFE;
    border: 1px solid #2A54AA;
    color: #333333;
}

input.button{
    background-color: #4070CF;
    background-image: url(../img/bg_button.png);
    background-repeat: repeat-x;
    border: 1px solid #22468C;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: bold;
    padding: 0 8px;
    text-decoration: none;
}

.button{
    background-color: #4070CF;
    background-image: url(../img/bg_button.png);
    background-repeat: repeat-x;
    border: 1px solid #22468C;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: bold;
    padding: 0 8px;
    text-decoration: none;
}

.themeaction {
    float: left;
    width: 100%;
    margin: 4px 0px;
}

.button2 {
    background-color: #4070CF;
    background-image: url(../img/bg_button.png);
    background-repeat: repeat-x;
    border: 1px solid #22468C;
    color: #FFFFFF;
    link: #FFFFFF;
    font-size: 14px;
    font-weight: bold;
    padding: 2px 5px;
    text-decoration: none;
}
.button2_selected {
    background-color: #4070CF;
    background-image: url(../img/bg_button.png);
    background-repeat: repeat-x;
    border: 1px solid #22468C;
    color: #FFC56C;
    link: #FFC56C;
    font-size: 14px;
    font-weight: bold;
    padding: 2px 5px;
    text-decoration: none;
}
label{
    background-color: #F9F9F9;
    display: block;
    float: left;
    font-weight: bold;
    padding: 4px;
    width: 140px;
}

form p{
    clear: left;
}

fieldset{
    padding: 10px;
}

legend{
    font-size: 16px;
    font-weight: bold;
}
.inputgroup{
    margin-left: 155px;
}

/*-------------------- layout---------------------*/ 
#container {
    background-color: #FFFFFF;
    margin: 0px auto;
    width: 780px;
}

/* only IE mac will see this */
* html>body #container{
    width: 800px;
}

#main {
    float: left;
    margin-right: 10px;
    margin-top: 10px;
    width: 540px;
}

.fullcontent{
    clear: both;
    padding: 10px 20px;
    margin:10px 0;
    background-image: url(../img/bg_fullwidth.png);
    background-repeat: no-repeat;
}

#header {
    padding: 0px;
}

#sidebar {
    float: right;
    margin-top: 10px;
    width: 230px;
}

#footer {
    background-image: url(../img/bg_footer.png);
    background-repeat: no-repeat;
    clear: both;
    font-size: 12px;
    line-height: 30px;
    padding: 0 10px;
    text-align: center;
    width: 100%;
}

#ipaddress {
    font-size: 8px;
    font-color: grey;
}

#info{
    color: #666666;
    font-size: 12px;
    line-height: 1.2em;
    padding: 10px 20px;
}

/*-------------------- header---------------------*/ 
#header #logo{
    float: left;
    width: 230px;
}

#header h1{
    float: left;
    margin: 0;
    padding: 0;
}

#header h2{
    color: #3060C1;
    font-size: 14px;
    margin: 0;
    padding: 0;
    text-align: center;
}

#header h1 a{
    background-image: url(../img/gr_logo_scratchr.png);
    background-repeat: no-repeat;
    float: left;
    height: 60px;
    margin: 0;
    padding: 0;
    text-indent: -9999px;
    width: 230px;
}

#userbar{
    background-image: url(../img/bg_userbar.png);
    background-repeat: no-repeat;
    float: left;
    font-size: 15px;
    height: 40px;
    line-height: 40px;
    margin: 0 10px;
    padding: 0 10px;
    width: 280px;
}

#userbar a{
    font-weight: bold;
}

#searchbar{
    background-image: url(../img/bg_searchbar.png);
    background-repeat: no-repeat;
    float: left;
    height: 40px;
    line-height: 40px;
    padding: 0 10px;
    width: 210px;
}

#searchbar input{
    max-width: 124px;
}

#logincontainer{
    width:770px;
    text-align: center;
    background-image: url(../img/bg_footer.png);
    background-repeat: no-repeat;
    background-position: bottom;
    margin-bottom: 0px;
    padding: 10px 5px 5px 5px;
    position: relative;
}

#notificationcontainer{
    width:770px;
    text-align: center;
    background-image: url(../img/bg_footer.png);
    background-repeat: no-repeat;
    background-position: bottom;
    margin-bottom: 0px;
    padding: 15px 5px 5px 5px;
    position: relative;
}

#announcement{
    float: left;
    width:770px;
    text-align: center;
    background-image: url(../img/bg_footer.png);
    background-repeat: no-repeat;
    background-position: bottom;
    margin-bottom: 0px;
    padding: 10px 5px 5px 5px;
    position: relative;
}

/*-------------------- nav---------------------*/ 
#nav {
    background-color: #790800;
    background-image: url(../img/bg_nav.png);
    background-repeat: no-repeat;
    float: right;
    margin: 0 0 10px 0;
    padding: 0 5px;
    width: 530px;
}

#nav li {
    float: left;
    list-style-type: none;
}

#nav a{
    border-right: 1px solid #22468C;
    color: #E7EBF7;
    float: left;
    font-size: 14px;
    font-weight: bold;
    line-height: 26px;
    padding: 2px 6px;
    text-decoration: none;
}

#nav a:hover{
    color: white;
}

#nav #langselect{
    float: right;
    margin-top: 2px;
}

#nav select{
    font-size: 12px;
}

#nav #active a{
    color: #FFC56C;
}

yikes  that's a lot of CSS!

I could be a programmer, if I can be.

http://imageshack.us/a/img694/3806/sigmad.png

Offline

 

#79 2010-12-20 06:00:38

ProgrammingFreak
Scratcher
Registered: 2010-09-04
Posts: 1000+

Re: Want to make a Social Network?

Yeah! Oh I copied Scratchs CSS. lol

http://i.imgur.com/QizuVQI.png                      Check out my latest video to find out youtubers that I like!

Offline

 

Topic closed

Pages: 1 2 3 4

Board footer