Skip to content
GitLab
Menu
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Menu
Open sidebar
Lockhome
LockHome
Commits
3c9a8096
Commit
3c9a8096
authored
Feb 21, 2020
by
LockhomeDevelopper
Browse files
Mise à jour du CSS terminée
parent
15afe14a
Changes
16
Hide whitespace changes
Inline
Side-by-side
application/views/accueil/accueil.php
View file @
3c9a8096
...
...
@@ -4,7 +4,6 @@
<head>
<meta
charset=
"utf-8"
>
<meta
name=
"viewport"
content=
"width=device-width, initial-scale=1.0"
>
<link
rel=
"stylesheet"
href=
"
<?=
base_url
(
"/static/accueil.css"
)
?>
"
>
<link
rel=
"stylesheet"
href=
"
<?=
base_url
(
"/static/commun.css"
)
?>
"
>
<link
rel=
"stylesheet"
href=
"
<?=
base_url
(
"/static/style_general_commun.css"
)
?>
"
>
<link
rel=
"stylesheet"
href=
"https://unicons.iconscout.com/release/v2.0.1/css/unicons.css"
>
...
...
application/views/camera/edit.php
View file @
3c9a8096
...
...
@@ -8,7 +8,6 @@
<title>
Edition caméra - LockHome
</title>
<link
rel=
"stylesheet"
type=
"text/css"
href=
"
<?=
base_url
(
"/static/style_general_commun.css"
)
?>
"
>
<link
rel=
"stylesheet"
type=
"text/css"
href=
"
<?=
base_url
(
"/static/commun.css"
)
?>
"
>
<link
rel=
"stylesheet"
type=
"text/css"
href=
"
<?=
base_url
(
"/static/camera_edition.css"
)
?>
"
>
<link
href=
"https://fonts.googleapis.com/css?family=Roboto:400,500,700&display=swap"
rel=
"stylesheet"
>
<link
rel=
"stylesheet"
href=
"https://unicons.iconscout.com/release/v2.0.1/css/unicons.css"
>
</head>
...
...
application/views/camera/list.php
View file @
3c9a8096
...
...
@@ -6,7 +6,6 @@
<meta
name=
"viewport"
content=
"width=device-width, initial-scale=1.0"
>
<meta
http-equiv=
"X-UA-Compatible"
content=
"ie=edge"
>
<title>
Caméras - LockHome
</title>
<link
rel=
"stylesheet"
href=
"
<?=
base_url
(
"/static/camera_liste.css"
)
?>
"
>
<link
rel=
"stylesheet"
href=
"
<?=
base_url
(
"/static/commun.css"
)
?>
"
>
<link
rel=
"stylesheet"
href=
"
<?=
base_url
(
"/static/style_general_commun.css"
)
?>
"
>
...
...
@@ -67,18 +66,20 @@
else
{
foreach
(
$cameras
as
$camera
){
?>
<a
href=
"
<?=
base_url
(
"/camera/view/"
.
$camera
->
id
)
?>
"
class=
"image_button_link"
>
<img
src=
"
<?=
base_url
(
"/camera/stream/
$camera->ip
/stream.mjpg"
)
?>
"
/>
<div
class=
"button l_r"
>
<div
class=
"left"
>
<i
class=
'uil uil-camera'
></i>
<p
class=
"title"
>
<?=
$camera
->
nom
?>
</p>
<div
class=
"bloc white_b"
>
<a
href=
"
<?=
base_url
(
"/camera/view/"
.
$camera
->
id
)
?>
"
class=
"container_bloc l_r black"
>
<img
src=
"
<?=
base_url
(
"/camera/stream/
$camera->ip
/stream.mjpg"
)
?>
"
/>
<div
class=
"container_bloc one_line_bloc l_r"
>
<div
class=
"left"
>
<i
class=
'uil uil-camera'
></i>
<p
class=
"title"
>
<?=
$camera
->
nom
?>
</p>
</div>
<div
class=
"right"
>
<i
class=
'uil uil-angle-right'
></i>
</div>
</div>
<div
class=
"right"
>
<i
class=
'uil uil-angle-right'
></i>
</div>
</div>
</a>
</a>
</div>
<?php
}}
}
?>
</div>
...
...
application/views/camera/view.php
View file @
3c9a8096
...
...
@@ -29,19 +29,21 @@
</header>
<main>
<div
class=
"container"
>
<section
class=
"guide"
>
<div
class=
"l_r"
>
<div
class=
"left blue"
>
<i
class=
'uil uil-comment-info-alt'
></i>
<p>
Guide d'utilisation de cette page
</p>
<section
class=
"bloc white_b black"
>
<div
class=
"container_bloc severals_lines_bloc"
>
<div
class=
"l_r"
>
<div
class=
"title_bloc left blue"
>
<i
class=
'uil uil-comment-info-alt'
></i>
<p>
Guide d'utilisation de cette page
</p>
</div>
<div
class=
"right"
><i
class=
'uil uil-angle-down'
></i></div>
</div>
<div
class=
"content_bloc"
>
<p
class=
"text"
>
Cette page vous permet de visualiser la caméra en temps réel ainsi que de visionner
les vidéos enregistrées lors d'une intrusion.
</p>
</div>
<div
class=
"right"
><i
class=
'uil uil-angle-down'
></i></div>
</div>
<div
class=
"info"
>
<p>
Cette page vous permet de visualiser la caméra en temps réel ainsi que de visionner
les vidéos enregistrées lors d'une intrusion.
</p>
</div>
</section>
...
...
application/views/capteur/edit.php
View file @
3c9a8096
...
...
@@ -7,7 +7,6 @@
<meta
http-equiv=
"X-UA-Compatible"
content=
"ie=edge"
>
<title>
Capteur - LockHome
</title>
<link
rel=
"stylesheet"
href=
"
<?=
base_url
(
"/static/commun.css"
)
?>
"
>
<link
rel=
"stylesheet"
href=
"
<?=
base_url
(
"/static/capteur_edition.css"
)
?>
"
>
<link
rel=
"stylesheet"
href=
"
<?=
base_url
(
"/static/style_general_commun.css"
)
?>
"
>
<link
href=
"https://fonts.googleapis.com/css?family=Roboto:400,500,700&display=swap"
rel=
"stylesheet"
>
...
...
application/views/capteur/list.php
View file @
3c9a8096
...
...
@@ -6,7 +6,6 @@
<meta
name=
"viewport"
content=
"width=device-width, initial-scale=1.0"
>
<meta
http-equiv=
"X-UA-Compatible"
content=
"ie=edge"
>
<title>
Gestion des capteurs - LockHome
</title>
<link
rel=
"stylesheet"
href=
"
<?=
base_url
(
"/static/capteur_liste.css"
)
?>
"
>
<link
rel=
"stylesheet"
href=
"
<?=
base_url
(
"/static/commun.css"
)
?>
"
>
<link
rel=
"stylesheet"
href=
"
<?=
base_url
(
"/static/style_general_commun.css"
)
?>
"
>
<link
href=
"https://fonts.googleapis.com/css?family=Roboto:400,500,700&display=swap"
rel=
"stylesheet"
>
...
...
application/views/profil/edit.php
View file @
3c9a8096
...
...
@@ -6,7 +6,6 @@
<meta
name=
"viewport"
content=
"width=device-width, initial-scale=1.0"
>
<meta
http-equiv=
"X-UA-Compatible"
content=
"ie=edge"
>
<title>
Profil - LockHome
</title>
<link
rel=
"stylesheet"
href=
"
<?=
base_url
(
"/static/profil_edition.css"
)
?>
"
>
<link
rel=
"stylesheet"
href=
"
<?=
base_url
(
"/static/commun.css"
)
?>
"
>
<link
rel=
"stylesheet"
href=
"
<?=
base_url
(
"/static/style_general_commun.css"
)
?>
"
>
<link
href=
"https://fonts.googleapis.com/css?family=Roboto:400,500,700&display=swap"
rel=
"stylesheet"
>
...
...
application/views/profil/list.php
View file @
3c9a8096
...
...
@@ -6,7 +6,6 @@
<meta
name=
"viewport"
content=
"width=device-width, initial-scale=1.0"
>
<meta
http-equiv=
"X-UA-Compatible"
content=
"ie=edge"
>
<title>
Gestion des profils - LockHome
</title>
<link
rel=
"stylesheet"
href=
"
<?=
base_url
(
"/static/profil_liste.css"
)
?>
"
>
<link
rel=
"stylesheet"
href=
"
<?=
base_url
(
"/static/commun.css"
)
?>
"
>
<link
rel=
"stylesheet"
href=
"
<?=
base_url
(
"/static/style_general_commun.css"
)
?>
"
>
<link
href=
"https://fonts.googleapis.com/css?family=Roboto:400,500,700&display=swap"
rel=
"stylesheet"
>
...
...
static/accueil.css
deleted
100755 → 0
View file @
15afe14a
.intrusion
{
color
:
white
;
border-radius
:
5px
;
}
.red_intrusion
{
flex-direction
:
column
;
background
:
#c62828
;
}
.green_intrusion
{
flex-direction
:
row
;
background
:
#27AE60
;
}
.intrusion
>
*
{
width
:
100%
;
}
.intrusion
.uil-shield-exclamation
{
font-size
:
28px
;
}
.intrusion
>
div
:nth-child
(
1
)
{
margin
:
15px
0px
;
}
.intrusion_detected
{
font-size
:
19px
;
display
:
flex
;
align-items
:
center
;
}
.detailIntrusion
{
margin-bottom
:
15px
;
}
a
.go_to_camera
{
padding
:
10px
0
;
background
:
rgba
(
255
,
255
,
255
,
0.1
);
transition
:
background
.3s
;
color
:
white
;
}
a
.go_to_camera
:hover
{
background
:
rgba
(
255
,
255
,
255
,
0.3
);
}
.maison
{
height
:
auto
;
background
:
#FFFFFF
;
border-radius
:
5px
;
box-shadow
:
0px
0px
2px
rgba
(
0
,
0
,
0
,
0.15
);
}
.maison
img
{
border-top-left-radius
:
5px
;
border-top-right-radius
:
5px
;
width
:
100%
;
height
:
200px
;
object-fit
:
cover
;
}
.maison
.maison_protege
{
margin-top
:
15px
;
margin-bottom
:
15px
;
}
.maison
.maison_protege
p
,
.maison
.maison_protege
i
{
font-size
:
26px
;
}
.maison
select
{
margin
:
auto
0
auto
0
;
height
:
25px
;
border-radius
:
5px
;
width
:
100px
;
}
.maison
.title
{
font-weight
:
bolder
;
margin-right
:
10px
;
}
.maison
.maison_profil
,
.maison
.maison_horaire
{
padding
:
15px
0
20px
15px
;
font-size
:
16px
;
}
.maison
.maison_profil
,
.maison
.maison_horaire
{
display
:
flex
;
}
/*************************************************************************/
@media
only
screen
and
(
min-width
:
1240px
)
{
.menu
{
display
:
flex
;
justify-content
:
space-between
;
}
.menu
{
flex-wrap
:
wrap
;
}
.menu
a
.simple_button_link
{
width
:
24%
;
}
}
\ No newline at end of file
static/camera_edition.css
deleted
100644 → 0
View file @
15afe14a
static/camera_liste.css
deleted
100644 → 0
View file @
15afe14a
static/capteur_edition.css
deleted
100644 → 0
View file @
15afe14a
static/capteur_liste.css
deleted
100755 → 0
View file @
15afe14a
static/commun.css
View file @
3c9a8096
...
...
@@ -56,158 +56,214 @@ Permet de disposer les éléments à gauche et à droite
}
/**************************************************************************
##### EXEMPLE SIMPLE LAYOUT #####
Permet de faire un bloc sans lien
<section class="simple_layout">
<div class="green_intrusion l_r">
<div class="left">
<i class='uil uil-shield-exclamation'></i>
<p>Votre texte</p>
</div>
</div>
</section>
*/
/*
section.simple_layout {
font-weight: 400;
color: white;
border-radius: 5px;
/* CLASSE A UTILISER POUR LES DIFFERENTS BLOC DU SITE */
.bloc
{
min-height
:
30px
;
box-shadow
:
0px
0px
2px
rgba
(
0
,
0
,
0
,
0.15
);
display: fle
x;
}
*/
border-radius
:
5p
x
;
}
.bloc
.content_bloc
.text
{
margin
:
auto
15px
auto
30px
;
padding-bottom
:
20px
;
}
/**************************************************************************
##### EXEMPLE SIMPLE LINK BUTTON #####
Permet de faire le cadre du bouton
.container_bloc
{
border-radius
:
5px
;
flex-direction
:
column
;
}
<a href="###" class="simple_button_link l_r">
<div class="left">
<i class='uil uil-plus-circle'></i>
<div class="title">Texte sur le bouton</div>
</div>
<div class="right">
<i class='uil uil-angle-right'></i>
</div>
</a>
*/
/*
a.simple_button_link {
.container_bloc
>
*
{
width
:
100%
;
}
.container_bloc.one_line_bloc
{
flex-direction
:
row
;
height
:
50px
;
color: black;
background: white;
border-radius: 5px;
box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.15);
}
.container_bloc.severals_lines_bloc
{
flex-direction
:
column
;
}
a
.container_bloc
{
transition
:
box-shadow
.3s
,
background
.3s
,
color
.3s
;
}
a.
simple_button_link
:hover
{
a
.
container_bloc
:hover
{
box-shadow
:
0px
0px
5px
rgba
(
0
,
0
,
0
,
0.2
);
}
main a.simple_button_link.red:hover {
background: #E62929;
color: #fff;
.container_bloc
.link_in_bloc
{
padding
:
10px
0
;
background
:
rgba
(
255
,
255
,
255
,
0.1
);
transition
:
background
.3s
;
}
*/
/***************************************************************************
##### EXEMPLE IMAGE LINK BUTTON #####
Permet de faire le cadre du bouton
<a href="####" class="image_button_link">
<img src="###" alt="###">
<div class="button l_r">
<div class="left">
<i class='uil uil-webcam'></i>
<p class="title">Text sur le bouton sous l'image</p>
</div>
<div class="right">
<i class='uil uil-angle-right'></i>
</div>
</div>
</a>
*/
/*
a.image_button_link {
margin-bottom: 15px;
height: auto;
width: 90%;
background: #FFFFFF;
border-radius: 5px;
box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.15);
color: #000;
.container_bloc
.link_in_bloc
:hover
{
background
:
rgba
(
255
,
255
,
255
,
0.3
);
}
a.image_button_link:hover {
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
.container_bloc
.title_bloc
{
margin
:
15px
0px
15px
0px
;
font-size
:
19px
;
}
a.image_button_link img {
display: block;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
width: 100%;
max-height: 450px;
.content_bloc
.content_title
{
font-weight
:
bold
;
margin-right
:
10px
;
}
.bloc
img
{
border-top-left-radius
:
5px
;
border-top-right-radius
:
5px
;
width
:
100%
;
height
:
200px
;
object-fit
:
cover
;
}
*/
/***************************************************************************
##### EXEMPLE INPUT #####
Permet de faire le cadre des inputs
.container_bloc
.spacing_bottom
{
margin-bottom
:
15px
;
}
<label for="NOM" class="input l_r">
<div class="left">
<i class='uil uil-processor'></i>
<input id="NOM" type="text" value="Porte d'entrée" />
</div>
</label>
*/
/*
main label.input {
height: 50px;
font-weight: 400;
color: black;
background: white;
.container_bloc
.spacing_left
{
margin-left
:
10px
;
}
.container_bloc
input
{
flex
:
1
;
outline
:
none
;
border
:
none
;
}
.timer_input_bloc
{
display
:
flex
;
justify-content
:
center
;
border
:
0
;
}
.timer_input_bloc
>
div
:nth-child
(
1
)
{
margin-right
:
15px
;
}
.timer_input_bloc
>
div
input
{
border
:
0
;
outline
:
none
;
border-radius
:
5px
;
box-shadow
:
0px
0px
2px
rgba
(
0
,
0
,
0
,
0.15
);
margin-bottom: 15px;
transition: box-shadow .3s;
cursor: pointer;
overflow: hidden;
padding
:
15px
;
}
main label .left {
width: calc(100% - 15px);
.timer_input_bloc
div
>
p
{
margin-bottom
:
10px
;
font-weight
:
bolder
;
}
main label.input input {
flex: 1;
padding: 0;
.bloc
.element
{
padding
:
15px
;
}
.container_bloc
.content_in_column
{
flex-direction
:
column
;
margin-left
:
15px
;
}
.container_bloc
.content_in_column
>
div
:nth-child
(
1
)
{
font-size
:
19px
;
display
:
flex
;
align-items
:
center
;
margin
:
15px
auto
;
}
.container_bloc
.selecteur_input
{
flex-shrink
:
0
;
border-radius
:
5px
;
padding
:
15px
;
border
:
0
;
outline
:
none
;
}
*/
.redHover
:hover
{
background-color
:
#c62828
;
color
:
white
;
}
main
.bottom
{
position
:
absolute
;
bottom
:
15px
;
width
:
90%
;
}
/***************************************************************************
##### EXEMPLE POSITIONNER UN BOUTON EN BAS #####
<a href="liste_capteur.html" class="simple_button_link l_r red bottom">
##### EXEMPLE COULEUR #####
Ajout des couleurs (utilisé pour nimporte quel composant)
<a href="###" class="simple_button_link l_r blue">
<div class="left">
<i class='uil uil-trash-alt'></i>
<div class="title">Supprimer ce capteur</div>
<i class='uil uil-plus-circle'></i>
<div class="title">Text</div>
</div>
<div class="right">
<i class='uil uil-angle-right'></i>
</div>
</a>
*/
main
.bottom
{
position
:
absolute
;
bottom
:
15px
;
width
:
90%
;
main
.red
,
.red
{
color
:
#c62828
;
}
main
.blue
,
.blue
{
color
:
#4C84FF
;
}
main
.black
,
.black
{
color
:
black
;
}
main
.green
,
.green
{
color
:
#27AE60
;
}
main
.orange
,
.orange
{
color
:
orange
;
}
main
.white
,
.white
{
color
:
white
;
}
.red_b
{
background-color
:
#c62828
;
}
.blue_b
{
background-color
:
#4C84FF
;
}
.black_b
{
background-color
:
black
;
}
.green_b
{
background-color
:
#27AE60
;
}
.orange_b
{
background-color
:
orange
;
}
.white_b
{
background-color
:
white
;
}
/***************************************************************************
##### EXEMPLE CHECKBOX #####
...
...
@@ -222,11 +278,6 @@ Mise en forme des checkbox
</label>
*/
main
.profil_capteur
{
cursor
:
pointer
;
padding
:
5px
;
}
input
[
type
=
"checkbox"
]
{
display
:
none
;
}
...
...
@@ -316,110 +367,6 @@ input[type="radio"].radio_input:checked+label {
border-radius
:
8px
;
}
/***************************************************************************
##### EXEMPLE COULEUR #####
Ajout des couleurs (utilisé pour nimporte quel composant)
<a href="###" class="simple_button_link l_r blue">
<div class="left">
<i class='uil uil-plus-circle'></i>
<div class="title">Text</div>
</div>
<div class="right">
<i class='uil uil-angle-right'></i>
</div>
</a>
*/
main
.red
,
.red
{
color
:
#c62828
;
}
main
.blue
,
.blue
{
color
:
#4C84FF
;
}
main
.black
,
.black
{
color
:
black
;
}
main
.green
,
.green
{
color
:
#27AE60
;
}
main
.orange
,
.orange
{
color
:
orange
;
}
main
.white
,