Compare commits
2 Commits
4ea38804a5
...
a9172b1b7a
Author | SHA1 | Date | |
---|---|---|---|
|
a9172b1b7a | ||
|
84f6aeb129 |
27
README.md
@ -1,24 +1,27 @@
|
|||||||
# Lightbox Remastered
|
# Lightbox Remastered
|
||||||
|
|
||||||
Ceci est un projet sur temps personnel traduisant ma réflexion sur le redesign des lightbox utilisés dans One et Neo. Le travail aboutit sur des maquettes faites main.
|
> This repository serve resources and examples for my [Behance portfolio](https://www.behance.net/gallery/117643605/Lightbox-Remastered).
|
||||||
|
|
||||||
Ce project est une maquette interactive visant à mieux définir le comportement de la boite en fonction de regles de redimentionnements prenant en compte la taille d'affichage ( *Viewport* ), et les éléments contenu dans celle-ci, et adressant les problèmes actuellement rencontré à cet égards. Il sert de support de présentation.
|
You are viewing the frame-only branch. This branch feature a wireframe version of this prototype.
|
||||||
|
|
||||||
## Galeries d'images
|
* [Interactive showcase](https://khosmon.gitlab.io/Lightbox-Remastered/wireframe/)
|
||||||
|
On Firefox, you can use the Adaptative View (`Ctrl / Cmd + Shift + M`) to resize it freely.
|
||||||
|
|
||||||

|
## Gallery
|
||||||
|
|
||||||

|

|
||||||
|
|
||||||

|

|
||||||
|
|
||||||

|

|
||||||
|
|
||||||

|

|
||||||
|
|
||||||

|

|
||||||
|
|
||||||
## Crédits
|

|
||||||
|
|
||||||
* Polices : Mozilla
|
## Credits
|
||||||
* Conception : Open Digital Education
|
|
||||||
|
* Fonts: Microsoft, Apple, Graig Rozynski, Purushoth Kumar Guttula
|
||||||
|
* Originals Design, Assets, Codes, Graphics: Open Digital Education
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
<head>
|
||||||
<link type="text/css" rel="stylesheet" href="./resize-lightbox-poc.css" />
|
<link type="text/css" rel="stylesheet" href="./main.css" />
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<title>Document</title>
|
<title>Document</title>
|
||||||
@ -14,9 +14,9 @@
|
|||||||
<div class=" "><span class="text-ph close-button">x</span></div>
|
<div class=" "><span class="text-ph close-button">x</span></div>
|
||||||
<div id="tabs-container">
|
<div id="tabs-container">
|
||||||
<span></span>
|
<span></span>
|
||||||
<span><a href="" class="text-ph">Onglet 1</a></span>
|
<span><a href="#" class="text-ph">Onglet 1</a></span>
|
||||||
<span><a href="" class="text-ph">Onglet 2</a></span>
|
<span><a href="#" class="text-ph">Onglet 2</a></span>
|
||||||
<span class="active"><a href="" class="text-ph">Onglet actif</a></span>
|
<span class="active"><a href="#" class="text-ph">Onglet actif</a></span>
|
||||||
<span></span>
|
<span></span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -27,9 +27,9 @@
|
|||||||
</div>
|
</div>
|
||||||
<div id="doc-file-viewmode">
|
<div id="doc-file-viewmode">
|
||||||
Vue :
|
Vue :
|
||||||
<a href="" class="active">Mosaïque</a>
|
<a href="#" class="active">Mosaïque</a>
|
||||||
<a href="">Grille</a>
|
<a href="#">Grille</a>
|
||||||
<a href="">Liste</a>
|
<a href="#">Liste</a>
|
||||||
</div>
|
</div>
|
||||||
<div id="doc-file-nav" class="list-nav scrollable ">
|
<div id="doc-file-nav" class="list-nav scrollable ">
|
||||||
<ul class="">
|
<ul class="">
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 20 KiB |
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 20 KiB |
Before Width: | Height: | Size: 18 KiB After Width: | Height: | Size: 18 KiB |
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 12 KiB |
Before Width: | Height: | Size: 16 KiB After Width: | Height: | Size: 16 KiB |
Before Width: | Height: | Size: 8.2 KiB After Width: | Height: | Size: 8.2 KiB |