mirror of
https://github.com/arthur-pbty/portfolio2023.git
synced 2026-06-16 00:02:48 +02:00
restart portfolio
This commit is contained in:
Tutur33
@@ -0,0 +1,19 @@
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
@import url('https://fonts.googleapis.com/css?family=Roboto:400,900');
|
||||
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: 'Roboto', sans-serif;
|
||||
}
|
||||
|
||||
html {
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
[x-cloak] {
|
||||
display: none !important;
|
||||
}
|
||||
@@ -1,89 +0,0 @@
|
||||
/* Réinitialisation des styles par défaut du navigateur */
|
||||
body, h1, h2, ul, li, label, input, button {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/* Style de base pour le corps de la page */
|
||||
body {
|
||||
font-family: Arial, sans-serif;
|
||||
background-color: #f5f5f5;
|
||||
color: #333;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/* Style de l'en-tête (h1) */
|
||||
h1 {
|
||||
font-size: 24px;
|
||||
margin: 20px;
|
||||
}
|
||||
|
||||
/* Style de la liste (ul) */
|
||||
ul {
|
||||
list-style: none;
|
||||
background-color: #ffffff28;
|
||||
padding: 20px;
|
||||
border-radius: 5px;
|
||||
margin: 20px;
|
||||
}
|
||||
|
||||
/* Style des titres de section (h2) */
|
||||
h2 {
|
||||
font-size: 20px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
/* Style des éléments de liste (li) */
|
||||
li {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
/* Style des formulaires */
|
||||
form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Style des labels des formulaires */
|
||||
label {
|
||||
font-weight: bold;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
/* Style des champs de saisie (input) */
|
||||
input {
|
||||
padding: 5px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 5px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
/* Style des boutons */
|
||||
button,
|
||||
a {
|
||||
padding: 10px 20px;
|
||||
background-color: #007bff;
|
||||
color: #fff;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/* Style des boutons au survol */
|
||||
button:hover,
|
||||
a:hover {
|
||||
background-color: #0056b3;
|
||||
}
|
||||
|
||||
a {
|
||||
margin: 20px;
|
||||
}
|
||||
|
||||
.dark-mode-theme {
|
||||
background-color: #1c1c1e;
|
||||
color: #fefefe;
|
||||
}
|
||||
@@ -1,107 +0,0 @@
|
||||
* {
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#notfound {
|
||||
position: relative;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
#notfound .notfound {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
-webkit-transform: translate(-50%, -50%);
|
||||
-ms-transform: translate(-50%, -50%);
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.notfound {
|
||||
max-width: 920px;
|
||||
width: 100%;
|
||||
line-height: 1.4;
|
||||
text-align: center;
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
|
||||
.notfound .notfound-404 {
|
||||
position: absolute;
|
||||
height: 100px;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
-webkit-transform: translateX(-50%);
|
||||
-ms-transform: translateX(-50%);
|
||||
transform: translateX(-50%);
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.notfound .notfound-404 h1 {
|
||||
font-family: 'Maven Pro', sans-serif;
|
||||
color: #ececec;
|
||||
font-weight: 900;
|
||||
font-size: 276px;
|
||||
margin: 0px;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
-webkit-transform: translate(-50%, -50%);
|
||||
-ms-transform: translate(-50%, -50%);
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.notfound h2 {
|
||||
font-family: 'Maven Pro', sans-serif;
|
||||
font-size: 46px;
|
||||
color: #000;
|
||||
font-weight: 900;
|
||||
text-transform: uppercase;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
.notfound p {
|
||||
font-family: 'Maven Pro', sans-serif;
|
||||
font-size: 16px;
|
||||
color: #000;
|
||||
font-weight: 400;
|
||||
text-transform: uppercase;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.notfound a {
|
||||
font-family: 'Maven Pro', sans-serif;
|
||||
font-size: 14px;
|
||||
text-decoration: none;
|
||||
text-transform: uppercase;
|
||||
background: #189cf0;
|
||||
display: inline-block;
|
||||
padding: 16px 38px;
|
||||
border: 2px solid transparent;
|
||||
border-radius: 40px;
|
||||
color: #fff;
|
||||
font-weight: 400;
|
||||
-webkit-transition: 0.2s all;
|
||||
transition: 0.2s all;
|
||||
}
|
||||
|
||||
.notfound a:hover {
|
||||
background-color: #fff;
|
||||
border-color: #189cf0;
|
||||
color: #189cf0;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 480px) {
|
||||
.notfound .notfound-404 h1 {
|
||||
font-size: 162px;
|
||||
}
|
||||
.notfound h2 {
|
||||
font-size: 26px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,288 +0,0 @@
|
||||
@import url('https://fonts.googleapis.com/css?family=Poppins:400,500,600,700,800,900');
|
||||
|
||||
body{
|
||||
font-family: 'Poppins', sans-serif;
|
||||
font-weight: 300;
|
||||
font-size: 15px;
|
||||
line-height: 1.7;
|
||||
color: #c4c3ca;
|
||||
background-color: #1f2029;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
a {
|
||||
cursor: pointer;
|
||||
transition: all 200ms linear;
|
||||
}
|
||||
a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
.link {
|
||||
color: #c4c3ca;
|
||||
}
|
||||
.link:hover {
|
||||
color: #ffeba7;
|
||||
}
|
||||
p {
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
line-height: 1.7;
|
||||
}
|
||||
h4 {
|
||||
font-weight: 600;
|
||||
}
|
||||
h6 span{
|
||||
padding: 0 20px;
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
}
|
||||
.section{
|
||||
position: relative;
|
||||
width: 100%;
|
||||
display: block;
|
||||
}
|
||||
.full-height{
|
||||
min-height: 100vh;
|
||||
}
|
||||
[type="checkbox"]:checked,
|
||||
[type="checkbox"]:not(:checked){
|
||||
position: absolute;
|
||||
left: -9999px;
|
||||
}
|
||||
.checkbox:checked + label,
|
||||
.checkbox:not(:checked) + label{
|
||||
position: relative;
|
||||
display: block;
|
||||
text-align: center;
|
||||
width: 60px;
|
||||
height: 16px;
|
||||
border-radius: 8px;
|
||||
padding: 0;
|
||||
margin: 10px auto;
|
||||
cursor: pointer;
|
||||
background-color: #ffeba7;
|
||||
}
|
||||
.checkbox:checked + label:before,
|
||||
.checkbox:not(:checked) + label:before{
|
||||
position: absolute;
|
||||
display: block;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border-radius: 50%;
|
||||
color: #ffeba7;
|
||||
background-color: #102770;
|
||||
font-family: 'unicons';
|
||||
content: '\eb4f';
|
||||
z-index: 20;
|
||||
top: -10px;
|
||||
left: -10px;
|
||||
line-height: 36px;
|
||||
text-align: center;
|
||||
font-size: 24px;
|
||||
transition: all 0.5s ease;
|
||||
}
|
||||
.checkbox:checked + label:before {
|
||||
transform: translateX(44px) rotate(-270deg);
|
||||
}
|
||||
|
||||
|
||||
.card-3d-wrap {
|
||||
position: relative;
|
||||
width: 440px;
|
||||
max-width: 100%;
|
||||
height: 400px;
|
||||
-webkit-transform-style: preserve-3d;
|
||||
transform-style: preserve-3d;
|
||||
perspective: 800px;
|
||||
margin-top: 60px;
|
||||
}
|
||||
.card-3d-wrapper {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position:absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
-webkit-transform-style: preserve-3d;
|
||||
transform-style: preserve-3d;
|
||||
transition: all 600ms ease-out;
|
||||
}
|
||||
.card-front, .card-back {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #2a2b38;
|
||||
background-image: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/1462889/pat.svg');
|
||||
background-position: bottom center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 300%;
|
||||
position: absolute;
|
||||
border-radius: 6px;
|
||||
left: 0;
|
||||
top: 0;
|
||||
-webkit-transform-style: preserve-3d;
|
||||
transform-style: preserve-3d;
|
||||
-webkit-backface-visibility: hidden;
|
||||
-moz-backface-visibility: hidden;
|
||||
-o-backface-visibility: hidden;
|
||||
backface-visibility: hidden;
|
||||
}
|
||||
.card-back {
|
||||
transform: rotateY(180deg);
|
||||
}
|
||||
.checkbox:checked ~ .card-3d-wrap .card-3d-wrapper {
|
||||
transform: rotateY(180deg);
|
||||
}
|
||||
.center-wrap{
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
padding: 0 35px;
|
||||
top: 50%;
|
||||
left: 0;
|
||||
transform: translate3d(0, -50%, 35px) perspective(100px);
|
||||
z-index: 20;
|
||||
display: block;
|
||||
}
|
||||
|
||||
|
||||
.form-group{
|
||||
position: relative;
|
||||
display: block;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.form-style {
|
||||
padding: 13px 20px;
|
||||
padding-left: 55px;
|
||||
height: 48px;
|
||||
width: 100%;
|
||||
font-weight: 500;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
letter-spacing: 0.5px;
|
||||
outline: none;
|
||||
color: #c4c3ca;
|
||||
background-color: #1f2029;
|
||||
border: none;
|
||||
-webkit-transition: all 200ms linear;
|
||||
transition: all 200ms linear;
|
||||
box-shadow: 0 4px 8px 0 rgba(21,21,21,.2);
|
||||
}
|
||||
.form-style:focus,
|
||||
.form-style:active {
|
||||
border: none;
|
||||
outline: none;
|
||||
box-shadow: 0 4px 8px 0 rgba(21,21,21,.2);
|
||||
}
|
||||
.input-icon {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 18px;
|
||||
height: 48px;
|
||||
font-size: 24px;
|
||||
line-height: 48px;
|
||||
text-align: left;
|
||||
color: #ffeba7;
|
||||
-webkit-transition: all 200ms linear;
|
||||
transition: all 200ms linear;
|
||||
}
|
||||
|
||||
.form-group input:-ms-input-placeholder {
|
||||
color: #c4c3ca;
|
||||
opacity: 0.7;
|
||||
-webkit-transition: all 200ms linear;
|
||||
transition: all 200ms linear;
|
||||
}
|
||||
.form-group input::-moz-placeholder {
|
||||
color: #c4c3ca;
|
||||
opacity: 0.7;
|
||||
-webkit-transition: all 200ms linear;
|
||||
transition: all 200ms linear;
|
||||
}
|
||||
.form-group input:-moz-placeholder {
|
||||
color: #c4c3ca;
|
||||
opacity: 0.7;
|
||||
-webkit-transition: all 200ms linear;
|
||||
transition: all 200ms linear;
|
||||
}
|
||||
.form-group input::-webkit-input-placeholder {
|
||||
color: #c4c3ca;
|
||||
opacity: 0.7;
|
||||
-webkit-transition: all 200ms linear;
|
||||
transition: all 200ms linear;
|
||||
}
|
||||
.form-group input:focus:-ms-input-placeholder {
|
||||
opacity: 0;
|
||||
-webkit-transition: all 200ms linear;
|
||||
transition: all 200ms linear;
|
||||
}
|
||||
.form-group input:focus::-moz-placeholder {
|
||||
opacity: 0;
|
||||
-webkit-transition: all 200ms linear;
|
||||
transition: all 200ms linear;
|
||||
}
|
||||
.form-group input:focus:-moz-placeholder {
|
||||
opacity: 0;
|
||||
-webkit-transition: all 200ms linear;
|
||||
transition: all 200ms linear;
|
||||
}
|
||||
.form-group input:focus::-webkit-input-placeholder {
|
||||
opacity: 0;
|
||||
-webkit-transition: all 200ms linear;
|
||||
transition: all 200ms linear;
|
||||
}
|
||||
|
||||
.btn{
|
||||
border-radius: 4px;
|
||||
height: 44px;
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
-webkit-transition : all 200ms linear;
|
||||
transition: all 200ms linear;
|
||||
padding: 0 30px;
|
||||
letter-spacing: 1px;
|
||||
display: -webkit-inline-flex;
|
||||
display: -ms-inline-flexbox;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
-moz-align-items: center;
|
||||
-ms-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
-moz-justify-content: center;
|
||||
-ms-justify-content: center;
|
||||
justify-content: center;
|
||||
-ms-flex-pack: center;
|
||||
text-align: center;
|
||||
border: none;
|
||||
background-color: #ffeba7;
|
||||
color: #102770;
|
||||
box-shadow: 0 8px 24px 0 rgba(255,235,167,.2);
|
||||
}
|
||||
.btn:active,
|
||||
.btn:focus{
|
||||
background-color: #102770;
|
||||
color: #ffeba7;
|
||||
box-shadow: 0 8px 24px 0 rgba(16,39,112,.2);
|
||||
}
|
||||
.btn:hover{
|
||||
background-color: #102770;
|
||||
color: #ffeba7;
|
||||
box-shadow: 0 8px 24px 0 rgba(16,39,112,.2);
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.logo {
|
||||
position: absolute;
|
||||
top: 30px;
|
||||
right: 30px;
|
||||
display: block;
|
||||
z-index: 100;
|
||||
transition: all 250ms linear;
|
||||
}
|
||||
.logo img {
|
||||
height: 26px;
|
||||
width: auto;
|
||||
display: block;
|
||||
}
|
||||
@@ -1,324 +0,0 @@
|
||||
@import url('https://fonts.googleapis.com/css?family=Roboto:400,900');
|
||||
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: 'Roboto', sans-serif;
|
||||
}
|
||||
|
||||
html {
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
body {
|
||||
justify-content: space-around;
|
||||
max-width: 2500px;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.fixed-navbar {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
backdrop-filter: blur(10px);
|
||||
z-index: 999;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 0 50px 0 50px;
|
||||
width: calc(100% - 100px);
|
||||
align-items: center;
|
||||
border-bottom: 1px solid rgb(83, 83, 83);
|
||||
}
|
||||
|
||||
.fixed-navbar ul {
|
||||
list-style: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 70px;
|
||||
}
|
||||
|
||||
.fixed-navbar li {
|
||||
margin: 0 10px;
|
||||
font-weight: bold;
|
||||
color: rgb(83, 83, 83);
|
||||
}
|
||||
|
||||
.fixed-navbar a {
|
||||
text-decoration: none;
|
||||
color: rgb(83, 83, 83);
|
||||
padding: 5px 15px;
|
||||
}
|
||||
|
||||
.fixed-navbar a:hover {
|
||||
border: 1px solid rgb(83, 83, 83);
|
||||
border-radius: 5px;
|
||||
padding: 5px 14px;
|
||||
}
|
||||
|
||||
.mini-nav {
|
||||
display: none;
|
||||
height: 70px;
|
||||
position: fixed;
|
||||
width: calc(100% - 100px);
|
||||
top: 0;
|
||||
left: 0;
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
backdrop-filter: blur(10px);
|
||||
z-index: 999;
|
||||
padding: 0 50px 0 50px;
|
||||
align-items: center;
|
||||
border-bottom: 1px solid rgb(83, 83, 83);
|
||||
}
|
||||
|
||||
.mini-nav img {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.depli-nav {
|
||||
background: none;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
main,
|
||||
section {
|
||||
margin: 100px 100px 100px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 40px;
|
||||
font-weight: 700;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 28px;
|
||||
font-weight: 700;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.barre-verticale {
|
||||
border-left: 5px solid rgb(94, 94, 94);
|
||||
padding-left: 15px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.citation {
|
||||
font-style: italic;
|
||||
color: rgb(61, 61, 61);
|
||||
}
|
||||
|
||||
.citation-auth {
|
||||
color: rgb(61, 61, 61);
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
main {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.main-left {
|
||||
margin-right: 40px;
|
||||
}
|
||||
|
||||
.main-right {
|
||||
margin-left: 40px;
|
||||
min-width: 40%;
|
||||
}
|
||||
|
||||
.div-lien div {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
text-align: left;
|
||||
margin: 5px 0 5px;
|
||||
padding: 20px 40px;
|
||||
background-color: rgb(216, 216, 216);
|
||||
color: rgb(85, 85, 85);
|
||||
text-decoration: none;
|
||||
border-radius: 5px;
|
||||
cursor: pointer;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.div-lien div:hover {
|
||||
background-color: rgb(177, 177, 177);
|
||||
}
|
||||
|
||||
.div-lien a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.div-lien img {
|
||||
width: 50px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
|
||||
@media (max-width: 800px) {
|
||||
.main-right {
|
||||
display: none;
|
||||
}
|
||||
|
||||
main,
|
||||
section {
|
||||
margin: 20px 20px 20px;
|
||||
}
|
||||
|
||||
.fixed-navbar {
|
||||
margin-top: 70px;
|
||||
flex-direction: column;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.mini-nav {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin-top: 80px;
|
||||
}
|
||||
|
||||
.mini-nav {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
#nav a {
|
||||
padding: 5px 15px;
|
||||
}
|
||||
|
||||
#nav a:hover {
|
||||
padding: 5px 14px;
|
||||
}
|
||||
|
||||
#nav ul {
|
||||
width: 300px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.nav-dark {
|
||||
background-color: #1c1c1e;
|
||||
}
|
||||
|
||||
.nav-light {
|
||||
background-color: #fefefe;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 940px) {
|
||||
.fixed-navbar li {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.fixed-navbar a {
|
||||
padding: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.pp {
|
||||
margin: auto;
|
||||
width: 100%;
|
||||
max-width: 500px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.formContact {
|
||||
width: 60%;
|
||||
margin: 0 auto;
|
||||
background-color: #ffffff28;
|
||||
padding: 20px;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.formContact label {
|
||||
display: block;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.formContact input[type="text"],
|
||||
.formContact input[type="email"],
|
||||
.formContact textarea {
|
||||
width: calc(100% - 20px);
|
||||
padding: 10px;
|
||||
margin-top: 5px;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 5px;
|
||||
max-width: calc(100% - 20px);
|
||||
min-width: calc(100% - 20px);
|
||||
}
|
||||
|
||||
.formContact input[type="submit"] {
|
||||
background-color: #333;
|
||||
color: #fff;
|
||||
padding: 10px 20px;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
cursor: pointer;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.formContact input[type="submit"]:hover {
|
||||
background-color: #555;
|
||||
}
|
||||
|
||||
.all_projects {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.all_projects div {
|
||||
height: 300px;
|
||||
width: 300px;
|
||||
margin: 10px;
|
||||
transition: transform 0.3s;
|
||||
border: 2px solid black;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.all_projects div:hover {
|
||||
transform: scale(1.2);
|
||||
}
|
||||
|
||||
.all_projects img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 7px;
|
||||
}
|
||||
|
||||
.btn_theme {
|
||||
background-color:rgba(255, 255, 255, 0);
|
||||
color: rgb(83, 83, 83);
|
||||
padding: 5px 15px;
|
||||
cursor: pointer;
|
||||
text-transform: uppercase;
|
||||
display: flex;
|
||||
border: none;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.btn_theme:hover {
|
||||
border: 1px solid rgb(83, 83, 83);
|
||||
border-radius: 5px;
|
||||
padding: 4px 14px;
|
||||
}
|
||||
|
||||
#text {
|
||||
margin: 0;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.dark-mode-theme {
|
||||
background-color: #1c1c1e;
|
||||
color: #fefefe;
|
||||
}
|
||||
|
||||
.dark-mode-theme .fixed-navbar ul,
|
||||
.dark-mode-theme .fixed-navbar li,
|
||||
.dark-mode-theme .fixed-navbar a {
|
||||
color: rgb(177, 177, 177);
|
||||
}
|
||||
@@ -1,222 +0,0 @@
|
||||
@import url("https://fonts.googleapis.com/css?family=Montserrat:700");
|
||||
|
||||
*{
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
font-family: 'Inter', sans-serif;
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
body{
|
||||
background-color: rgb(240, 240, 240);
|
||||
}
|
||||
|
||||
.btn {
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
font-size: 1em;
|
||||
text-decoration: none;
|
||||
text-transform: uppercase;
|
||||
padding: 10px;
|
||||
background-color: gray;
|
||||
transition: transform 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55), background-position 800ms cubic-bezier(0.68, -0.55, 0.265, 1.55), box-shadow 500ms linear;
|
||||
background-image: url('data:image/svg+xml;utf8,<?xml version="1.0" encoding="utf-8"?><svg version="1.1" id="Livello_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="1296px" height="768px" viewBox="0 0 1296 768" enable-background="new 0 0 1296 768" xml:space="preserve"><g><polygon fill="#8694D1" points="766.6,1.2 -0.2,768 200.7,768 967.5,1.2 "/></g><g><polygon fill="#8694D1" points="1094.8,1.2 328,768 528.9,768 1295.7,1.2 "/></g></svg>');
|
||||
background-size: contain;
|
||||
background-position: -200px center;
|
||||
background-repeat: no-repeat;
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.btn:hover {
|
||||
transform: scale(1.04);
|
||||
background-position: -60px;
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
}
|
||||
|
||||
.btn:active {
|
||||
transform: scale(0.5);
|
||||
background-position: 500px;
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
|
||||
}
|
||||
|
||||
.txt_lien{
|
||||
width : 100%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.header{
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.div_big_title{
|
||||
padding: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.big_title{
|
||||
font-weight: 900;
|
||||
color: black;
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
.sous_big_title{
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.div_btn{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
}
|
||||
|
||||
.div_btn_2{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.sous_title{
|
||||
font-weight: 900;
|
||||
color: black;
|
||||
font-size: 17px;
|
||||
text-align: center;
|
||||
padding: 25px;
|
||||
}
|
||||
|
||||
.corps{
|
||||
margin: 0px 150px 0px;
|
||||
background-color: white;
|
||||
box-shadow: 0px 0px 10px 1px gray;
|
||||
}
|
||||
|
||||
.inter_corps,
|
||||
.inter_corps_contact{
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.def_pv1_1,
|
||||
.def_pv1_2{
|
||||
padding: 0 0 25px;
|
||||
}
|
||||
|
||||
.img_1,
|
||||
.img_3{
|
||||
width : 30%;
|
||||
border: none;
|
||||
float: right;
|
||||
border-radius: 25% 10% 25% 15%;
|
||||
padding: 0 0 15px 15px;
|
||||
}
|
||||
|
||||
.img_2{
|
||||
width : 30%;
|
||||
border: none;
|
||||
float: left;
|
||||
border-radius: 10% 25% 15% 25%;
|
||||
padding: 0 15px 15px 0;
|
||||
}
|
||||
|
||||
.id2_pv1,
|
||||
.id2_pv2,
|
||||
.id2_pv3,
|
||||
.id2_pv4{
|
||||
padding: 0 0 25px;
|
||||
}
|
||||
|
||||
.img_carte{
|
||||
width : 100%;
|
||||
border: none;
|
||||
border-radius: 5% / 10%;
|
||||
}
|
||||
|
||||
.clear{
|
||||
clear:both
|
||||
}
|
||||
|
||||
.inter_corps_contact{
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.p_contact{
|
||||
padding: 10px 0 10px 0;
|
||||
}
|
||||
|
||||
form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
label {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
input[type="text"], input[type="email"], textarea {
|
||||
margin-bottom: 10px;
|
||||
padding: 10px;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
|
||||
.footer{
|
||||
background-color: rgb(51, 50, 58);
|
||||
margin-top: 50px;
|
||||
}
|
||||
|
||||
.footer2{
|
||||
height: 100px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 10%;
|
||||
}
|
||||
|
||||
.sources,
|
||||
.sources a{
|
||||
text-decoration: none;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.line{
|
||||
border-bottom: 1px solid gray;
|
||||
margin: 0 100px;
|
||||
}
|
||||
|
||||
.footer1{
|
||||
width: 100%;
|
||||
height: 100px;
|
||||
padding-top: 40px;
|
||||
}
|
||||
|
||||
.copyrights{
|
||||
color: white;
|
||||
float: left;
|
||||
width: 40%;
|
||||
text-align: left;
|
||||
margin-left: 10%;
|
||||
}
|
||||
|
||||
.conditions_generale{
|
||||
text-decoration: none;
|
||||
font-weight: 600;
|
||||
color: white;
|
||||
float: right;
|
||||
width: 40%;
|
||||
text-align: right;
|
||||
margin-right: 10%;
|
||||
}
|
||||
|
||||
.id3_pv1,
|
||||
.id3_pv2,
|
||||
.id3_pv3,
|
||||
.id3_pv4,
|
||||
.id3_pv5{
|
||||
padding: 0 0 25px;
|
||||
}
|
||||
@@ -1,102 +0,0 @@
|
||||
@import url("https://fonts.googleapis.com/css?family=Montserrat:700");
|
||||
|
||||
.btn {
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
font-size: 1em;
|
||||
text-decoration: none;
|
||||
text-transform: uppercase;
|
||||
padding: 4px;
|
||||
background-color: #222222;
|
||||
transition: transform 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55), background-position 800ms cubic-bezier(0.68, -0.55, 0.265, 1.55), box-shadow 500ms linear;
|
||||
background-image: url('data:image/svg+xml;utf8,<?xml version="1.0" encoding="utf-8"?><svg version="1.1" id="Livello_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="1296px" height="768px" viewBox="0 0 1296 768" enable-background="new 0 0 1296 768" xml:space="preserve"><g><polygon fill="#8694D1" points="766.6,1.2 -0.2,768 200.7,768 967.5,1.2 "/></g><g><polygon fill="#8694D1" points="1094.8,1.2 328,768 528.9,768 1295.7,1.2 "/></g></svg>');
|
||||
background-size: contain;
|
||||
background-position: -200px center;
|
||||
background-repeat: no-repeat;
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-family: 'Inter', sans-serif;
|
||||
border-radius: 10px;
|
||||
}
|
||||
.btn:hover {
|
||||
transform: scale(1.04);
|
||||
background-position: -60px;
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
}
|
||||
.btn:active {
|
||||
transform: scale(0.5);
|
||||
background-position: 500px;
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
|
||||
}
|
||||
|
||||
.txt_lien{
|
||||
width : 100%;
|
||||
text-align: center;
|
||||
padding-right: 48px;
|
||||
}
|
||||
|
||||
*{
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
body{
|
||||
background-color: black;
|
||||
}
|
||||
|
||||
section{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
-webkit-box-pack: justify;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
div{
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
.accueil{
|
||||
-webkit-box-align: center;
|
||||
align-items: center;
|
||||
padding: 64px 16px 32px;
|
||||
}
|
||||
|
||||
.profil_img{
|
||||
border-radius: 50%;
|
||||
width : 100px;
|
||||
height : 100px;
|
||||
}
|
||||
|
||||
h1{
|
||||
font-family: 'Inter', sans-serif;
|
||||
font-weight: 900;
|
||||
color: rgb(255, 255, 255);
|
||||
font-size: 20px;
|
||||
margin-left: 12px;
|
||||
margin-right: 12px;
|
||||
max-width: 100%;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
h2{
|
||||
font-family: 'Inter', sans-serif;
|
||||
font-weight: 900;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
font-size: 16px;
|
||||
padding-left: 40px;
|
||||
padding-right: 40px;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.liste_btn{
|
||||
margin: 0px auto;
|
||||
max-width: 680px;
|
||||
}
|
||||
|
||||
.lien_img{
|
||||
width : 48px;
|
||||
height : 48px;
|
||||
border-radius: 9px;
|
||||
}
|
||||
@@ -1,208 +0,0 @@
|
||||
* {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
user-select: none;
|
||||
font-family: arial, sans-serif;
|
||||
}
|
||||
img {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
body {
|
||||
background: #202124;
|
||||
}
|
||||
|
||||
a {
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
nav a:hover,
|
||||
nav a:active {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
nav {
|
||||
display: flex;
|
||||
justify-content: right;
|
||||
width: 100%;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.lien_nav {
|
||||
padding: 5px;
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
.img_nav {
|
||||
display: flex;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.img_compte {
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
height: 80vh;
|
||||
}
|
||||
|
||||
.logo {
|
||||
max-height: 400px;
|
||||
max-width: 400px;
|
||||
padding: 30px;
|
||||
}
|
||||
|
||||
.bar_recherche {
|
||||
align-items: center;
|
||||
padding: 0px 10px 0 10px;
|
||||
display: flex;
|
||||
height: 44px;
|
||||
border: 1px solid #5f6368;
|
||||
border-radius: 50px;
|
||||
width: 80%;
|
||||
max-width: 600px;
|
||||
margin: 0px 20px 0 20px;
|
||||
box-shadow: 0 1px 6px 0 #171717;
|
||||
background: #303134;
|
||||
border-color: rgba(223, 225, 229, 0);
|
||||
}
|
||||
|
||||
.bar_recherche input {
|
||||
background: transparent;
|
||||
flex: 1;
|
||||
border: 0;
|
||||
outline: none;
|
||||
padding: 10px;
|
||||
font-size: 16px;
|
||||
color: snow;
|
||||
}
|
||||
|
||||
::placeholder {
|
||||
color: snow;
|
||||
}
|
||||
|
||||
.bar_recherche button img {
|
||||
width: 25px;
|
||||
}
|
||||
|
||||
.bar_recherche button {
|
||||
border: 0;
|
||||
border-radius: 50%;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
background: #303134;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.footer {
|
||||
min-height: 100px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 50px;
|
||||
justify-content: space-between;
|
||||
padding: 0 100px;
|
||||
flex-wrap: wrap;
|
||||
background-color: #171717;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 420px;
|
||||
}
|
||||
|
||||
.copyrights,
|
||||
#year {
|
||||
padding-right: 20px;
|
||||
color: #9aa0a6;
|
||||
display: inline;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.conditions_generale {
|
||||
text-decoration: none;
|
||||
font-weight: 600;
|
||||
color: #9aa0a6;
|
||||
}
|
||||
|
||||
main {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.section_gauche {
|
||||
flex: 0 0 auto;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
width: calc(100% - 420px);
|
||||
}
|
||||
|
||||
.separator {
|
||||
position: fixed;
|
||||
width: 2px;
|
||||
height: 100%;
|
||||
background-color: #303134;
|
||||
margin-left: calc(100% - 420px);
|
||||
}
|
||||
|
||||
.section_droite {
|
||||
width: 420px;
|
||||
margin-left: calc(100% - 420px);
|
||||
}
|
||||
|
||||
.liste_favori {
|
||||
padding-top: 50px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.liste_favori a {
|
||||
text-align: center;
|
||||
margin: 0 10px;
|
||||
}
|
||||
|
||||
.liste_favori a img {
|
||||
width: 150px;
|
||||
height: 80px;
|
||||
border-radius: 15px;
|
||||
}
|
||||
|
||||
.liste_app {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.liste_app a {
|
||||
text-align: center;
|
||||
margin: 0 20px 20px 20px;
|
||||
}
|
||||
|
||||
.liste_app a img {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border-radius: 15px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 16px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: rgb(218, 220, 224);
|
||||
background-clip: padding-box;
|
||||
border: 4px solid transparent;
|
||||
border-radius: 8px;
|
||||
box-shadow: none;
|
||||
min-height: 50px;
|
||||
background-color: rgb(95, 99, 104);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track,
|
||||
::-webkit-scrollbar-track:hover {
|
||||
background: none;
|
||||
border: none;
|
||||
}
|
||||
@@ -1,212 +0,0 @@
|
||||
/* -------------------- autre -------------------- */
|
||||
|
||||
@import url('https://fonts.googleapis.com/css?family=Roboto:400,900');
|
||||
|
||||
*{
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
html {
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
.titre_section{
|
||||
position: relative;
|
||||
font-family: 'Roboto', sans-serif;
|
||||
font-size: 50px;
|
||||
padding: 50px 0 0 60px;
|
||||
}
|
||||
|
||||
.titre_section::before{
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 50px;
|
||||
height: 7px;
|
||||
background: rgb(150, 150, 150);
|
||||
bottom: 0;
|
||||
box-shadow: 0 2px 2px #0000001F;
|
||||
}
|
||||
|
||||
/* -------------------- autre -------------------- */
|
||||
|
||||
/* -------------------- header -------------------- */
|
||||
|
||||
header{
|
||||
min-height: 100vh;
|
||||
background: url(../../public/landing.jpg);
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
nav{
|
||||
display: flex;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
nav li{
|
||||
margin: 30px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
nav a{
|
||||
font-size: 20px;
|
||||
font-weight: 600;
|
||||
font-family: 'Roboto', sans-serif;
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
position: relative;
|
||||
display: block;
|
||||
transition: transform 0.4s;
|
||||
}
|
||||
|
||||
.logo{
|
||||
width: 60px;
|
||||
}
|
||||
|
||||
.big_title{
|
||||
color: white;
|
||||
font-size: 150px;
|
||||
font-family: 'Roboto', sans-serif;
|
||||
position: absolute;
|
||||
top: 40%;
|
||||
left: 10%;
|
||||
}
|
||||
/* -------------------- header -------------------- */
|
||||
|
||||
/* -------------------- section explication -------------------- */
|
||||
|
||||
.explication_contenaire{
|
||||
padding: 0 100px;
|
||||
}
|
||||
|
||||
.partie_1,
|
||||
.partie_2{
|
||||
box-sizing: border-box;
|
||||
margin: 10px auto 10px;
|
||||
padding: 10px;
|
||||
width: 80%; min-height: 220px;
|
||||
|
||||
font-family: sans-serif;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.image_parragraphe_1{
|
||||
width : 150px;
|
||||
border: none;
|
||||
float: left;
|
||||
border-radius: 10%;
|
||||
}
|
||||
|
||||
.image_parragraphe_2{
|
||||
width : 200px;
|
||||
border: none;
|
||||
float: right;
|
||||
border-radius: 10%;
|
||||
}
|
||||
|
||||
.space{
|
||||
margin: 0, padding 0;
|
||||
width: 0; height: 0;
|
||||
}
|
||||
|
||||
/* -------------------- section explication -------------------- */
|
||||
|
||||
/* -------------------- section download -------------------- */
|
||||
|
||||
.download_link{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.btn_download{
|
||||
text-decoration: none;
|
||||
padding: 8px;
|
||||
font-family: arial;
|
||||
font-size: 1em;
|
||||
color: #FFFFFF;
|
||||
background-color: #0070c0;
|
||||
border-radius: 10px;
|
||||
-webkit-border-radius: 10px;
|
||||
-moz-border-radius: 10px;
|
||||
border: 2px solid #00b0f0;
|
||||
box-shadow: 3px 3px 4px #444444;
|
||||
-webkit-box-shadow: 3px 3px 4px #444444;
|
||||
-moz-box-shadow: 3px 3px 4px #444444;
|
||||
margin-bottom: 10px;
|
||||
transition: transform 0.2s ease;
|
||||
width: 70%;
|
||||
cursor: pointer;
|
||||
|
||||
}
|
||||
|
||||
.btn_download:active{
|
||||
transform: scale(1.05);
|
||||
}
|
||||
|
||||
.logo_download{
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
/* -------------------- section download -------------------- */
|
||||
|
||||
/* -------------------- section version web -------------------- */
|
||||
|
||||
#version_web p{
|
||||
font-family: sans-serif;
|
||||
font-size: 1em;
|
||||
padding: 0 100px;
|
||||
}
|
||||
|
||||
.btn_version_web{
|
||||
text-decoration: none;
|
||||
padding: 8px;
|
||||
font-family: arial;
|
||||
font-size: 1em;
|
||||
color: #FFFFFF;
|
||||
background-color: #0070c0;
|
||||
border-radius: 10px;
|
||||
-webkit-border-radius: 10px;
|
||||
-moz-border-radius: 10px;
|
||||
border: 2px solid #00b0f0;
|
||||
box-shadow: 3px 3px 4px #444444;
|
||||
-webkit-box-shadow: 3px 3px 4px #444444;
|
||||
-moz-box-shadow: 3px 3px 4px #444444;
|
||||
margin-bottom: 10px;
|
||||
transition: transform 0.2s ease;
|
||||
width: 40%;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.btn_version_web:active{
|
||||
transform: scale(1.05);
|
||||
}
|
||||
|
||||
.btn_version_web_contenaire{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
/* -------------------- section version web -------------------- */
|
||||
|
||||
/* -------------------- section autre -------------------- */
|
||||
|
||||
#autre p{
|
||||
font-family: sans-serif;
|
||||
font-size: 1em;
|
||||
padding: 0 100px;
|
||||
}
|
||||
|
||||
#autre iframe {
|
||||
padding: 20px 0 0 100px;
|
||||
}
|
||||
|
||||
/* -------------------- section autre -------------------- */
|
||||
|
||||
.dark-mode-theme {
|
||||
background-color: #1c1c1e;
|
||||
color: #fefefe;
|
||||
}
|
||||
@@ -1,22 +0,0 @@
|
||||
* {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
font-family: arial, sans-serif;
|
||||
}
|
||||
|
||||
main {
|
||||
margin: 0 100px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
padding: 50px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.dark-mode-theme {
|
||||
background-color: #1c1c1e;
|
||||
color: #fefefe;
|
||||
}
|
||||
@@ -0,0 +1,29 @@
|
||||
import '../css/app.css'
|
||||
import Alpine from 'alpinejs'
|
||||
|
||||
window.Alpine = Alpine
|
||||
|
||||
Alpine.start()
|
||||
|
||||
|
||||
|
||||
if (!localStorage.theme) localStorage.theme = 'systeme';
|
||||
|
||||
// si le theme est systeme on regarde si le systeme est en dark ou light et on met une class dark ou light sur le html
|
||||
if (localStorage.theme === 'systeme') {
|
||||
if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
||||
document.documentElement.classList.add('dark')
|
||||
} else {
|
||||
document.documentElement.classList.remove('dark')
|
||||
}
|
||||
}
|
||||
|
||||
// si le theme est light on met la class light sur le html
|
||||
if (localStorage.theme === 'light') {
|
||||
document.documentElement.classList.remove('dark')
|
||||
}
|
||||
|
||||
// si le theme est dark on met la class dark sur le html
|
||||
if (localStorage.theme === 'dark') {
|
||||
document.documentElement.classList.add('dark')
|
||||
}
|
||||
@@ -1 +0,0 @@
|
||||
import '../css/compte.css'
|
||||
@@ -1 +0,0 @@
|
||||
import '../css/form.css'
|
||||
@@ -1,51 +0,0 @@
|
||||
import '../css/index.css'
|
||||
|
||||
const toggleBtn = document.getElementById("toggle-btn");
|
||||
const body = document.querySelector("body");
|
||||
const text = document.getElementById("text");
|
||||
const mini_nav = document.getElementById("mini-nav");
|
||||
const mini_nav_depli = document.getElementById("nav");
|
||||
|
||||
let darkmode = localStorage.getItem("dark-mode");
|
||||
|
||||
const enableDarkMode=() =>{
|
||||
body.classList.add("dark-mode-theme");
|
||||
mini_nav.classList.add("nav-dark");
|
||||
mini_nav_depli.classList.add("nav-dark");
|
||||
mini_nav.classList.remove("nav-light");
|
||||
mini_nav_depli.classList.remove("nav-light");
|
||||
|
||||
toggleBtn.classList.add("dark-mode-toggle");
|
||||
toggleBtn.style.color = "rgb(177, 177, 177)";
|
||||
|
||||
text.innerHTML="sombre";
|
||||
localStorage.setItem("dark-mode" , "enabled")
|
||||
}
|
||||
|
||||
const disableDarkMode= () =>{
|
||||
body.classList.remove("dark-mode-theme");
|
||||
mini_nav.classList.remove("nav-dark");
|
||||
mini_nav_depli.classList.remove("nav-dark");
|
||||
mini_nav.classList.add("nav-light");
|
||||
mini_nav_depli.classList.add("nav-light");
|
||||
|
||||
toggleBtn.classList.remove("dark-mode-toggle");
|
||||
toggleBtn.style.color = "rgb(83, 83, 83)";
|
||||
|
||||
text.innerHTML="claire";
|
||||
localStorage.setItem("dark-mode" , "disabled")
|
||||
}
|
||||
|
||||
|
||||
if(darkmode === "enabled"){
|
||||
enableDarkMode()
|
||||
}
|
||||
|
||||
toggleBtn.onclick = function(){
|
||||
darkmode = localStorage.getItem("dark-mode");
|
||||
if(darkmode === "enabled"){
|
||||
disableDarkMode()
|
||||
} else {
|
||||
enableDarkMode()
|
||||
}
|
||||
}
|
||||
@@ -1,82 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="fr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Login</title>
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="https://unicons.iconscout.com/release/v2.1.9/css/unicons.css">
|
||||
@entryPointStyles('form')
|
||||
@entryPointScripts('form')
|
||||
</head>
|
||||
<body>
|
||||
<a href="{{ route('home') }}" class="logo">
|
||||
<img src="/logo.png" alt="">
|
||||
</a>
|
||||
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
<div class="row full-height justify-content-center">
|
||||
<div class="col-12 text-center align-self-center py-5">
|
||||
<div class="section pb-5 pt-5 pt-sm-2 text-center">
|
||||
<h6 class="mb-0 pb-3"><span>Log In </span><span>Sign Up</span></h6>
|
||||
<input class="checkbox" type="checkbox" id="reg-log" name="reg-log"/>
|
||||
<label for="reg-log"></label>
|
||||
@!component('components/flash')
|
||||
<div class="card-3d-wrap mx-auto">
|
||||
<div class="card-3d-wrapper">
|
||||
<div class="card-front">
|
||||
<div class="center-wrap">
|
||||
<div class="section text-center">
|
||||
<h4 class="mb-4 pb-3">Log In</h4>
|
||||
<form action="{{ route('login') }}" method="post">
|
||||
<div class="form-group">
|
||||
<input type="email" name="loginemail" class="form-style" placeholder="Your Email" id="logemail" autocomplete="off">
|
||||
<i class="input-icon uil uil-at"></i>
|
||||
</div>
|
||||
<div class="form-group mt-2">
|
||||
<input type="password" name="loginpassword" class="form-style" placeholder="Your Password" id="logpass" autocomplete="off">
|
||||
<i class="input-icon uil uil-lock-alt"></i>
|
||||
</div>
|
||||
<button class="btn mt-4">submit</button>
|
||||
</form>
|
||||
<p class="mb-0 mt-4 text-center"><a href="#0" class="link">Forgot your password?</a></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-back">
|
||||
<div class="center-wrap">
|
||||
<div class="section text-center">
|
||||
<h4 class="mb-4 pb-3">Sign Up</h4>
|
||||
<form action="{{ route('signup') }}" method="post">
|
||||
<div class="form-group">
|
||||
<input type="text" name="pseudo" class="form-style" placeholder="Your Full Name" id="logname" autocomplete="off">
|
||||
<i class="input-icon uil uil-user"></i>
|
||||
</div>
|
||||
<div class="form-group mt-2">
|
||||
<input type="email" name="email" class="form-style" placeholder="Your Email" id="logemail" autocomplete="off">
|
||||
<i class="input-icon uil uil-at"></i>
|
||||
</div>
|
||||
<div class="form-group mt-2">
|
||||
<input type="password" name="password" class="form-style" placeholder="Your Password" id="logpass" autocomplete="off">
|
||||
<i class="input-icon uil uil-lock-alt"></i>
|
||||
</div>
|
||||
<div class="form-group mt-2">
|
||||
<input type="password" name="password_confirmation" class="form-style" placeholder="Confirm Your Password" id="logpass" autocomplete="off">
|
||||
<i class="input-icon uil uil-lock-alt"></i>
|
||||
</div>
|
||||
<button class="btn mt-4">submit</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@include('components/foother')
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,46 @@
|
||||
@layout('layouts/main')
|
||||
@set('title', 'Login')
|
||||
|
||||
@section('body')
|
||||
|
||||
<div class="flex min-h-full flex-col justify-center px-6 py-12 lg:px-8">
|
||||
<div class="sm:mx-auto sm:w-full sm:max-w-sm">
|
||||
<img class="mx-auto h-10 w-auto" src="/favicon.ico">
|
||||
<h2 class="mt-10 text-center text-2xl font-bold leading-9 tracking-tight">Sign in to your account</h2>
|
||||
</div>
|
||||
|
||||
<div class="mt-10 sm:mx-auto sm:w-full sm:max-w-sm">
|
||||
|
||||
@component('components/form/form', {
|
||||
'action': '',
|
||||
'method': 'post',
|
||||
})
|
||||
@!component('components/form/field', {
|
||||
'label': 'E-mail :',
|
||||
'name': 'email',
|
||||
'type': 'email',
|
||||
'required': true,
|
||||
'placeholder': 'exemple@mail.com',
|
||||
})
|
||||
@!component('components/form/field', {
|
||||
'label': 'Mot de passe :',
|
||||
'name': 'password',
|
||||
'type': 'password',
|
||||
'required': true,
|
||||
'placeholder': 'Votre mot de passe',
|
||||
})
|
||||
@!component('components/form/button', {
|
||||
'type': 'submit',
|
||||
'text': 'Envoyer',
|
||||
'style': 'flex w-full justify-center rounded-md bg-indigo-600 px-3 py-1.5 text-sm font-semibold leading-6 text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600',
|
||||
})
|
||||
@end
|
||||
|
||||
<p class="mt-10 text-center text-sm text-gray-500">
|
||||
Not a member?
|
||||
<a href="{{ route('signup') }}" class="font-semibold leading-6 text-indigo-600 hover:text-indigo-500">Create your account</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@end
|
||||
@@ -0,0 +1,60 @@
|
||||
@layout('layouts/main')
|
||||
@set('title', 'Signup')
|
||||
|
||||
@section('body')
|
||||
|
||||
<div class="flex min-h-full flex-col justify-center px-6 py-12 lg:px-8">
|
||||
<div class="sm:mx-auto sm:w-full sm:max-w-sm">
|
||||
<img class="mx-auto h-10 w-auto" src="/favicon.ico">
|
||||
<h2 class="mt-10 text-center text-2xl font-bold leading-9 tracking-tight">Create your account</h2>
|
||||
</div>
|
||||
|
||||
<div class="mt-10 sm:mx-auto sm:w-full sm:max-w-sm">
|
||||
|
||||
@component('components/form/form', {
|
||||
'action': '',
|
||||
'method': 'post',
|
||||
})
|
||||
@!component('components/form/field', {
|
||||
'label': 'Pseudo :',
|
||||
'name': 'pseudo',
|
||||
'type': 'text',
|
||||
'required': true,
|
||||
'placeholder': 'Votre nom',
|
||||
})
|
||||
@!component('components/form/field', {
|
||||
'label': 'E-mail :',
|
||||
'name': 'email',
|
||||
'type': 'email',
|
||||
'required': true,
|
||||
'placeholder': 'exemple@mail.com',
|
||||
})
|
||||
@!component('components/form/field', {
|
||||
'label': 'Mot de passe :',
|
||||
'name': 'password',
|
||||
'type': 'password',
|
||||
'required': true,
|
||||
'placeholder': 'Votre mot de passe',
|
||||
})
|
||||
@!component('components/form/field', {
|
||||
'label': 'Confirmer le mot de passe :',
|
||||
'name': 'password_confirmation',
|
||||
'type': 'password',
|
||||
'required': true,
|
||||
'placeholder': 'Votre mot de passe',
|
||||
})
|
||||
@!component('components/form/button', {
|
||||
'type': 'submit',
|
||||
'text': 'Envoyer',
|
||||
'style': 'flex w-full justify-center rounded-md bg-indigo-600 px-3 py-1.5 text-sm font-semibold leading-6 text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600',
|
||||
})
|
||||
@end
|
||||
|
||||
<p class="mt-10 text-center text-sm text-gray-500">
|
||||
Not a member?
|
||||
<a href="{{ route('login') }}" class="font-semibold leading-6 text-indigo-600 hover:text-indigo-500">Sign in to your account</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@end
|
||||
@@ -1,52 +0,0 @@
|
||||
<footer id="footer" class="footer">
|
||||
<span class="copyrights">© <div id="year"></div> - Arthur Puechberty</span>
|
||||
<a href="{{ route('terms') }}" class="conditions_generale" target="_blank">Terms and Conditions</a>
|
||||
</footer>
|
||||
<script>
|
||||
var year = new Date().getFullYear();
|
||||
document.getElementById("year").innerHTML = year;
|
||||
|
||||
document.getElementById('myForm').addEventListener('submit', function(event) {
|
||||
var input = document.getElementById('myInput');
|
||||
if (input.value.trim() === '') {
|
||||
event.preventDefault(); // Empêche la soumission du formulaire
|
||||
} else {
|
||||
this.action = "https://www.google.fr/search";
|
||||
}
|
||||
});
|
||||
</script>
|
||||
<style>
|
||||
@import url('https://fonts.googleapis.com/css?family=Roboto:400,900');
|
||||
|
||||
.footer{
|
||||
font-family: 'Roboto', sans-serif;
|
||||
font-weight: 600;
|
||||
min-height: 100px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 50px;
|
||||
justify-content: space-between;
|
||||
padding: 0 100px;
|
||||
flex-wrap: wrap;
|
||||
background-color: rgb(50, 50, 50);
|
||||
}
|
||||
|
||||
.copyrights{
|
||||
padding-right: 20px;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.copyrights,
|
||||
#year {
|
||||
padding-right: 20px;
|
||||
color: #9aa0a6;
|
||||
display: inline;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.conditions_generale {
|
||||
text-decoration: none;
|
||||
font-weight: 600;
|
||||
color: #9aa0a6;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,12 @@
|
||||
<button
|
||||
id="{{ name }}"
|
||||
name="{{ name }}"
|
||||
type="{{ type ? type : 'submit' }}"
|
||||
@if(style)
|
||||
class="{{ style }}"
|
||||
@else
|
||||
class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50"
|
||||
@end
|
||||
>
|
||||
{{ text }}
|
||||
</button>
|
||||
@@ -0,0 +1,30 @@
|
||||
<div class="mb-4">
|
||||
<label for="{{ name }}" class="block text-gray-700 text-sm font-bold mb-2">{{ label }}</label>
|
||||
|
||||
@if(type === 'textarea')
|
||||
<textarea
|
||||
id="{{ name }}"
|
||||
name="{{ name }}"
|
||||
class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
|
||||
@if(required)
|
||||
required
|
||||
@end
|
||||
@if(rows)
|
||||
rows="{{ rows }}"
|
||||
@end
|
||||
></textarea>
|
||||
@else
|
||||
<input
|
||||
id="{{ name }}"
|
||||
name="{{ name }}"
|
||||
type="{{ type ? type : 'text' }}"
|
||||
class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
|
||||
@if(required)
|
||||
required
|
||||
@end
|
||||
@if(placeholder)
|
||||
placeholder="{{ placeholder }}"
|
||||
@end
|
||||
>
|
||||
@end
|
||||
</div>
|
||||
@@ -0,0 +1,4 @@
|
||||
<form method="{{ method }}" action="{{ action }}">
|
||||
@!component('components/flash')
|
||||
{{{ await $slots.main() }}}
|
||||
</form>
|
||||
@@ -0,0 +1,7 @@
|
||||
<li>
|
||||
<a href="{{ href }}" target="_blank">
|
||||
<div class="flex text-left items-center py-5 pl-5 my-3 w-full bg-gray-300 text-gray-600 rounded-lg font-bold hover:bg-gray-700 hover:text-gray-400 transition duration-300 ease-in-out">
|
||||
<img src="{{ img }}" alt="Logo" class="w-16 pr-4">{{ title }}
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
@@ -0,0 +1,3 @@
|
||||
<div class="h-72 w-72 m-1 transition-transform border-2 border-black rounded-xl hover:scale-125 overflow-hidden duration-500 bg-white hover:z-10">
|
||||
<a href="{{ href }}" target="_blank"><img src="{{ img }}" alt="Logo"></a>
|
||||
</div>
|
||||
@@ -0,0 +1,139 @@
|
||||
<div x-data="{ depli: false }">
|
||||
<button @click="depli = !depli" class="cursor-pointer rounded-full bg-none p-1.5 focus:ring-2 focus:ring-white">
|
||||
<span class="flex items-center">
|
||||
<svg x-cloak x-bind:class="localStorage.theme === 'dark' ? '' : 'hidden'" viewBox="0 0 24 24" fill="none"
|
||||
class="w-6 h-6">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd"
|
||||
d="M17.715 15.15A6.5 6.5 0 0 1 9 6.035C6.106 6.922 4 9.645 4 12.867c0 3.94 3.153 7.136 7.042 7.136 3.101 0 5.734-2.032 6.673-4.853Z"
|
||||
class="fill-sky-400/20"></path>
|
||||
<path
|
||||
d="m17.715 15.15.95.316a1 1 0 0 0-1.445-1.185l.495.869ZM9 6.035l.846.534a1 1 0 0 0-1.14-1.49L9 6.035Zm8.221 8.246a5.47 5.47 0 0 1-2.72.718v2a7.47 7.47 0 0 0 3.71-.98l-.99-1.738Zm-2.72.718A5.5 5.5 0 0 1 9 9.5H7a7.5 7.5 0 0 0 7.5 7.5v-2ZM9 9.5c0-1.079.31-2.082.845-2.93L8.153 5.5A7.47 7.47 0 0 0 7 9.5h2Zm-4 3.368C5 10.089 6.815 7.75 9.292 6.99L8.706 5.08C5.397 6.094 3 9.201 3 12.867h2Zm6.042 6.136C7.718 19.003 5 16.268 5 12.867H3c0 4.48 3.588 8.136 8.042 8.136v-2Zm5.725-4.17c-.81 2.433-3.074 4.17-5.725 4.17v2c3.552 0 6.553-2.327 7.622-5.537l-1.897-.632Z"
|
||||
class="fill-sky-500"></path>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd"
|
||||
d="M17 3a1 1 0 0 1 1 1 2 2 0 0 0 2 2 1 1 0 1 1 0 2 2 2 0 0 0-2 2 1 1 0 1 1-2 0 2 2 0 0 0-2-2 1 1 0 1 1 0-2 2 2 0 0 0 2-2 1 1 0 0 1 1-1Z"
|
||||
class="fill-sky-500"></path>
|
||||
</svg>
|
||||
<svg x-cloak x-bind:class="localStorage.theme === 'light' ? '' : 'hidden'" viewBox="0 0 24 24" fill="none"
|
||||
stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="w-6 h-6">
|
||||
<path d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" class="fill-sky-400/20 stroke-sky-500"></path>
|
||||
<path
|
||||
d="M12 4v1M17.66 6.344l-.828.828M20.005 12.004h-1M17.66 17.664l-.828-.828M12 20.01V19M6.34 17.664l.835-.836M3.995 12.004h1.01M6 6l.835.836"
|
||||
class="stroke-sky-500"></path>
|
||||
</svg>
|
||||
<svg x-cloak
|
||||
x-bind:class="localStorage.theme === 'systeme' && window.matchMedia('(prefers-color-scheme: dark)').matches ? '' : 'hidden'"
|
||||
viewBox="0 0 24 24" fill="none" class="w-6 h-6 mr-2">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd"
|
||||
d="M17.715 15.15A6.5 6.5 0 0 1 9 6.035C6.106 6.922 4 9.645 4 12.867c0 3.94 3.153 7.136 7.042 7.136 3.101 0 5.734-2.032 6.673-4.853Z"
|
||||
class="fill-transparent"></path>
|
||||
<path
|
||||
d="m17.715 15.15.95.316a1 1 0 0 0-1.445-1.185l.495.869ZM9 6.035l.846.534a1 1 0 0 0-1.14-1.49L9 6.035Zm8.221 8.246a5.47 5.47 0 0 1-2.72.718v2a7.47 7.47 0 0 0 3.71-.98l-.99-1.738Zm-2.72.718A5.5 5.5 0 0 1 9 9.5H7a7.5 7.5 0 0 0 7.5 7.5v-2ZM9 9.5c0-1.079.31-2.082.845-2.93L8.153 5.5A7.47 7.47 0 0 0 7 9.5h2Zm-4 3.368C5 10.089 6.815 7.75 9.292 6.99L8.706 5.08C5.397 6.094 3 9.201 3 12.867h2Zm6.042 6.136C7.718 19.003 5 16.268 5 12.867H3c0 4.48 3.588 8.136 8.042 8.136v-2Zm5.725-4.17c-.81 2.433-3.074 4.17-5.725 4.17v2c3.552 0 6.553-2.327 7.622-5.537l-1.897-.632Z"
|
||||
class="fill-slate-400 dark:fill-slate-500"></path>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd"
|
||||
d="M17 3a1 1 0 0 1 1 1 2 2 0 0 0 2 2 1 1 0 1 1 0 2 2 2 0 0 0-2 2 1 1 0 1 1-2 0 2 2 0 0 0-2-2 1 1 0 1 1 0-2 2 2 0 0 0 2-2 1 1 0 0 1 1-1Z"
|
||||
class="fill-slate-400 dark:fill-slate-500"></path>
|
||||
</svg>
|
||||
<svg x-cloak
|
||||
x-bind:class="localStorage.theme === 'systeme' && window.matchMedia('(prefers-color-scheme: dark)').matches !== true ? '' : 'hidden'"
|
||||
viewBox="0 0 24 24" fill="none" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
|
||||
class="w-6 h-6 mr-2">
|
||||
<path d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" class="stroke-slate-400 dark:stroke-slate-500"></path>
|
||||
<path
|
||||
d="M12 4v1M17.66 6.344l-.828.828M20.005 12.004h-1M17.66 17.664l-.828-.828M12 20.01V19M6.34 17.664l.835-.836M3.995 12.004h1.01M6 6l.835.836"
|
||||
class="stroke-slate-400 dark:stroke-slate-500"></path>
|
||||
</svg>
|
||||
</span>
|
||||
</button>
|
||||
<ul x-show="depli" @click.away="depli = false" x-cloak
|
||||
class="overflow-hidden absolute right-0 z-10 mt-1 rounded-md bg-white text-base shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none sm:text-sm"
|
||||
tabindex="-1" role="listbox" aria-labelledby="listbox-label" aria-activedescendant="listbox-option-3">
|
||||
|
||||
<li @click="
|
||||
depli = false;
|
||||
localStorage.theme = 'light';
|
||||
window.location.reload()"
|
||||
class="text-gray-900 relative cursor-default select-none py-2 pl-3 pr-9 hover:bg-gray-300" id="listbox-option-0"
|
||||
role="option">
|
||||
<div class="flex items-center">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
|
||||
class="w-6 h-6 mr-2">
|
||||
<path d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" class="stroke-slate-400 dark:stroke-slate-500"></path>
|
||||
<path
|
||||
d="M12 4v1M17.66 6.344l-.828.828M20.005 12.004h-1M17.66 17.664l-.828-.828M12 20.01V19M6.34 17.664l.835-.836M3.995 12.004h1.01M6 6l.835.836"
|
||||
class="stroke-slate-400 dark:stroke-slate-500"></path>
|
||||
</svg>
|
||||
<!-- Selected: "font-semibold", Not Selected: "font-normal" -->
|
||||
<span class="font-normal ml-3 block truncate">Light</span>
|
||||
</div>
|
||||
|
||||
<span x-bind:class="localStorage.theme === 'light' ? '' : 'hidden'"
|
||||
class="text-indigo-600 absolute inset-y-0 right-0 flex items-center pr-4">
|
||||
<svg class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
|
||||
<path fill-rule="evenodd"
|
||||
d="M16.704 4.153a.75.75 0 01.143 1.052l-8 10.5a.75.75 0 01-1.127.075l-4.5-4.5a.75.75 0 011.06-1.06l3.894 3.893 7.48-9.817a.75.75 0 011.05-.143z"
|
||||
clip-rule="evenodd" />
|
||||
</svg>
|
||||
</span>
|
||||
</li>
|
||||
|
||||
<li @click="
|
||||
depli = false;
|
||||
localStorage.theme = 'dark';
|
||||
window.location.reload()"
|
||||
class="text-gray-900 relative cursor-default select-none py-2 pl-3 pr-9 hover:bg-gray-300" id="listbox-option-0"
|
||||
role="option">
|
||||
<div class="flex items-center">
|
||||
<svg viewBox="0 0 24 24" fill="none" class="w-6 h-6 mr-2">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd"
|
||||
d="M17.715 15.15A6.5 6.5 0 0 1 9 6.035C6.106 6.922 4 9.645 4 12.867c0 3.94 3.153 7.136 7.042 7.136 3.101 0 5.734-2.032 6.673-4.853Z"
|
||||
class="fill-transparent"></path>
|
||||
<path
|
||||
d="m17.715 15.15.95.316a1 1 0 0 0-1.445-1.185l.495.869ZM9 6.035l.846.534a1 1 0 0 0-1.14-1.49L9 6.035Zm8.221 8.246a5.47 5.47 0 0 1-2.72.718v2a7.47 7.47 0 0 0 3.71-.98l-.99-1.738Zm-2.72.718A5.5 5.5 0 0 1 9 9.5H7a7.5 7.5 0 0 0 7.5 7.5v-2ZM9 9.5c0-1.079.31-2.082.845-2.93L8.153 5.5A7.47 7.47 0 0 0 7 9.5h2Zm-4 3.368C5 10.089 6.815 7.75 9.292 6.99L8.706 5.08C5.397 6.094 3 9.201 3 12.867h2Zm6.042 6.136C7.718 19.003 5 16.268 5 12.867H3c0 4.48 3.588 8.136 8.042 8.136v-2Zm5.725-4.17c-.81 2.433-3.074 4.17-5.725 4.17v2c3.552 0 6.553-2.327 7.622-5.537l-1.897-.632Z"
|
||||
class="fill-slate-400 dark:fill-slate-500"></path>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd"
|
||||
d="M17 3a1 1 0 0 1 1 1 2 2 0 0 0 2 2 1 1 0 1 1 0 2 2 2 0 0 0-2 2 1 1 0 1 1-2 0 2 2 0 0 0-2-2 1 1 0 1 1 0-2 2 2 0 0 0 2-2 1 1 0 0 1 1-1Z"
|
||||
class="fill-slate-400 dark:fill-slate-500"></path>
|
||||
</svg>
|
||||
|
||||
<!-- Selected: "font-semibold", Not Selected: "font-normal" -->
|
||||
<span class="font-normal ml-3 block truncate">Dark</span>
|
||||
</div>
|
||||
|
||||
<span x-bind:class="localStorage.theme === 'dark' ? '' : 'hidden'"
|
||||
class="text-indigo-600 absolute inset-y-0 right-0 flex items-center pr-4">
|
||||
<svg class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
|
||||
<path fill-rule="evenodd"
|
||||
d="M16.704 4.153a.75.75 0 01.143 1.052l-8 10.5a.75.75 0 01-1.127.075l-4.5-4.5a.75.75 0 011.06-1.06l3.894 3.893 7.48-9.817a.75.75 0 011.05-.143z"
|
||||
clip-rule="evenodd" />
|
||||
</svg>
|
||||
</span>
|
||||
</li>
|
||||
|
||||
<li @click="
|
||||
depli = false;
|
||||
localStorage.theme = 'systeme';
|
||||
window.location.reload()"
|
||||
class="text-gray-900 relative cursor-default select-none py-2 pl-3 pr-9 hover:bg-gray-300" id="listbox-option-0"
|
||||
role="option">
|
||||
<div class="flex items-center">
|
||||
<svg viewBox="0 0 24 24" fill="none" class="w-6 h-6 mr-2">
|
||||
<path d="M4 6a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v7a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6Z" stroke-width="2"
|
||||
stroke-linejoin="round" class="stroke-slate-400 dark:stroke-slate-500"></path>
|
||||
<path d="M14 15c0 3 2 5 2 5H8s2-2 2-5" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
|
||||
class="stroke-slate-400 dark:stroke-slate-500"></path>
|
||||
</svg>
|
||||
<!-- Selected: "font-semibold", Not Selected: "font-normal" -->
|
||||
<span class="font-normal ml-3 block truncate">Systeme</span>
|
||||
</div>
|
||||
|
||||
<span x-bind:class="localStorage.theme === 'systeme' ? '' : 'hidden'"
|
||||
class="text-indigo-600 absolute inset-y-0 right-0 flex items-center pr-4">
|
||||
<svg class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
|
||||
<path fill-rule="evenodd"
|
||||
d="M16.704 4.153a.75.75 0 01.143 1.052l-8 10.5a.75.75 0 01-1.127.075l-4.5-4.5a.75.75 0 011.06-1.06l3.894 3.893 7.48-9.817a.75.75 0 011.05-.143z"
|
||||
clip-rule="evenodd" />
|
||||
</svg>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -1,53 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<title>My account</title>
|
||||
@entryPointStyles('compte')
|
||||
@entryPointScripts('compte')
|
||||
</head>
|
||||
<body>
|
||||
<h1>Welcome {{ auth.user.pseudo }}</h1>
|
||||
|
||||
<a href="{{ route('home') }}">return to home page</a>
|
||||
|
||||
@!component('components/flash')
|
||||
|
||||
<ul>
|
||||
<h2>Here is your personal information:</h2>
|
||||
<li>pseudo : {{ auth.user.pseudo }}</li>
|
||||
<li>email : {{ auth.user.email }}</li>
|
||||
<li>created at : {{ auth.user.createdAt }}</li>
|
||||
</ul>
|
||||
|
||||
<ul>
|
||||
<h2>You can modify your personal information:</h2>
|
||||
<li>
|
||||
<form action="modifpseudo" method="post">
|
||||
<label for="pseudo">Pseudo</label>
|
||||
<input type="text" name="pseudo" placeholder="New pseudo">
|
||||
<button>Save</button>
|
||||
</form>
|
||||
</li>
|
||||
<li>
|
||||
<form action="modifemail" method="post">
|
||||
<label for="email">Email</label>
|
||||
<input type="email" name="email" placeholder="New email">
|
||||
<button>Save</button>
|
||||
</form>
|
||||
</li>
|
||||
</ul>
|
||||
<script>
|
||||
const body = document.querySelector("body");
|
||||
let darkmode = localStorage.getItem("dark-mode");
|
||||
|
||||
if(darkmode === "enabled"){
|
||||
body.classList.add("dark-mode-theme");
|
||||
} else {
|
||||
body.classList.remove("dark-mode-theme");
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1 +1,18 @@
|
||||
<p> It's a 404 </p>
|
||||
@layout('layouts/main')
|
||||
@set('title', 'Page not found')
|
||||
|
||||
@section('body')
|
||||
|
||||
<main class="grid min-h-screen place-items-center bg-white px-6 py-24 sm:py-32 lg:px-8">
|
||||
<div class="text-center">
|
||||
<p class="text-base font-semibold text-indigo-600">404</p>
|
||||
<h1 class="mt-4 text-3xl font-bold tracking-tight text-gray-900 sm:text-5xl">Page not found</h1>
|
||||
<p class="mt-6 text-base leading-7 text-gray-600">Sorry, we couldn’t find the page you’re looking for.</p>
|
||||
<div class="mt-10 flex items-center justify-center gap-x-6">
|
||||
<a href="#" class="rounded-md bg-indigo-600 px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">Go back home</a>
|
||||
<a href="#" class="text-sm font-semibold text-gray-900">Contact support <span aria-hidden="true">→</span></a>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
@end
|
||||
|
||||
@@ -0,0 +1,17 @@
|
||||
@layout('layouts/main')
|
||||
@set('title', 'Arthur - Portfolio')
|
||||
|
||||
@section('body')
|
||||
|
||||
@include('partials/nav')
|
||||
@include('partials/header')
|
||||
|
||||
<main>
|
||||
@include('partials/main/about')
|
||||
@include('partials/main/projects')
|
||||
@include('partials/main/contact')
|
||||
</main>
|
||||
|
||||
@include('partials/footer')
|
||||
|
||||
@end
|
||||
@@ -1,139 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="shortcut icon" href="/favicon.ico" />
|
||||
<title>Arthur</title>
|
||||
@entryPointStyles('index')
|
||||
@entryPointScripts('index')
|
||||
</head>
|
||||
<body>
|
||||
<nav id="nav" class="fixed-navbar nav-light">
|
||||
<ul class="nav-lien">
|
||||
<li><a href="#">Home</a></li>
|
||||
<li><a href="#about">About</a></li>
|
||||
<li><a href="#projects">Projects</a></li>
|
||||
<li><a href="#contact">Contact</a></li>
|
||||
</ul>
|
||||
<button class="btn_theme" id="toggle-btn">theme
|
||||
<p id="text">claire</p>
|
||||
</button>
|
||||
<ul class="nav-compte">
|
||||
@if(auth.user)
|
||||
<li>Welcome {{ auth.user.pseudo }}</li>
|
||||
<li><a href="{{ route('compte') }}">Compte</a></li>
|
||||
<li><a href="{{ route('logout') }}">Logout</a></li>
|
||||
@else
|
||||
<li><a href="{{ route('auth') }}">Login</a></li>
|
||||
<li><a href="{{ route('auth') }}">Signup</a></li>
|
||||
@end
|
||||
</ul>
|
||||
</nav>
|
||||
<nav class="mini-nav nav-light" id="mini-nav">
|
||||
<button class="depli-nav" id="depli-nav">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="35" height="35" viewBox="0 0 30 24">
|
||||
<rect width="30" height="4" rx="2" ry="2" fill="#000" />
|
||||
<rect y="10" width="20" height="4" rx="2" ry="2" fill="#000" />
|
||||
<rect y="20" width="25" height="4" rx="2" ry="2" fill="#000" />
|
||||
</svg>
|
||||
</button>
|
||||
<img src="/logo.png" alt="">
|
||||
</nav>
|
||||
<script>
|
||||
const toggleBtn = document.getElementById("depli-nav");
|
||||
const nav = document.getElementById("nav");
|
||||
let toggle = "False";
|
||||
|
||||
toggleBtn.onclick = function(){
|
||||
if(toggle === "False") {
|
||||
nav.style.display = "flex";
|
||||
toggle = "True";
|
||||
} else {
|
||||
nav.style.display = "none";
|
||||
toggle = "False";
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<main>
|
||||
<div class="main-left">
|
||||
<h1>Hi! 👋🏻<br>I'm Arthur.</h1>
|
||||
<h2>Founder</h2>
|
||||
|
||||
<div class="barre-verticale">
|
||||
<p>I am a young Frenchman with a passion for development, I am a self-taught learner and my creativity knows no limits. Every pixel I edit tells a story. Passionate about transforming ideas into visually captivating experiences, I create projects that push the boundaries of design innovation.</p>
|
||||
</div>
|
||||
|
||||
<p class="citation">"In the middle of every difficulty lies opportunity."</p>
|
||||
<p class="citation-auth">Albert Einstein</p>
|
||||
|
||||
<ul class="div-lien">
|
||||
<a href="https://www.instagram.com/arthur.pbty/" target="_blank"><div><img src="/logo insta.png" alt="Logo">Instagram</div></a>
|
||||
<a href="https://github.com/Tutur33" target="_blank"><div><img src="/logo github.png" alt="Logo">Github</div></a>
|
||||
<a href="https://discord.gg/HxgaA44CPh" target="_blank"><div><img src="/Logo Discord.png" alt="Logo">Discord</div></a>
|
||||
<a href="http://tuturp33.000webhostapp.com" target="_blank"><div><img src="/other.png" alt="Logo">Other...</div></a>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="main-right">
|
||||
<img src="/pp.jpg" alt="Profile picture" class="pp">
|
||||
</div>
|
||||
</main>
|
||||
<section id="about">
|
||||
<h2>About</h2>
|
||||
<p>Hi ! I'm Arthur, a passionate developer based in France. My journey in the world of development is an inspiring adventure. Every line of code I write is a step toward creating unique and engaging experiences. I am driven by the desire to bring ideas to life and shape them into innovative designs.</p>
|
||||
|
||||
<h3>My background</h3>
|
||||
<p>I gained experience in web development working on various projects, ranging from front-end to back-end. I have a deep command of languages like HTML, CSS, JavaScript, and have worked with modern frameworks like Adonis with Node.js.</p>
|
||||
|
||||
<h3>My philosophy</h3>
|
||||
<p>I firmly believe that every difficulty is an opportunity to create something new and exciting. My approach is to combine functionality and aesthetics to deliver exceptional user experiences.</p>
|
||||
|
||||
<h3>My skills</h3>
|
||||
<p>Web development, web design, application development, project management.</p>
|
||||
|
||||
<h3>My interests</h3>
|
||||
<p>Outside of development, I love exploring new places, photography, and reading books about technology and creativity. And go sailing!</p>
|
||||
|
||||
<h3>My vision</h3>
|
||||
<p>My visionMy goal is to continue to learn, innovate and inspire through my projects. I want to help create a better, more engaging web for everyone.</p>
|
||||
|
||||
<br>
|
||||
<p>Please feel free to contact me if you have any questions or would like to collaborate on an exciting project. You can reach me via [your email address] or follow me on social media using the links below.</p>
|
||||
</section>
|
||||
<section id="projects">
|
||||
<h2>Projects</h2>
|
||||
|
||||
<div class="all_projects">
|
||||
<div class="nups-project">
|
||||
<a href="{{ route('nups') }}" target="_blank"><img src="/project-nups.png" alt=""></a>
|
||||
</div>
|
||||
<div class="my-networks-project">
|
||||
<a href="{{ route('myNetwork') }}" target="_blank"><img src="/my-networks.jpg" alt=""></a>
|
||||
</div>
|
||||
<div class="journal-project">
|
||||
<a href="{{ route('journal') }}" target="_blank"><img src="/projects/journal/journal.avif" alt=""></a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section id="contact">
|
||||
<h2>Contact</h2>
|
||||
|
||||
<form class="formContact" action="envoyer.php" method="post">
|
||||
<label for="nom">Nom :</label>
|
||||
<input type="text" id="nom" name="nom" required>
|
||||
<br>
|
||||
|
||||
<label for="email">E-mail :</label>
|
||||
<input type="email" id="email" name="email" required>
|
||||
<br>
|
||||
|
||||
<label for="message">Message :</label>
|
||||
<textarea id="message" name="message" rows="4" required></textarea>
|
||||
<br>
|
||||
|
||||
<input type="submit" value="Envoyer">
|
||||
</form>
|
||||
</section>
|
||||
@include('components/foother')
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,14 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<title>{{ title }}</title>
|
||||
@entryPointStyles('app')
|
||||
@entryPointScripts('app')
|
||||
</head>
|
||||
<body class="bg-gray-100 dark:bg-slate-900 text-slate-900 dark:text-white">
|
||||
@!section('body')
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,22 @@
|
||||
<footer
|
||||
id="footer"
|
||||
class="font-semibold min-h-100 flex items-center mt-16 justify-between px-20 bg-gray-800 text-gray-400 px- h-28">
|
||||
<span>© <span id="year"></span> - Arthur Puechberty</span>
|
||||
|
||||
<a href="{{ route('terms') }}" target="_blank">Terms and Conditions</a>
|
||||
</footer>
|
||||
|
||||
|
||||
<script>
|
||||
var year = new Date().getFullYear();
|
||||
document.getElementById("year").innerHTML = year;
|
||||
|
||||
document.getElementById('myForm').addEventListener('submit', function(event) {
|
||||
var input = document.getElementById('myInput');
|
||||
if (input.value.trim() === '') {
|
||||
event.preventDefault();
|
||||
} else {
|
||||
this.action = "https://www.google.fr/search";
|
||||
}
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,43 @@
|
||||
<header class="flex mt-36 mx-24 mb-24">
|
||||
<div class="mr-10">
|
||||
<h1 class="text-4xl font-bold mb-3">Hi! 👋🏻<br>I'm Arthur.</h1>
|
||||
<h2 class="text-2xl font-bold mb-3">Founder</h2>
|
||||
|
||||
<div class="pl-4 mb-3 border-l-8 border-solid border-gray-400">
|
||||
<p>I am a young Frenchman with a passion for development, I am a self-taught learner and my creativity knows no
|
||||
limits. Every pixel I edit tells a story. Passionate about transforming ideas into visually captivating
|
||||
experiences, I create projects that push the boundaries of design innovation.</p>
|
||||
</div>
|
||||
|
||||
<p class="italic text-gray-600">"In the middle of every difficulty lies opportunity."</p>
|
||||
<p class="italic text-gray-600 mb-10">Albert Einstein</p>
|
||||
|
||||
<ul>
|
||||
@!component('components/list_lien', {
|
||||
href: 'https://www.instagram.com/arthur.pbty/',
|
||||
img: '/logo insta.png',
|
||||
title: 'Instagram',
|
||||
})
|
||||
@!component('components/list_lien', {
|
||||
href: 'https://github.com/Tutur33',
|
||||
img: '/logo github.png',
|
||||
title: 'Github',
|
||||
})
|
||||
@!component('components/list_lien', {
|
||||
href: 'https://discord.gg/HxgaA44CPh',
|
||||
img: '/Logo Discord.png',
|
||||
title: 'Discord',
|
||||
})
|
||||
@!component('components/list_lien', {
|
||||
href: 'http://tuturp33.000webhostapp.com',
|
||||
img: '/other.png',
|
||||
title: 'Other...',
|
||||
})
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="ml-10 md:block hidden">
|
||||
<img src="/pp.jpg" alt="Profile picture" class="w-full max-w-5xl rounded-full">
|
||||
</div>
|
||||
</main>
|
||||
</header>
|
||||
@@ -0,0 +1,21 @@
|
||||
<section id="about" class="pt-32 mx-24 mb-24">
|
||||
<h2 class="text-2xl font-bold mb-10">About</h2>
|
||||
<p>Hi ! I'm Arthur, a passionate developer based in France. My journey in the world of development is an inspiring adventure. Every line of code I write is a step toward creating unique and engaging experiences. I am driven by the desire to bring ideas to life and shape them into innovative designs.</p>
|
||||
|
||||
<h3 class="text-xl font-semibold mt-3">My background</h3>
|
||||
<p>I gained experience in web development working on various projects, ranging from front-end to back-end. I have a deep command of languages like HTML, CSS, JavaScript, and have worked with modern frameworks like Adonis with Node.js.</p>
|
||||
|
||||
<h3 class="text-xl font-semibold mt-3">My philosophy</h3>
|
||||
<p>I firmly believe that every difficulty is an opportunity to create something new and exciting. My approach is to combine functionality and aesthetics to deliver exceptional user experiences.</p>
|
||||
|
||||
<h3 class="text-xl font-semibold mt-3">My skills</h3>
|
||||
<p>Web development, web design, application development, project management.</p>
|
||||
|
||||
<h3 class="text-xl font-semibold mt-3">My interests</h3>
|
||||
<p>Outside of development, I love exploring new places, photography, and reading books about technology and creativity. And go sailing!</p>
|
||||
|
||||
<h3 class="text-xl font-semibold mt-3">My vision</h3>
|
||||
<p>My visionMy goal is to continue to learn, innovate and inspire through my projects. I want to help create a better, more engaging web for everyone.</p>
|
||||
|
||||
<p class="mt-9">Please feel free to contact me if you have any questions or would like to collaborate on an exciting project. You can reach me via [your email address] or follow me on social media using the links below.</p>
|
||||
</section>
|
||||
@@ -0,0 +1,35 @@
|
||||
<section id="contact" class="pt-32 mx-24 mb-24">
|
||||
<h2 class="text-2xl font-bold mb-10">Contact</h2>
|
||||
|
||||
@component('components/form/form', {
|
||||
'action': '#',
|
||||
'method': 'post',
|
||||
})
|
||||
@!component('components/form/field', {
|
||||
'label': 'Nom :',
|
||||
'name': 'nom',
|
||||
'type': 'text',
|
||||
'required': true,
|
||||
'placeholder': 'Votre nom',
|
||||
})
|
||||
@!component('components/form/field', {
|
||||
'label': 'E-mail :',
|
||||
'name': 'email',
|
||||
'type': 'email',
|
||||
'required': true,
|
||||
'placeholder': 'prenom.nom@mail.com',
|
||||
})
|
||||
@!component('components/form/field', {
|
||||
'label': 'Message :',
|
||||
'name': 'message',
|
||||
'type': 'textarea',
|
||||
'rows': 4,
|
||||
'required': true,
|
||||
})
|
||||
@!component('components/form/button', {
|
||||
'type': 'submit',
|
||||
'text': 'Envoyer',
|
||||
})
|
||||
@end
|
||||
|
||||
</section>
|
||||
@@ -0,0 +1,18 @@
|
||||
<section id="projects" class="pt-32 mx-24 mb-24">
|
||||
<h2 class="text-2xl font-bold mb-10">Projects</h2>
|
||||
|
||||
<div class="flex flex-wrap justify-center">
|
||||
@!component('components/project', {
|
||||
'href': '#',
|
||||
'img': '/projects/project-nups.png',
|
||||
})
|
||||
@!component('components/project', {
|
||||
'href': '#',
|
||||
'img': '/projects/my-networks.jpg',
|
||||
})
|
||||
@!component('components/project', {
|
||||
'href': '#',
|
||||
'img': '/projects/journal.avif',
|
||||
})
|
||||
</div>
|
||||
</section>
|
||||
@@ -0,0 +1,79 @@
|
||||
<nav
|
||||
x-data="{ mobileMenuOpen: false, profileMenuOpen: false }"
|
||||
class="bg-gray-800 fixed top-0 left-0 w-full z-50"
|
||||
>
|
||||
<div class="mx-auto max-w-7xl px-2 sm:px-6 lg:px-8">
|
||||
<div class="relative flex h-16 items-center justify-between">
|
||||
<!-- Mobile menu button-->
|
||||
<div class="absolute inset-y-0 left-0 flex items-center sm:hidden">
|
||||
<button
|
||||
@click="mobileMenuOpen = !mobileMenuOpen"
|
||||
type="button"
|
||||
class="relative inline-flex items-center justify-center rounded-md p-2 text-gray-400 hover:bg-gray-700 hover:text-white focus:outline-none focus:ring-2 focus:ring-inset focus:ring-white"
|
||||
>
|
||||
<!-- Mobile menu close -->
|
||||
<svg x-show="!mobileMenuOpen" class="block h-6 w-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5" />
|
||||
</svg>
|
||||
<!-- Mobile menu open -->
|
||||
<svg x-show="mobileMenuOpen" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-1 items-center justify-center sm:items-stretch sm:justify-start">
|
||||
<div class="flex flex-shrink-0 items-center">
|
||||
<img class="h-8 w-auto" src="/favicon.ico">
|
||||
</div>
|
||||
<div class="hidden sm:ml-6 sm:block">
|
||||
<div class="flex space-x-4">
|
||||
<!-- Current: "bg-gray-900 text-white", Default: "text-gray-300 hover:bg-gray-700 hover:text-white" -->
|
||||
<a href="#" class="bg-gray-900 text-white rounded-md px-3 py-2 text-sm font-medium">Accueil</a>
|
||||
<a href="#about" class="text-gray-300 hover:bg-gray-700 hover:text-white rounded-md px-3 py-2 text-sm font-medium transition duration-300">About</a>
|
||||
<a href="#projects" class="text-gray-300 hover:bg-gray-700 hover:text-white rounded-md px-3 py-2 text-sm font-medium transition duration-300">Projects</a>
|
||||
<a href="#contact" class="text-gray-300 hover:bg-gray-700 hover:text-white rounded-md px-3 py-2 text-sm font-medium transition duration-300">Contact</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="absolute inset-y-0 right-0 flex items-center pr-2 sm:static sm:inset-auto sm:ml-6 sm:pr-0">
|
||||
@!component('components/select_theme')
|
||||
|
||||
@if(auth.user)
|
||||
<!-- Profile dropdown -->
|
||||
<div @click="profileMenuOpen = !profileMenuOpen" class="relative ml-3">
|
||||
<div>
|
||||
<button type="button" class="relative flex rounded-full bg-gray-800 text-sm focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-gray-800" id="user-menu-button" aria-expanded="false" aria-haspopup="true">
|
||||
<span class="absolute -inset-1.5"></span>
|
||||
<span class="sr-only">Open user menu</span>
|
||||
<img class="h-8 w-8 rounded-full" src="/pp.jpg" alt="">
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Dropdown menu -->
|
||||
<div x-show="profileMenuOpen" @click.away="profileMenuOpen = false" x-cloak class="absolute right-0 z-10 mt-2 w-48 origin-top-right rounded-md bg-white py-1 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none" role="menu" aria-orientation="vertical" aria-labelledby="user-menu-button" tabindex="-1">
|
||||
<a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-200">Your Profile</a>
|
||||
<a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-200">Settings</a>
|
||||
<a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-200">Sign out</a>
|
||||
</div>
|
||||
</div>
|
||||
@else
|
||||
{{ auth.user }}
|
||||
<a href="{{ route('login') }}">Login</a>
|
||||
<a href="{{ route('signup') }}">Signup</a>
|
||||
@end
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<!-- Mobile menu -->
|
||||
<div x-show="mobileMenuOpen" @click.away="mobileMenuOpen = false" x-cloak class="sm:hidden space-y-1 px-2 pb-3 pt-2" id="mobile-menu">
|
||||
<a href="#" class="bg-gray-900 text-white block rounded-md px-3 py-2 text-base font-medium" aria-current="page">Accueil</a>
|
||||
<a href="#about" class="text-gray-300 hover:bg-gray-700 hover:text-white block rounded-md px-3 py-2 text-base font-medium">About</a>
|
||||
<a href="#projects" class="text-gray-300 hover:bg-gray-700 hover:text-white block rounded-md px-3 py-2 text-base font-medium">Projects</a>
|
||||
<a href="#contact" class="text-gray-300 hover:bg-gray-700 hover:text-white block rounded-md px-3 py-2 text-base font-medium">Contact</a>
|
||||
</div>
|
||||
</nav>
|
||||
@@ -1,138 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="fr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script>
|
||||
<title>EMC</title>
|
||||
@entryPointStyles('journal')
|
||||
</head>
|
||||
<body>
|
||||
<section class="header">
|
||||
<div class="div_big_title" id="id_div_big_title">
|
||||
<h1 class="big_title">La liberté d'expression sur les réseaux sociaux</h1>
|
||||
<h2 class="sous_big_title">Y a-t-il une plus grande liberté d'expression sur les réseaux sociaux ?</h2>
|
||||
</div>
|
||||
<div class="div_btn">
|
||||
<a href="#" class="btn"><p class="txt_lien">Accueil</p></a>
|
||||
<a href="#1" class="btn"><p class="txt_lien">Définitions</p></a>
|
||||
<a href="#2" class="btn"><p class="txt_lien">Développement</p></a>
|
||||
<a href="#3" class="btn"><p class="txt_lien">Exemples</p></a>
|
||||
<a href="#carte" class="btn"><p class="txt_lien">Carte</p></a>
|
||||
<a href="#contact" class="btn"><p class="txt_lien">Nous contacter</p></a>
|
||||
</div>
|
||||
<div class="div_btn_2">
|
||||
<a href="#" class="btn"><p class="txt_lien">Accueil</p></a>
|
||||
<a href="#1" class="btn"><p class="txt_lien">Définitions</p></a>
|
||||
<a href="#2" class="btn"><p class="txt_lien">Développement</p></a>
|
||||
<a href="#3" class="btn"><p class="txt_lien">Exemples</p></a>
|
||||
<a href="#carte" class="btn"><p class="txt_lien">Carte</p></a>
|
||||
<a href="#contact" class="btn"><p class="txt_lien">Nous contacter</p></a>
|
||||
</div>
|
||||
</section>
|
||||
<script>
|
||||
$(function() {
|
||||
$('.div_btn').hide();
|
||||
});
|
||||
|
||||
$(window).scroll(function(){
|
||||
posScroll = $(document).scrollTop();
|
||||
if(posScroll >=id_div_big_title.clientHeight)
|
||||
$('.div_btn').show();
|
||||
else
|
||||
$('.div_btn').hide();
|
||||
});
|
||||
</script>
|
||||
<section class="sous_title" id="1">
|
||||
<h2>Quelques définitions qui vont vous servir !</h2>
|
||||
</section>
|
||||
<section class="corps">
|
||||
<div class="inter_corps">
|
||||
<img src="/projects/journal/app téléphone.jpg" alt="Image d'application sur un téléphone" class="img_1">
|
||||
<div class="definition">
|
||||
<div class="def_pv1_1">
|
||||
<p><b> - <span style="text-decoration: underline;">Réseaux sociaux</span> : </b> Un réseau social est un environnement numérique qui peut être un site et/ou une application qui permet de communiquer, partager, rencontrer des gens... Tout ça sous le respect des CGU.</p>
|
||||
</div>
|
||||
<div class="def_pv1_2">
|
||||
<b> - <span style="text-decoration: underline;">CGU</span> : </b> Conditions générales d'utilisation, elles servent à définir les règles du réseau. Actuellement il n'existe aucune législation spécifique aux réseaux sociaux, cependant ils sont considérés comme des espaces publics.</p>
|
||||
</div>
|
||||
<div class="def_pv1_3">
|
||||
<b> - <span style="text-decoration: underline;">Liberté d'expression</span> : </b> Tout citoyen a le droit de s'exprimer librement de la manière qu'il souhaite tant qu'il ne néglige aucune loi écrite dans la constitution.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="sous_title" id="2">
|
||||
<h2>Développement !</h2>
|
||||
</section>
|
||||
<section class="corps">
|
||||
<div class="inter_corps">
|
||||
<img src="/projects/journal/img développement réseaux.png" alt="Image de développement sur les réseaux" class="img_2">
|
||||
<div class="paver">
|
||||
<p class="id2_pv1">La liberté d'expression est un droit fondamental qui permet à chaque individu d'exprimer ses opinions, ses idées et ses pensées sans être censuré ou réprimandé. Avec l'avènement des réseaux sociaux, il est devenu plus facile que jamais pour les gens de s'exprimer publiquement et de partager leurs points de vue avec le monde entier.</p>
|
||||
<p class="id2_pv2">En théorie, les réseaux sociaux offrent une plus grande liberté d'expression que les canaux de communication traditionnels tels que les journaux, les magazines ou la télévision. Tout le monde peut créer un compte et publier du contenu, qu'il s'agisse de textes, de photos, de vidéos ou de commentaires. Les réseaux sociaux permettent également aux gens de se connecter avec des personnes partageant les mêmes idées, de former des communautés et de participer à des débats en ligne.</p>
|
||||
<p class="id2_pv3">Cependant, cette liberté d'expression sur les réseaux sociaux n'est pas absolue. Les plateformes ont des règles de modération pour limiter les contenus abusifs ou illégaux, comme la haine, la violence, le harcèlement ou la diffamation. Ces règles sont souvent critiquées pour être opaques ou biaisées, et pour entraîner une censure injustifiée de certains contenus.</p>
|
||||
<p class="id2_pv4">De plus, la liberté d'expression sur les réseaux sociaux peut être limitée par des facteurs externes tels que la pression sociale, les trolls, les bots et les fake news. Les gens peuvent être intimidés ou harcelés pour avoir exprimé leur opinion, ou être victimes de campagnes de désinformation visant à discréditer leurs points de vue.</p>
|
||||
<p class="id2_pv5">En fin de compte, la liberté d'expression sur les réseaux sociaux est un sujet complexe et controversé. Bien que les réseaux sociaux offrent un espace pour l'expression libre, cette liberté peut être compromise par des règles de modération, des pressions externes et des comportements abusifs. Il est important pour les utilisateurs de prendre des précautions lorsqu'ils s'expriment en ligne et de respecter les règles de chaque plateforme, tout en défendant leur droit à exprimer leurs opinions.</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="sous_title" id="3">
|
||||
<h2>Des exemples...</h2>
|
||||
</section>
|
||||
<section class="corps">
|
||||
<div class="inter_corps">
|
||||
<img src="/projects/journal/img exemple de liberter.jpeg" alt="Image d'exemple de liberter" class="img_3">
|
||||
<div class="paver">
|
||||
<p class="id3_pv1"><b> - 1 : </b> Les autorités en Iran ont bloqué l'accès à Instagram et WhatsApp suite à six jours de protestations contre la mort de Mahs Amini, une jeune femme de 22 ans, arrêtée par la police des moeurs.</p>
|
||||
<p class="id3_pv2"><b> - 2 : </b> Pendant une semaine, les internautes chinois ont pu discuter librement de sujets interdits sur le nouveau réseau social "Clubhouse" avant que la plateforme ne soit bloquée par Pékin. Les autorités chinoises ont imposé de nouvelles règles très strictes de censure sur internet. La chine censure beaucoup les réseaux sociaux en proposant une alternative de reproduction de site, cela leur permet de tout contrôler.</p>
|
||||
<p class="id3_pv3"><b> - 3 : </b>Deux auteurs de tweets homophobes ont été condamnés par la justice pour avoir prononcé des propos haineux visant <a href="https://www.paris.fr/pages/brossat-ian-2260" target="_bank">Ian BROSSAT</a>.</p>
|
||||
<p class="id3_pv4"><b> - 4 : </b>Une jeune femme de 19 ans a été menacée de mort sur Twitter par un homme de 20 ans. Le nom et l'addresse de la femme ont été divulgués sur Twitter, l'homme a été jugé en comparution immédiate et a écopé de 2 ans de prison avec sursis.</p>
|
||||
<p class="id3_pv5"><b> - 5 : </b>La journaliste <a href="https://fr.wikipedia.org/wiki/Nadia_Daam" target="_bank">Nadia Daam</a> a été victime d'un "raid numérique". C'est un harcèlement réalisé via les outils numériques, visant une ou un groupe de personnes et réalisé en meute, c'est à dire impliquant de manière concertée ou non de nombreux individus. Elle a été menacée de mort et de viol sur elle et sa fille. Certains auteurs de l'attaque ont été condamnés par la justice, notamment amende et prison avec sursis.</p>
|
||||
<p class="id3_pv6"><b> - 6 : </b>Twitter supprime le compte de <a href="https://fr.wikipedia.org/wiki/Donald_Trump" target="_bank">Donald Trump</a> pour tenter de limiter les risques d'incitation à la violence. </p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="sous_title" id="carte">
|
||||
<h2>Carte</h2>
|
||||
</section>
|
||||
<section class="corps">
|
||||
<div class="inter_corps">
|
||||
<img src="/projects/journal/carte.png" alt="Image d'une carte de la liberté d'expression sur internet" class="img_carte">
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="sous_title" id="contact">
|
||||
<h2>Nous contacter</h2>
|
||||
</section>
|
||||
<section class="corps">
|
||||
<div class="inter_corps_contact">
|
||||
<h2>Contact</h2>
|
||||
<p class="p_contact">Utilisez le formulaire ci-dessous pour poser des questions ou signaler des problèmes.</p>
|
||||
<form action="" method="post">
|
||||
<label for="name">Nom :</label>
|
||||
<input type="text" id="name" name="user_name" required>
|
||||
<label for="email">Email :</label>
|
||||
<input type="email" id="email" name="user_email" required>
|
||||
<label for="message">Message :</label>
|
||||
<textarea id="message" name="user_message" required></textarea>
|
||||
<input type="submit" value="Envoyer">
|
||||
</form>
|
||||
</div>
|
||||
</section>
|
||||
<footer id="footer" class="footer">
|
||||
<div class="footer2">
|
||||
<span class="sources"> Sources : <a href="https://www.avocat.fr/" target="_bank">Les avocats</a>, <a href="https://www.justifit.fr/" target="_bank">Justifit</a>, <a href="https://fr.wikipedia.org/wiki/Wikip%C3%A9dia:Accueil_principal" target="_bank">Wikipedia</a>, <a href="https://www.maisondesjournalistes.org/" target="_bank">La maison des journalistes</a>, <a href="https://www.economie.gouv.fr/recrutement/consultant-juridique" target="_bank">Consultant juridique</a>, <a href="https://freedomhouse.org/" target="_bank">Freedom House</a>, <a href="https://www.lefigaro.fr/" target="_bank">Le Figaro</a>, <a href="https://www.sudouest.fr/" target="_bank">Sud Ouest</a>, <a href="https://www.la-croix.com/?gclid=EAIaIQobChMI7s_q9ZXP_QIVvpBoCR1nrQQLEAAYASAAEgKUxfD_BwE" target="_bank">La Croix</a>, <a href="https://www.lemonde.fr/" target="_bank">Le Monde</a>, <a href="https://www.mediapart.fr/" target="_bank">Mediapart</a>, <a href="https://www.midilibre.fr/" target="_bank">Midi Libre</a></span>
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
<div class="footer1">
|
||||
<span class="copyrights">© 2023 - Arthur Puechberty</span>
|
||||
<a href="{{ route('terms') }}" target="_blank" class="conditions_generale">Conditions générales</a>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,71 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<title>Arthur Puechberty</title>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;500;600;700&display=swap" rel="stylesheet">
|
||||
@entryPointStyles('my-network-project')
|
||||
</head>
|
||||
<body>
|
||||
<section id="accueil" class="accueil">
|
||||
<img class="profil_img" src="/projects/myNetwork/arthur.png" alt="Photo de profil Arthur">
|
||||
<h1>Arthur</h1>
|
||||
<h2>Une grande passion : la voile ⛵️</h2>
|
||||
</section>
|
||||
<section class="liste_btn">
|
||||
<div classe="btn_1">
|
||||
<a href="https://www.instagram.com/arthur.pbty/" class="btn" target="_blank"><img class="lien_img"
|
||||
src="/projects/myNetwork/logo insta.png" alt="Logo Instagram">
|
||||
<p class="txt_lien">Instagram</p>
|
||||
</a>
|
||||
</div>
|
||||
<div classe="btn_2">
|
||||
<a href="https://discord.gg/HxgaA44CPh" class="btn" target="_blank"><img class="lien_img"
|
||||
src="/projects/myNetwork/Logo Discord.png" alt="Logo Discord">
|
||||
<p class="txt_lien">Discord</p>
|
||||
</a>
|
||||
</div>
|
||||
<div classe="btn_3">
|
||||
<a href="https://twitter.com/arthur_pbty" class="btn" target="_blank"><img class="lien_img"
|
||||
src="/projects/myNetwork/logo twitter.png" alt="Logo Twitter">
|
||||
<p class="txt_lien">Twitter</p>
|
||||
</a>
|
||||
</div>
|
||||
<div classe="btn_4">
|
||||
<a href="https://www.youtube.com/channel/UCILN2CPA-wPbBUFkgqVCb9A" class="btn" target="_blank"><img
|
||||
class="lien_img" src="/projects/myNetwork/Logo YouTube.png" alt="Logo YouTube">
|
||||
<p class="txt_lien">YouTube</p>
|
||||
</a>
|
||||
</div>
|
||||
<div classe="btn_5">
|
||||
<a href="https://www.facebook.com/profile.php?id=100081982581492" class="btn" target="_blank"><img
|
||||
class="lien_img" src="/projects/myNetwork/Logo Facebook.png" alt="Logo Facebook">
|
||||
<p class="txt_lien">Facebook</p>
|
||||
</a>
|
||||
</div>
|
||||
<div classe="btn_6">
|
||||
<a href="https://www.twitch.tv/tuturp33" class="btn" target="_blank"><img class="lien_img"
|
||||
src="/projects/myNetwork/Twitch logo.png" alt="Logo Twitch">
|
||||
<p class="txt_lien">Twitch</p>
|
||||
</a>
|
||||
</div>
|
||||
<div classe="btn_7">
|
||||
<a href="https://github.com/TuturP33" class="btn" target="_blank"><img class="lien_img"
|
||||
src="/projects/myNetwork/logo github.png" alt="Logo Github">
|
||||
<p class="txt_lien">Github</p>
|
||||
</a>
|
||||
</div>
|
||||
<div classe="btn_8">
|
||||
<a href="https://fr.namemc.com/profile/TuturP33.1" class="btn" target="_blank"><img class="lien_img"
|
||||
src="/projects/myNetwork/Logo Minecraft.png" alt="Logo Minecraft">
|
||||
<p class="txt_lien">Minecraft</p>
|
||||
</a>
|
||||
</div>
|
||||
</section>
|
||||
@include('components/foother')
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -1,95 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<title>Nups</title>
|
||||
@entryPointStyles('nups')
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
<section class="section_gauche">
|
||||
<header>
|
||||
<div class="div_logo">
|
||||
<img class="logo" alt="Nups" src="/nups.png"/>
|
||||
</div>
|
||||
<form action="https://google.fr/search" method="GET" class="bar_recherche" id="myForm">
|
||||
<input type="text" placeholder="Recherche" name="q" id="myInput">
|
||||
<button type="submit">
|
||||
<img src="/loupe.png">
|
||||
</button>
|
||||
</form>
|
||||
<div class="liste_favori">
|
||||
<a href="https://nups.fr"><img src="/onedrive.svg"><p>Onedrive</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>2 favori :</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>3 favori :</p></a>
|
||||
</div>
|
||||
</header>
|
||||
<footer id="footer" class="footer">
|
||||
<span class="copyrights">© <div id="year"></div> - Arthur Puechberty</span>
|
||||
<a href="{{ route('terms') }}" class="conditions_generale" target="_blank">Condition générales</a>
|
||||
</footer>
|
||||
<script>
|
||||
var year = new Date().getFullYear();
|
||||
document.getElementById("year").innerHTML = year;
|
||||
|
||||
document.getElementById('myForm').addEventListener('submit', function(event) {
|
||||
var input = document.getElementById('myInput');
|
||||
if (input.value.trim() === '') {
|
||||
event.preventDefault(); // Empêche la soumission du formulaire
|
||||
} else {
|
||||
this.action = "https://www.google.fr/search";
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</section>
|
||||
<div class="separator"></div>
|
||||
<section class="section_droite">
|
||||
<nav>
|
||||
<a class="lien_nav" target="_blank" href="https://nups.fr">
|
||||
Theme
|
||||
</a>
|
||||
<a class="lien_nav" href="https://nups.fr" target="_blank">
|
||||
Paramettre
|
||||
</a>
|
||||
<a class="lien_nav" href="#">
|
||||
<img class="img_nav" src="/app.png"/>
|
||||
</a>
|
||||
<a class="lien_nav" href="https://nups.fr" target="_blank">
|
||||
<img class="img_nav img_compte" src="/unnamed.png"/>
|
||||
</a>
|
||||
</nav>
|
||||
<div class="liste_app">
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Compte</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Recherche</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Maps</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Actualités</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Mail</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Meet</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Contacts</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Drive</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Agenda</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Traduction</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Photos</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Nups</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Finance</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Docs</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Tableurs</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Slides</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Livres</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Hangouts</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Keep</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Jamboard</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Classroom</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Earth</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Enregistré</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Arts & Culture</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Ads</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Voyages</p></a>
|
||||
<a href="https://nups.fr"><img src="/unnamed.png"><p>Formulaires</p></a>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,113 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<title>Nups</title>
|
||||
@entryPointStyles('project-nups')
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<nav>
|
||||
<li>
|
||||
<img src="/logo.svg" class="logo">
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" data-text="Accueil">Accueil</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#explication">Explication</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#download">Télécharger</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#version_web">Version web</a>
|
||||
</li>
|
||||
</nav>
|
||||
<h1 class="big_title">Nups</h1>
|
||||
</header>
|
||||
|
||||
<section id="explication">
|
||||
<h1 class="titre_section">Explication</h1>
|
||||
<div class="explication_contenaire">
|
||||
<div class="partie_1">
|
||||
<img src="/arthur.jpg" class="image_parragraphe_1">
|
||||
<h2>Le créateur</h2>
|
||||
<p>Arthur Puechberty a décidé de créer ce logiciel le 13 juin 2023 à l'âge de 16 ans !
|
||||
Il a toujours rêvé de créer un logiciel regroupant tout. Le problème avec Internet
|
||||
est que dès que nous voulons faire quelque chose, il faut soit aller sur un site,
|
||||
soit utiliser un logiciel. De plus, en fonction de ce que vous voulez faire, il faut
|
||||
souvent accéder à des sites différents, mais ces sites ne communiquent généralement
|
||||
pas entre eux, ce qui peut poser des problèmes. Il fallait remédier à cela en créant
|
||||
Nups.</p>
|
||||
</div>
|
||||
<div class="space"></div>
|
||||
<div class="partie_2">
|
||||
<img src="/project-nups.png" class="image_parragraphe_2">
|
||||
<h2>Qu'est-ce que Nups</h2>
|
||||
<p>Nups est une société spécialisée dans les services en ligne tels que la recherche sur
|
||||
Internet, la messagerie (Nups mail), les cartes (Nups Maps), le partage de vidéos
|
||||
(Nups vidéo), le stockage en ligne (Nups stocke) et bien d'autres. Elle est également
|
||||
active dans la recherche et le développement de nouvelles technologies.</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="download">
|
||||
<h1 class="titre_section">Télécharger</h1>
|
||||
<div class="download_link">
|
||||
<button type="button" class="btn_download" onclick="telecharger_installer_windows()"><span>Télécharger pour Windows </span><img src="/icon windows.png" alt="" class="logo_download" /></button>
|
||||
<button type="button" class="btn_download" onclick="telecharger_installer_mac_os()"><span>Télécharger pour Mac OS </span><img src="/icon mac os.png" alt="" class="logo_download" /></button>
|
||||
<button type="button" class="btn_download" onclick="telecharger_installer_linux()"><span>Télécharger pour Linux </span><img src="/icon linux.png" alt="" class="logo_download" /></button>
|
||||
</div>
|
||||
<script>
|
||||
function telecharger_installer_windows() {
|
||||
var lien = document.createElement('a');
|
||||
lien.href = 'chemin/vers/le/fichier';
|
||||
lien.download = 'nups installer.exe';
|
||||
lien.click();
|
||||
}
|
||||
|
||||
function telecharger_installer_mac_os() {
|
||||
var lien = document.createElement('a');
|
||||
lien.href = 'chemin/vers/le/fichier';
|
||||
lien.download = 'nups installer.exe';
|
||||
lien.click();
|
||||
}
|
||||
|
||||
function telecharger_installer_linux() {
|
||||
var lien = document.createElement('a');
|
||||
lien.href = 'chemin/vers/le/fichier';
|
||||
lien.download = 'nups installer.exe';
|
||||
lien.click();
|
||||
}
|
||||
</script>
|
||||
</section>
|
||||
|
||||
<section id="version_web">
|
||||
<h1 class="titre_section">Version web</h1>
|
||||
<p>Si vous ne voulez pas télécharger notre logiciel, vous pouvez toujours acceder a la version web. Sur cette version il vous suffi de vous connecter comme sur le logiciel et vous pourrez acceder a nos service.</p>
|
||||
<div class="btn_version_web_contenaire">
|
||||
<button type="button" class="btn_version_web" onclick="window.location.href='{{ route('nups-web') }}'">Acceder a la version web</button>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="autre">
|
||||
<h1 class="titre_section">Autre</h1>
|
||||
<p>Nous avons aussi un serveur discord !</p>
|
||||
</section>
|
||||
@include('components/foother')
|
||||
<script>
|
||||
const body = document.querySelector("body");
|
||||
let darkmode = localStorage.getItem("dark-mode");
|
||||
|
||||
if(darkmode === "enabled"){
|
||||
body.classList.add("dark-mode-theme");
|
||||
} else {
|
||||
body.classList.remove("dark-mode-theme");
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
+109
-77
@@ -1,90 +1,122 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<title>Terms and Conditions</title>
|
||||
@entryPointStyles('terms')
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
<h1>Nups Terms and Conditions</h1>
|
||||
<p>Effective Date: Saturday, June 17, 2023</p>
|
||||
<p>Thank you for using Nups services! These Terms and Conditions govern your use of our services. Please read them carefully.</p>
|
||||
|
||||
<h2>Acceptance of Terms and Conditions</h2>
|
||||
<p>1.1 Acceptance of Terms. By using Nups services, you agree to be bound by these Terms and Conditions. If you do not accept these Terms, you cannot use our services.</p>
|
||||
@layout('layouts/main')
|
||||
@set('title', 'Terms and Conditions')
|
||||
|
||||
<h2>Use of Our Services</h2>
|
||||
<p>2.1 User Account. To use certain Nups services, you will need to create a user account. You are responsible for the confidentiality of your login credentials and all activities related to your account.</p>
|
||||
<p>2.2 Authorized Use. You agree to use Nups services in accordance with these Terms and Conditions and all applicable laws. You may not use our services in a way that could infringe on Nups' rights or the rights of others.</p>
|
||||
<p>2.3 Usage Restrictions. You agree not to access Nups services in an unauthorized manner, attempt to gain unauthorized access to accounts or computer systems, and not to disrupt or harm Nups services.</p>
|
||||
@section('body')
|
||||
|
||||
<h2>User Content</h2>
|
||||
<p>3.1 Content Ownership. You retain ownership of any content you submit, post, or display on Nups services. By submitting, posting, or displaying content, you grant Nups a worldwide, non-exclusive, transferable, free, and royalty-free license to use, reproduce, modify, adapt, publish, translate, distribute, display, and create derivative works from that content.</p>
|
||||
<p>3.2 Content Responsibility. You are responsible for the content you submit, post, or display on Nups services. You warrant that you have all necessary rights to publish this content, and it does not violate the rights of others.</p>
|
||||
<p>3.3 Respect for Intellectual Property Rights. You agree not to violate the intellectual property rights of Nups or third parties when using Nups services. You may not copy, modify, distribute, or access copyrighted content or other intellectual property items without authorization.</p>
|
||||
<main class="mx-24 my-20">
|
||||
<h1 class="text-4xl font-bold my-10">Nups Terms and Conditions</h1>
|
||||
<p class="mb-3">Effective Date: Saturday, June 17, 2023</p>
|
||||
<p class="mb-3">Thank you for using Nups services! These Terms and Conditions govern your use of our services. Please
|
||||
read them carefully.</p>
|
||||
|
||||
<h2>Intellectual Property</h2>
|
||||
<p>4.1 Nups' Intellectual Property Rights. All intellectual property rights related to Nups services (except user content) are owned by Nups. You do not acquire any ownership rights to Nups services or the content you access.</p>
|
||||
<p>4.2 Authorized Use. Subject to compliance with these Terms and Conditions, Nups grants you a limited, non-exclusive, revocable, non-transferable license to use Nups services for personal and non-commercial purposes.</p>
|
||||
<h2 class="text-2xl font-bold mt-8 mb-4">Acceptance of Terms and Conditions</h2>
|
||||
<p class="mb-3">1.1 Acceptance of Terms. By using Nups services, you agree to be bound by these Terms and Conditions.
|
||||
If you do not accept these Terms, you cannot use our services.</p>
|
||||
|
||||
<h2>Privacy</h2>
|
||||
<p>5.1 Data Collection. Nups collects and uses your information in accordance with its Privacy Policy. By using Nups services, you consent to the collection and use of your information as outlined in this policy.</p>
|
||||
<p>5.2 Cookies. Nups services may use cookies and similar technologies to facilitate your site usage and personalize your experience.</p>
|
||||
<p>5.3 Data Security. Nups implements appropriate security measures to protect your information from unauthorized access, disclosure, or misuse.</p>
|
||||
<h2 class="text-2xl font-bold mt-8 mb-4">Use of Our Services</h2>
|
||||
<p class="mb-3">2.1 User Account. To use certain Nups services, you will need to create a user account. You are
|
||||
responsible for the confidentiality of your login credentials and all activities related to your account.</p>
|
||||
<p class="mb-3">2.2 Authorized Use. You agree to use Nups services in accordance with these Terms and Conditions and
|
||||
all applicable laws. You may not use our services in a way that could infringe on Nups' rights or the rights of
|
||||
others.</p>
|
||||
<p class="mb-3">2.3 Usage Restrictions. You agree not to access Nups services in an unauthorized manner, attempt to
|
||||
gain unauthorized access to accounts or computer systems, and not to disrupt or harm Nups services.</p>
|
||||
|
||||
<h2>Changes to Services</h2>
|
||||
<p>6.1 Changes to Terms and Conditions. Nups reserves the right to modify these Terms and Conditions at any time. Changes take effect upon their publication on the Nups website. Your continued use of Nups services after such changes constitutes your acceptance of the amended Terms and Conditions.</p>
|
||||
<p>6.2 Changes to Services. Nups also reserves the right to modify, suspend, or temporarily or permanently terminate any aspect of its services, including access to certain features, without notice or liability to you. You acknowledge that Nups will not be liable to you or any third party for any changes, suspensions, or interruptions of its services.</p>
|
||||
<h2 class="text-2xl font-bold mt-8 mb-4">User Content</h2>
|
||||
<p class="mb-3">3.1 Content Ownership. You retain ownership of any content you submit, post, or display on Nups
|
||||
services. By submitting, posting, or displaying content, you grant Nups a worldwide, non-exclusive, transferable,
|
||||
free, and royalty-free license to use, reproduce, modify, adapt, publish, translate, distribute, display, and create
|
||||
derivative works from that content.</p>
|
||||
<p class="mb-3">3.2 Content Responsibility. You are responsible for the content you submit, post, or display on Nups
|
||||
services. You warrant that you have all necessary rights to publish this content, and it does not violate the rights
|
||||
of others.</p>
|
||||
<p class="mb-3">3.3 Respect for Intellectual Property Rights. You agree not to violate the intellectual property
|
||||
rights of Nups or third parties when using Nups services. You may not copy, modify, distribute, or access
|
||||
copyrighted content or other intellectual property items without authorization.</p>
|
||||
|
||||
<h2>Responsibilities and Limitations</h2>
|
||||
<p>7.1 Disclaimer of Warranties. Nups services are provided "as is" and "as available," without any warranties, express or implied. Nups does not guarantee the accuracy, completeness, reliability, or availability of the services. You use Nups services at your own risk.</p>
|
||||
<p>7.2 Limitation of Liability. To the fullest extent permitted by law, Nups will not be liable for direct, indirect, incidental, special, consequential, or punitive damages arising from your use or inability to use Nups services.</p>
|
||||
<h2 class="text-2xl font-bold mt-8 mb-4">Intellectual Property</h2>
|
||||
<p class="mb-3">4.1 Nups' Intellectual Property Rights. All intellectual property rights related to Nups services
|
||||
(except user content) are owned by Nups. You do not acquire any ownership rights to Nups services or the content you
|
||||
access.</p>
|
||||
<p class="mb-3">4.2 Authorized Use. Subject to compliance with these Terms and Conditions, Nups grants you a limited,
|
||||
non-exclusive, revocable, non-transferable license to use Nups services for personal and non-commercial purposes.
|
||||
</p>
|
||||
|
||||
<h2>Termination</h2>
|
||||
<p>8.1 Termination by You. You may terminate your user account and stop using Nups services at any time.</p>
|
||||
<p>8.2 Termination by Nups. Nups reserves the right to terminate your user account and terminate your use of the services, in whole or in part, if you violate these Terms and Conditions or if your use of the services is detrimental to Nups or other users.</p>
|
||||
<h2 class="text-2xl font-bold mt-8 mb-4">Privacy</h2>
|
||||
<p class="mb-3">5.1 Data Collection. Nups collects and uses your information in accordance with its Privacy Policy. By
|
||||
using Nups services, you consent to the collection and use of your information as outlined in this policy.</p>
|
||||
<p class="mb-3">5.2 Cookies. Nups services may use cookies and similar technologies to facilitate your site usage and
|
||||
personalize your experience.</p>
|
||||
<p class="mb-3">5.3 Data Security. Nups implements appropriate security measures to protect your information from
|
||||
unauthorized access, disclosure, or misuse.</p>
|
||||
|
||||
<h2>General Provisions</h2>
|
||||
<p>9.1 Entire Agreement. These Terms and Conditions constitute the entire agreement between you and Nups regarding the use of Nups services and supersede all prior or contemporaneous agreements between you and Nups.</p>
|
||||
<p>9.2 Applicable Law. These Terms and Conditions are governed and interpreted in accordance with the laws of the country where Nups is headquartered.</p>
|
||||
<p>9.3 Dispute Resolution. Any dispute arising from these Terms and Conditions shall be subject to the exclusive jurisdiction of the courts of the country where Nups is headquartered.</p>
|
||||
<p>9.4 Severability. If any provision of these Terms and Conditions is found to be invalid, illegal, or unenforceable by a competent court, such provision shall be modified to the minimum extent necessary to make it valid, legal, and enforceable, and the other provisions shall remain in full force.</p>
|
||||
<h2 class="text-2xl font-bold mt-8 mb-4">Changes to Services</h2>
|
||||
<p class="mb-3">6.1 Changes to Terms and Conditions. Nups reserves the right to modify these Terms and Conditions at
|
||||
any time. Changes take effect upon their publication on the Nups website. Your continued use of Nups services after
|
||||
such changes constitutes your acceptance of the amended Terms and Conditions.</p>
|
||||
<p class="mb-3">6.2 Changes to Services. Nups also reserves the right to modify, suspend, or temporarily or
|
||||
permanently terminate any aspect of its services, including access to certain features, without notice or liability
|
||||
to you. You acknowledge that Nups will not be liable to you or any third party for any changes, suspensions, or
|
||||
interruptions of its services.</p>
|
||||
|
||||
<h2>Communications</h2>
|
||||
<p>10.1 Nups Communications. By using Nups services, you consent to receive communications from Nups, including announcements, updates, promotional offers, and service-related messages.</p>
|
||||
<p>10.2 User Communications. If you choose to contact Nups, you agree that Nups may respond to you using the contact information you have provided.</p>
|
||||
<h2 class="text-2xl font-bold mt-8 mb-4">Responsibilities and Limitations</h2>
|
||||
<p class="mb-3">7.1 Disclaimer of Warranties. Nups services are provided "as is" and "as available," without any
|
||||
warranties, express or implied. Nups does not guarantee the accuracy, completeness, reliability, or availability of
|
||||
the services. You use Nups services at your own risk.</p>
|
||||
<p class="mb-3">7.2 Limitation of Liability. To the fullest extent permitted by law, Nups will not be liable for
|
||||
direct, indirect, incidental, special, consequential, or punitive damages arising from your use or inability to use
|
||||
Nups services.</p>
|
||||
|
||||
<h2>Indemnification</h2>
|
||||
<p>11.1 Indemnification. You agree to indemnify, defend, and hold Nups, its officers, directors, employees, agents, and representatives harmless from any claim, liability, loss, damage, cost, or expense, including reasonable attorney's fees, arising from your use of Nups services or your violation of these Terms and Conditions.</p>
|
||||
<h2 class="text-2xl font-bold mt-8 mb-4">Termination</h2>
|
||||
<p class="mb-3">8.1 Termination by You. You may terminate your user account and stop using Nups services at any time.
|
||||
</p>
|
||||
<p class="mb-3">8.2 Termination by Nups. Nups reserves the right to terminate your user account and terminate your use
|
||||
of the services, in whole or in part, if you violate these Terms and Conditions or if your use of the services is
|
||||
detrimental to Nups or other users.</p>
|
||||
|
||||
<h2>Copyright Infringement Notifications</h2>
|
||||
<p>12.1 Copyright Infringement Notifications. Nups respects the intellectual property rights of others. If you believe that any content available on Nups services violates your copyrights, please submit a copyright infringement notification in accordance with applicable law.</p>
|
||||
<h2 class="text-2xl font-bold mt-8 mb-4">General Provisions</h2>
|
||||
<p class="mb-3">9.1 Entire Agreement. These Terms and Conditions constitute the entire agreement between you and Nups
|
||||
regarding the use of Nups services and supersede all prior or contemporaneous agreements between you and Nups.</p>
|
||||
<p class="mb-3">9.2 Applicable Law. These Terms and Conditions are governed and interpreted in accordance with the
|
||||
laws of the country where Nups is headquartered.</p>
|
||||
<p class="mb-3">9.3 Dispute Resolution. Any dispute arising from these Terms and Conditions shall be subject to the
|
||||
exclusive jurisdiction of the courts of the country where Nups is headquartered.</p>
|
||||
<p class="mb-3">9.4 Severability. If any provision of these Terms and Conditions is found to be invalid, illegal, or
|
||||
unenforceable by a competent court, such provision shall be modified to the minimum extent necessary to make it
|
||||
valid, legal, and enforceable, and the other provisions shall remain in full force.</p>
|
||||
|
||||
<h2>Severability of Provisions</h2>
|
||||
<p>13.1 Severability of Provisions. If any provision of these Terms and Conditions is found invalid, illegal, or unenforceable by a competent court, such provision shall be modified to the minimum extent necessary to make it valid, legal, and enforceable, and the other provisions shall remain in full force.</p>
|
||||
|
||||
<h2>Language</h2>
|
||||
<p>14.1 Language of the Terms. In case of any discrepancy between the language versions of these Terms and Conditions, the French version shall prevail.</p>
|
||||
|
||||
<h2>Contact Us</h2>
|
||||
<p>15.1 Contact. If you have questions, concerns, or comments about these Terms and Conditions, please contact us at the following address:</p>
|
||||
<p>Nups Inc.<br>Address: [Address]<br>Email: [Email]<br>Phone: [Phone Number]</p>
|
||||
|
||||
<p>Thank you for reading our Terms and Conditions! We hope you enjoy using Nups services.</p>
|
||||
</main>
|
||||
<script>
|
||||
const body = document.querySelector("body");
|
||||
let darkmode = localStorage.getItem("dark-mode");
|
||||
<h2 class="text-2xl font-bold mt-8 mb-4">Communications</h2>
|
||||
<p class="mb-3">10.1 Nups Communications. By using Nups services, you consent to receive communications from Nups,
|
||||
including announcements, updates, promotional offers, and service-related messages.</p>
|
||||
<p class="mb-3">10.2 User Communications. If you choose to contact Nups, you agree that Nups may respond to you using
|
||||
the contact information you have provided.</p>
|
||||
|
||||
if(darkmode === "enabled"){
|
||||
body.classList.add("dark-mode-theme");
|
||||
} else {
|
||||
body.classList.remove("dark-mode-theme");
|
||||
}
|
||||
</script>
|
||||
@include('components/foother')
|
||||
</body>
|
||||
</html>
|
||||
<h2 class="text-2xl font-bold mt-8 mb-4">Indemnification</h2>
|
||||
<p class="mb-3">11.1 Indemnification. You agree to indemnify, defend, and hold Nups, its officers, directors,
|
||||
employees, agents, and representatives harmless from any claim, liability, loss, damage, cost, or expense, including
|
||||
reasonable attorney's fees, arising from your use of Nups services or your violation of these Terms and Conditions.
|
||||
</p>
|
||||
|
||||
<h2 class="text-2xl font-bold mt-8 mb-4">Copyright Infringement Notifications</h2>
|
||||
<p class="mb-3">12.1 Copyright Infringement Notifications. Nups respects the intellectual property rights of others.
|
||||
If you believe that any content available on Nups services violates your copyrights, please submit a copyright
|
||||
infringement notification in accordance with applicable law.</p>
|
||||
|
||||
<h2 class="text-2xl font-bold mt-8 mb-4">Severability of Provisions</h2>
|
||||
<p class="mb-3">13.1 Severability of Provisions. If any provision of these Terms and Conditions is found invalid,
|
||||
illegal, or unenforceable by a competent court, such provision shall be modified to the minimum extent necessary to
|
||||
make it valid, legal, and enforceable, and the other provisions shall remain in full force.</p>
|
||||
|
||||
<h2 class="text-2xl font-bold mt-8 mb-4">Language</h2>
|
||||
<p class="mb-3">14.1 Language of the Terms. In case of any discrepancy between the language versions of these Terms
|
||||
and Conditions, the French version shall prevail.</p>
|
||||
|
||||
<h2 class="text-2xl font-bold mt-8 mb-4">Contact Us</h2>
|
||||
<p class="mb-3">15.1 Contact. If you have questions, concerns, or comments about these Terms and Conditions, please
|
||||
contact us at the following address:</p>
|
||||
<p class="mb-3">Nups Inc.<br>Address: [Address]<br>Email: [Email]<br>Phone: [Phone Number]</p>
|
||||
|
||||
<p class="mb-3">Thank you for reading our Terms and Conditions! We hope you enjoy using Nups services.</p>
|
||||
</main>
|
||||
|
||||
@end
|
||||
Reference in New Issue
Block a user