n.kolosnaj/Globaly-CSS-Practice
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

jun 12

Browse Source
This commit is contained in:
nkolosnjaj
2024-06-12 15:26:27 +02:00
parent 28af5705ee
commit 8851ff41b4
19 changed files with 331 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
about.html
View File

@@ -52,7 +52,7 @@
</li>
</ul>
<div class="form-container">
<form class="d-flex align-items-center d-sm-flex justify-content-sm-between" role="search">
<form class="form-search d-flex align-items-center d-sm-flex justify-content-sm-between" role="search">
<input id="src-input" class="form-control rounded-0 border-0" type="search" placeholder="Search ...">
<button class="btn" type="submit" style="padding-bottom: 0px;padding-top: 0px;">
<span class="material-icons">

2
cases.html
View File

@@ -53,7 +53,7 @@
</li>
</ul>
<div class="form-container">
<form class="d-flex align-items-center d-sm-flex justify-content-sm-between" role="search">
<form class="form-search d-flex align-items-center d-sm-flex justify-content-sm-between" role="search">
<input id="src-input" class="form-control rounded-0 border-0" type="search" placeholder="Search ...">
<button class="btn" type="submit" style="padding-bottom: 0px;padding-top: 0px;">
<span class="material-icons">

2
contacts.html
View File

@@ -52,7 +52,7 @@
</li>
</ul>
<div class="form-container">
<form class="d-flex align-items-center d-sm-flex justify-content-sm-between" role="search">
<form class="form-search d-flex align-items-center d-sm-flex justify-content-sm-between" role="search">
<input id="src-input" class="form-control rounded-0 border-0" type="search" placeholder="Search ...">
<button class="btn" type="submit" style="padding-bottom: 0px;padding-top: 0px;">
<span class="material-icons">

7
index.html
View File

@@ -54,7 +54,7 @@
</li>
</ul>
<div class="form-container ">
<form class="d-flex align-items-center d-sm-flex justify-content-sm-between" role="search">
<form class="form-search d-flex align-items-center d-sm-flex justify-content-sm-between" role="search">
<input id="src-input" class="form-control rounded-0 border-0" type="search" placeholder="Search ...">
<button class="btn" type="submit" style="padding-bottom: 0px;padding-top: 0px;">
<span class="material-icons">
@@ -89,6 +89,11 @@
</ul>
</div>
<img src="assets/images/logo.webp" class="logo-img mt-3 mt-lg-0 mt-md-0" alt="">
<div class="register">
<a class="register-link" href="login.html" >Log in</a>
<a class="register-link" href="signup.html" >Sign up</a>
</div>
<!-- site navigation-->

49
login.html Normal file
View File

@@ -0,0 +1,49 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.4.1/dist/css/bootstrap.min.css"
integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.rtl.min.css"
integrity="sha384-gXt9imSW0VcJVHezoNQsP+TNrjYXoGcrqBZJpry9zJt8PCQjobwmhMGaDHTASo9N" crossorigin="anonymous">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
crossorigin="anonymous"></script>
<link rel="stylesheet" href="style/style.css">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<script src="https://kit.fontawesome.com/4bb6479073.js" crossorigin="anonymous"></script>
<title>Globaly - Full Cycle Business Management & Consulting Responsive WordPress Theme</title>
</head>
<body>
<div class="form d-flex flex-column align-items-center justify-content-center my-md-5 mb-5 mb-lg-0">
<div class="headline-card d-flex flex-column align-items-center justify-content-center mt-4">
<h2>Login</h2>
<img class="line-img" src="assets/images/line.png" alt="">
</div>
<h6>Log in to your account</h6>
<form action="php/login.php" method="post">
<div class="form-container-bot d-flex flex-column align-items-start justify-content-center">
<input class="input-text" type="text" placeholder="Email" name="email">
<input class="input-text" type="password" placeholder="Password" name="password">
</div>
<input class="view-more" type="submit" value="Login" >
</form>
<h6 style="margin-top: 100px;">Don't have an account yet? Sign Up!</h6>
<input class="view-more" type="submit" id="signup-button" value="Signup">
</div>
<script type="text/javascript">
document.getElementById("signup-button").onclick = function () {
location.href = "signup.html";
};
</script>
</body>
</html>

2
news.html
View File

@@ -53,7 +53,7 @@
</li>
</ul>
<div class="form-container">
<form class="d-flex align-items-center d-sm-flex justify-content-sm-between" role="search">
<form class="form-search d-flex align-items-center d-sm-flex justify-content-sm-between" role="search">
<input id="src-input" class="form-control rounded-0 border-0" type="search" placeholder="Search ...">
<button class="btn" type="submit" style="padding-bottom: 0px;padding-top: 0px;">
<span class="material-icons">

20
php/connect.inc.php Normal file
View File

@@ -0,0 +1,20 @@
<?php
//How to connect to MySQL
$mysql_host = 'localhost';
$mysql_user = 'example_user';
$mysql_pass = 'Kolosnjaj4321!';
$conn_error = 'Could not connect to database!';
$mysql_db = 'example_database';
$con = mysqli_connect($mysql_host, $mysql_user, $mysql_pass);
if ($con) {
if (mysqli_select_db($con, $mysql_db)) {
} else {
die($conn_error);
}
}
?>

26
php/core.inc.php Normal file
View File

@@ -0,0 +1,26 @@
<?php
ob_start();
session_start();
$current_file = $_SERVER['SCRIPT_FILENAME'];
if(isset($_SERVER['HTTP_REFERER']) && !empty($_SERVER['HTTP_REFERER'])){
$http_referer = $_SERVER['HTTP_REFERER'];
}
function loggedin(){
if (isset($_SESSION['user_id']) && !empty($_SESSION['user_id'])) {
return true;
} else {
return false;
}
}
function getuserfield($field){
global $con;
$query = "SELECT `$field` FROM `globaly_accounts` WHERE `id`= '" . $_SESSION['user_id']. "'";
if($query_run = mysqli_query($con,$query)){
$row = mysqli_fetch_assoc($query_run);
return $field = $row[$field];
}
}
?>

12
php/index.php Normal file
View File

@@ -0,0 +1,12 @@
<?php
require 'connect.inc.php';
require 'core.inc.php';
if (loggedin()) {
$name = getuserfield('name');
echo ' You are logged in '. $name.' <a href="logout.php">Log out</a><br>';
} else {
include 'login.php';
}
?>

31
php/login.php Normal file
View File

@@ -0,0 +1,31 @@
<?php
require 'connect.inc.php';
require 'core.inc.php';
if (isset($_POST['email']) && isset($_POST['password'])) {
$email = $_POST['email'];
$password = $_POST['password'];
$password_hash = md5($password);
if (!empty($email) && !empty($password)) {
$query = "SELECT `id` FROM `globaly_accounts` WHERE `email` ='" . mysqli_real_escape_string($con, $email) .
"' AND `password` = '" .mysqli_real_escape_string($con, $password_hash )."'";
if ($query_run = mysqli_query($con, $query)) {
$query_num_rows = mysqli_num_rows($query_run);
if ($query_num_rows == 0) {
echo 'invalid email/password combination';
} else if ($query_num_rows == 1) {
//treba nam $user_id
$row = mysqli_fetch_assoc($query_run);
$user_id = $row['id'];
$_SESSION['user_id'] = $user_id;
header('Location: index.php');
}
} else {
}
} else {
echo 'You must suply email or password';
}
}
?>

8
php/logout.php Normal file
View File

@@ -0,0 +1,8 @@
<?php
require 'core.inc.php';
session_destroy();
header('Location: '. '../login.html');
?>

52
php/register.php Normal file
View File

@@ -0,0 +1,52 @@
<?php
require 'connect.inc.php';
require 'core.inc.php';
if (!loggedin()) {
if (
isset($_POST['name']) && isset($_POST['email'])
&& isset($_POST['password']) && isset($_POST['password_again'])
) {
$name = $_POST['name'];
$email = $_POST['email'];
$password = $_POST['password'];
$password_again = $_POST['password_again'];
$password_hash = md5($password);
$upperCase = preg_match('/[A-Z]/', $password);
if (
!empty($name) && !empty($password) && !empty($password_again) &&
!empty($email)
) {
if (strlen($name) > 30) {
echo 'Please ahear to maxlength of fields';
} else {
if ($password != $password_again) {
echo 'Passwords do not match';
}elseif (strlen($password) < 6){
echo 'Password is weak!';
}
else {
$query = "SELECT `email` FROM `globaly_accounts` WHERE `email` ='$email'";
$query_run = mysqli_query($con, $query);
if (mysqli_num_rows($query_run) == 1) {
echo 'The email ' . $email . 'already exists';
} else {
$query = "INSERT INTO `globaly_accounts` VALUES (NULL ,'" . mysqli_real_escape_string($con, $name) .
"','" . mysqli_real_escape_string($con, $email) . "','" . mysqli_real_escape_string($con, $password_hash) . "')";
if ($query_run = mysqli_query($con, $query)) {
echo '<script>alert("You are registerd!")</script>';
header('Location: ../index.html');
} else {
echo 'We could not register you!';
}
}
}
}
} else {
echo 'All fields are required';
}
}
} else if (loggedin()) {
echo 'You are already registered and logged in !';
}

5
php/register_success.php Normal file
View File

@@ -0,0 +1,5 @@
<?php
echo 'Registered!'
?>

2
services.html
View File

@@ -53,7 +53,7 @@
</li>
</ul>
<div class="form-container">
<form class="d-flex align-items-center d-sm-flex justify-content-sm-between" role="search">
<form class="form-search d-flex align-items-center d-sm-flex justify-content-sm-between" role="search">
<input id="src-input" class="form-control rounded-0 border-0" type="search" placeholder="Search ...">
<button class="btn" type="submit" style="padding-bottom: 0px;padding-top: 0px;">
<span class="material-icons">

44
signup.html Normal file
View File

@@ -0,0 +1,44 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.4.1/dist/css/bootstrap.min.css"
integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.rtl.min.css"
integrity="sha384-gXt9imSW0VcJVHezoNQsP+TNrjYXoGcrqBZJpry9zJt8PCQjobwmhMGaDHTASo9N" crossorigin="anonymous">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
crossorigin="anonymous"></script>
<link rel="stylesheet" href="style/style.css">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<script src="https://kit.fontawesome.com/4bb6479073.js" crossorigin="anonymous"></script>
<title>Globaly - Full Cycle Business Management & Consulting Responsive WordPress Theme</title>
</head>
<body>
<div class="form d-flex flex-column align-items-center justify-content-center my-md-5 mb-5 mb-lg-0">
<div class="headline-card d-flex flex-column align-items-center justify-content-center mt-4">
<h2>Signup</h2>
<img class="line-img" src="assets/images/line.png" alt="">
</div>
<h6>Create your account</h6>
<form action="php/register.php" method="post">
<div class="form-container-bot d-flex flex-column align-items-start justify-content-center" >
<input class="input-text" type="text" placeholder="Name" name="name">
<input class="input-text" type="text" placeholder="Email" name="email">
<input class="input-text" type="password" placeholder="Password" name="password">
<input class="input-text" type="password" placeholder="Confirm Password" name="password_again">
<input class="view-more" type="submit" value="Signup">
</div>
</form>
</body>
</html>

36
style/_nav.scss
View File

@@ -1,7 +1,7 @@
@import '_variables';
form{
.form-search{
width: 380px;
height: 40px ;
}
@@ -99,10 +99,31 @@ input::placeholder {
cursor:pointer;
}
.register{
.register-link{
color: #15c1c6;
cursor: pointer;
margin-right: 10px;
}
.register-link:hover{
color:#333333;
transition: 0.3s;
}
}
@media only screen and (min-width: 768px) {
form {
.register{
position: absolute;
top: 15px;
left: 20px;
.register-link:hover{
color:#efefef;
transition: 0.3s;
}
}
.form-search{
width: 229px !important;
background-color: #4a4e55;
padding-left: 34px;
@@ -170,10 +191,19 @@ input::placeholder {
}
@media only screen and (min-width: 992px) {
.register{
position: absolute;
left: 5%;
top: 2%;
.register-link:hover{
color:#efefef;
transition: 0.3s;
}
}
.navbar{
height: 60px;
}
form{
.form-search{
margin-left: 55px;
margin-right: 72px;

2
style/about_us/_sixth-part-au.scss
View File

@@ -51,7 +51,7 @@
.card-q {
.collapsed {
background-color: #333333;
transition: 0.5s;
}
}

35
style/style.css
View File

@@ -11,7 +11,7 @@
font-family: "Merriweather";
src: url("../assets/fonts/Merriweather-Regular.ttf") format("truetype");
}
form {
.form-search {
width: 380px;
height: 40px;
}
@@ -106,8 +106,27 @@ input::placeholder {
cursor: pointer;
}
.register .register-link {
color: #15c1c6;
cursor: pointer;
margin-right: 10px;
}
.register .register-link:hover {
color: #333333;
transition: 0.3s;
}
@media only screen and (min-width: 768px) {
form {
.register {
position: absolute;
top: 15px;
left: 20px;
}
.register .register-link:hover {
color: #efefef;
transition: 0.3s;
}
.form-search {
width: 229px !important;
background-color: #4a4e55;
padding-left: 34px;
@@ -158,10 +177,19 @@ input::placeholder {
}
}
@media only screen and (min-width: 992px) {
.register {
position: absolute;
left: 5%;
top: 2%;
}
.register .register-link:hover {
color: #efefef;
transition: 0.3s;
}
.navbar {
height: 60px;
}
form {
.form-search {
margin-left: 55px;
margin-right: 72px;
}
@@ -1440,6 +1468,7 @@ footer .footer-copyright a:hover {
}
.sixth-part-au .card-q .collapsed {
background-color: #333333;
transition: 0.5s;
}
@media only screen and (min-width: 768px) {

2
style/style.css.map
View File

File diff suppressed because one or more lines are too long