Restore Maore Mobile website from Wayback Machine archive
- Add original CSS styling (maore.css) with complete branding and responsive design - Restore all original SVG icons and images from website dump - Replace Google Fonts with locally hosted Varela Round font family - Download clean JavaScript files (jQuery, Bootstrap, maore.js, utils.js) - Implement Hugo multilingual setup with French/English support - Create responsive homepage template matching original design - Add comprehensive translation files for both languages - Configure local asset paths to eliminate external dependencies - Set up proper navigation structure with all original menu items 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Kevin Bataille
571
static/css/maore.css
Normal file
571
static/css/maore.css
Normal file
@@ -0,0 +1,571 @@
|
||||
/* COMMON */
|
||||
html * {
|
||||
color: #314765;
|
||||
font-family: 'Varela', sans-serif; }
|
||||
|
||||
h6, h5 {
|
||||
font-weight: bold; }
|
||||
|
||||
.row.display-flex {
|
||||
display: flex;
|
||||
flex-wrap: wrap; }
|
||||
|
||||
.row.display-flex > [class*='col-'] {
|
||||
flex-grow: 1; }
|
||||
|
||||
.dropdown-item {
|
||||
padding: .25rem 1rem; }
|
||||
|
||||
.btn-primary {
|
||||
background-color: #34af4f;
|
||||
border-color: #34af4f;
|
||||
color: white; }
|
||||
|
||||
.container-fluid {
|
||||
padding: 3rem 5rem; }
|
||||
@media (max-width: 768px) {
|
||||
.container-fluid {
|
||||
padding: 35px 10px; } }
|
||||
|
||||
.container-full {
|
||||
border: 1px solid #CADAEC;
|
||||
border-radius: 5px;
|
||||
background: #ffffff;
|
||||
padding: 50px 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
text-align: center; }
|
||||
.container-full img {
|
||||
padding-bottom: 25px; }
|
||||
.container-full a {
|
||||
margin-top: 15px; }
|
||||
|
||||
.navbar {
|
||||
padding: 20px 20px 0; }
|
||||
@media (min-width: 1400px) {
|
||||
.navbar {
|
||||
padding: 20px 5rem 0; } }
|
||||
|
||||
.navbar-light .navbar-nav .nav-link {
|
||||
color: #354C6A; }
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
.navbar-collapse {
|
||||
display: flex;
|
||||
justify-content: flex-end; }
|
||||
.navbar-collapse .navbar-nav {
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0 2px 8px 0 rgba(202, 218, 236, 0.4);
|
||||
border-radius: 2px;
|
||||
max-width: 250px;
|
||||
width: 100%;
|
||||
padding: 15px; }
|
||||
.navbar-collapse .navbar-nav li a {
|
||||
margin-bottom: 10px; } }
|
||||
|
||||
.nav-item {
|
||||
margin: 0 10px;
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
color: #354C6A; }
|
||||
.nav-item.nav-lang {
|
||||
margin: 0; }
|
||||
.nav-item.nav-lang .nav-link {
|
||||
padding: 0; }
|
||||
|
||||
footer .row [class*='col-'] .dropdown-toggle {
|
||||
padding: 10px;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0 2px 8px 0 rgba(202, 218, 236, 0.4);
|
||||
border-radius: 2px; }
|
||||
@media (max-width: 1200px) {
|
||||
footer .row [class*='col-'] {
|
||||
padding: 15px 0;
|
||||
text-align: center; } }
|
||||
|
||||
.green_txt {
|
||||
color: #34af4f; }
|
||||
|
||||
.grey_text {
|
||||
color: #8aabba; }
|
||||
|
||||
fieldset {
|
||||
padding: 3rem;
|
||||
border: 1px solid #c8dde6;
|
||||
border-radius: 0.25rem;
|
||||
margin-bottom: 30px;
|
||||
background-color: white; }
|
||||
fieldset.disabled {
|
||||
background: #dededea3;
|
||||
opacity: 0.75; }
|
||||
|
||||
[type=reset], [type=submit], button, html [type=button] {
|
||||
-webkit-appearance: none; }
|
||||
|
||||
#bg_map {
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
right: 9rem;
|
||||
top: 9rem; }
|
||||
|
||||
.miniflagcard {
|
||||
border-radius: 2px;
|
||||
height: 11px;
|
||||
width: 17px; }
|
||||
|
||||
/* HOME */
|
||||
#bloc1 {
|
||||
margin-top: 1rem; }
|
||||
#bloc1 h1 {
|
||||
font-size: 50px;
|
||||
margin-top: 6rem;
|
||||
margin-bottom: 2rem; }
|
||||
#bloc1 .recharges {
|
||||
position: absolute;
|
||||
border-radius: 100%;
|
||||
background-color: #354b69;
|
||||
width: 12rem;
|
||||
height: 12rem;
|
||||
padding: 3rem 1rem;
|
||||
border: 1rem solid white;
|
||||
top: 16rem;
|
||||
color: white; }
|
||||
|
||||
#bloc2 {
|
||||
background-color: #d3d3d33d;
|
||||
color: #34af4f;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
padding: 4rem 5rem;
|
||||
margin-top: 3rem; }
|
||||
#bloc2 .col.col-md-2 {
|
||||
padding-bottom: 20px; }
|
||||
#bloc2 .col span {
|
||||
font-size: 15px;
|
||||
display: block;
|
||||
padding-top: 15px;
|
||||
color: #34af4f; }
|
||||
#bloc2 .col img {
|
||||
display: block;
|
||||
margin: auto; }
|
||||
|
||||
#bloc3 .col-md-6, #bloc3 .col-sm-12 {
|
||||
margin-bottom: 20px; }
|
||||
#bloc3 .card {
|
||||
height: 100%; }
|
||||
#bloc3 .card img.card-img-top {
|
||||
height: 441px;
|
||||
max-height: 80vw; }
|
||||
#bloc3 .card .card-body {
|
||||
display: flex;
|
||||
flex-direction: column; }
|
||||
#bloc3 .card .card-body .card-text {
|
||||
flex-grow: 1; }
|
||||
#bloc3 h2 {
|
||||
margin: auto auto 3rem auto; }
|
||||
|
||||
#bloc4 {
|
||||
background-color: #354b69;
|
||||
margin-bottom: 5rem;
|
||||
color: white; }
|
||||
#bloc4 .row .right {
|
||||
text-align: right;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center; }
|
||||
@media (max-width: 992px) {
|
||||
#bloc4 .row .right {
|
||||
justify-content: center; } }
|
||||
#bloc4 .row .right img {
|
||||
max-width: 438px;
|
||||
width: 100%; }
|
||||
|
||||
/* REGISTER */
|
||||
.register_code {
|
||||
padding: 1rem 3rem;
|
||||
border: 1px solid #c8dde6;
|
||||
border-radius: 0.25rem; }
|
||||
.register_code span {
|
||||
color: #34af4f;
|
||||
font-weight: 700;
|
||||
font-size: 3rem;
|
||||
display: block; }
|
||||
|
||||
.sim_decoupe {
|
||||
padding: 2rem;
|
||||
border: 2px solid #34af4f;
|
||||
border-radius: 0.25rem;
|
||||
margin-bottom: 25px;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
padding: 0 10px; }
|
||||
.sim_decoupe > div {
|
||||
padding: 24px 10px; }
|
||||
.sim_decoupe p {
|
||||
margin: 0;
|
||||
text-align: left; }
|
||||
|
||||
#command_step3 .credit_price [class*='col-'] {
|
||||
padding: 10px; }
|
||||
#command_step3 .credit_price .col-lg-6 input {
|
||||
display: none; }
|
||||
#command_step3 .credit_price .col-lg-6 label {
|
||||
padding: 10px;
|
||||
margin: 0; }
|
||||
#command_step3 .credit_price .col-lg-6 .paymentType {
|
||||
width: 100%;
|
||||
height: 75px; }
|
||||
#command_step3 .credit_price .col-lg-6 .paymentType img {
|
||||
padding: 0 10px; }
|
||||
|
||||
.recap_adresse h6 {
|
||||
padding: 20px 0 5px; }
|
||||
.recap_adresse p {
|
||||
margin: 0; }
|
||||
.recap_adresse p:last-of-type {
|
||||
margin: 0 0 25px; }
|
||||
|
||||
#bloc_tarifs {
|
||||
padding: 1.5rem;
|
||||
border: 1px solid #c8dde6;
|
||||
border-radius: 0.8rem;
|
||||
background-color: white; }
|
||||
|
||||
.tarifs {
|
||||
margin-bottom: 2.5rem; }
|
||||
|
||||
.row.tarifs.radio {
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
justify-content: center; }
|
||||
@media (max-width: 420px) {
|
||||
.row.tarifs.radio > div {
|
||||
max-width: 50%; }
|
||||
.row.tarifs.radio > div > a {
|
||||
max-width: 100%; } }
|
||||
|
||||
#btn_min {
|
||||
background-color: #34af4f;
|
||||
color: white;
|
||||
border-radius: 100px 0px 0px 100px;
|
||||
text-align: center;
|
||||
padding: 0.7rem;
|
||||
width: 13rem; }
|
||||
#btn_min.btndisabled {
|
||||
background-color: white;
|
||||
border: 1px solid #c8dde6;
|
||||
color: inherit; }
|
||||
|
||||
#btn_sec {
|
||||
background-color: #34af4f;
|
||||
color: white;
|
||||
border-radius: 0px 100px 100px 0px;
|
||||
text-align: center;
|
||||
padding: 0.7rem;
|
||||
width: 13rem; }
|
||||
#btn_sec.btndisabled {
|
||||
background-color: white;
|
||||
border: 1px solid #c8dde6;
|
||||
color: inherit; }
|
||||
|
||||
.back-link {
|
||||
font-size: 14px;
|
||||
color: #A7BBD4 !important; }
|
||||
|
||||
.back-link::before {
|
||||
content: "< "; }
|
||||
|
||||
.tarifs .form-control {
|
||||
background-image: url("/web/20220323135518im_/https://maoremobile.yt/img/search.svg");
|
||||
background-repeat: no-repeat;
|
||||
background-size: 3rem;
|
||||
background-position-x: 1.5rem;
|
||||
background-position-y: 0.2rem;
|
||||
padding-left: 6rem;
|
||||
border: 1px solid #c8dde6; }
|
||||
|
||||
.flagcard img {
|
||||
border-radius: 0.6rem;
|
||||
height: 1.8rem;
|
||||
width: 2.7rem; }
|
||||
|
||||
.separator {
|
||||
border-left: 3px solid #34af4f;
|
||||
vertical-align: middle; }
|
||||
|
||||
.tarifs_col img {
|
||||
height: 2rem;
|
||||
vertical-align: unset; }
|
||||
|
||||
.tarifs_col .price {
|
||||
font-size: 2.8rem; }
|
||||
|
||||
.tarifs span.price_header {
|
||||
color: #34af4f; }
|
||||
|
||||
#country_list {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
width: 100%;
|
||||
padding-right: 30px;
|
||||
display: none; }
|
||||
|
||||
#ul_country_list {
|
||||
border: 1px solid #c8dde6;
|
||||
border-radius: 0.3rem;
|
||||
background-color: white; }
|
||||
|
||||
#ul_country_list li {
|
||||
border: none;
|
||||
border-radius: 0.3rem;
|
||||
margin-bottom: 0px; }
|
||||
|
||||
#country_list .list-group-item:hover {
|
||||
z-index: 1;
|
||||
background-color: #c8dde6;
|
||||
color: white;
|
||||
text-decoration: none; }
|
||||
|
||||
#country_list .selected {
|
||||
z-index: 1;
|
||||
background-color: #c8dde6;
|
||||
color: white;
|
||||
text-decoration: none; }
|
||||
|
||||
.country_hidden {
|
||||
display: none; }
|
||||
|
||||
.country_shown {
|
||||
display: block; }
|
||||
|
||||
.alert_div {
|
||||
color: red;
|
||||
display: inline-flex;
|
||||
align-items: center; }
|
||||
|
||||
#alert_cgv {
|
||||
position: absolute; }
|
||||
|
||||
.credit_price label {
|
||||
position: relative;
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border-radius: 0.3rem;
|
||||
background: #ebf2f5;
|
||||
box-sizing: border-box;
|
||||
height: 4.5rem;
|
||||
width: 6rem;
|
||||
text-align: center;
|
||||
margin-right: 1rem;
|
||||
font-size: 2rem;
|
||||
cursor: pointer;
|
||||
border: 0px solid rgba(0, 200, 83, 0.5); }
|
||||
.credit_price label:hover, .credit_price label:focus, .credit_price label:active {
|
||||
border: 2px solid rgba(0, 200, 83, 0.5); }
|
||||
.credit_price label span {
|
||||
position: absolute;
|
||||
display: block;
|
||||
bottom: -25px;
|
||||
font-size: 12px;
|
||||
font-style: italic;
|
||||
color: #34af4f; }
|
||||
|
||||
.credit_price input[type="radio"] {
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
height: 0; }
|
||||
|
||||
.credit_price input[type="radio"]:active + label {
|
||||
opacity: 1; }
|
||||
|
||||
.credit_price input[type="radio"]:checked + label {
|
||||
opacity: 1;
|
||||
border: 2px solid #34af4f; }
|
||||
|
||||
.credit_price input[type="radio"]:disabled + label {
|
||||
opacity: 0.7;
|
||||
border: 0px solid #34af4f;
|
||||
cursor: default; }
|
||||
|
||||
.credit_check label {
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background: white;
|
||||
box-sizing: border-box;
|
||||
height: 1rem;
|
||||
width: 1rem;
|
||||
text-align: center;
|
||||
margin-right: 0.7rem;
|
||||
font-size: 2rem;
|
||||
cursor: pointer;
|
||||
border: 1px solid rgba(49, 71, 101, 0.6); }
|
||||
.credit_check label:hover, .credit_check label:focus, .credit_check label:active {
|
||||
border: 1px solid rgba(0, 200, 83, 0.5) !important; }
|
||||
|
||||
.credit_check input[type="checkbox"] {
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
height: 0; }
|
||||
|
||||
.credit_check input[type="checkbox"]:active + label {
|
||||
opacity: 1; }
|
||||
|
||||
.credit_check input[type="checkbox"]:checked + label {
|
||||
opacity: 1;
|
||||
border: 1px solid #34af4f !important;
|
||||
background: url("/web/20220323135518im_/https://maoremobile.yt/img/check.svg");
|
||||
background-position: left center;
|
||||
background-size: auto 100%;
|
||||
background-repeat: no-repeat; }
|
||||
|
||||
.credit_type label {
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border-radius: 0.3rem;
|
||||
background: #ebf2f5;
|
||||
box-sizing: border-box;
|
||||
padding: 0rem 1rem 0rem 1rem;
|
||||
height: 4.5rem;
|
||||
text-align: center;
|
||||
margin-right: 1rem;
|
||||
font-size: 2rem;
|
||||
cursor: pointer;
|
||||
border: 2px solid #c8dde6; }
|
||||
.credit_type label:hover, .credit_type label:focus, .credit_type label:active {
|
||||
border: 2px solid rgba(0, 200, 83, 0.5); }
|
||||
|
||||
.credit_type input[type="radio"] {
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
height: 0; }
|
||||
|
||||
.credit_type input[type="radio"]:active + label {
|
||||
opacity: 1; }
|
||||
|
||||
.credit_type input[type="radio"]:checked + label {
|
||||
opacity: 1;
|
||||
border: 2px solid #34af4f; }
|
||||
|
||||
.credit_type button {
|
||||
outline: none;
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border-radius: 0.3rem;
|
||||
background: #ebf2f5;
|
||||
box-sizing: border-box;
|
||||
padding: 0rem 1rem 0rem 1rem;
|
||||
height: 4.5rem;
|
||||
text-align: center;
|
||||
margin-right: 1rem;
|
||||
font-size: 2rem;
|
||||
cursor: pointer;
|
||||
border: 2px solid #c8dde6; }
|
||||
.credit_type button:hover, .credit_type button:focus, .credit_type button:active {
|
||||
border: 2px solid rgba(0, 200, 83, 0.5); }
|
||||
|
||||
.credit_type button:active {
|
||||
border: 2px solid #34af4f; }
|
||||
|
||||
.credit_type button:disabled {
|
||||
opacity: 0.7;
|
||||
border: 0px solid #34af4f;
|
||||
cursor: default; }
|
||||
|
||||
#faq dt, #faq dd {
|
||||
background-color: #ffffff; }
|
||||
#faq dt {
|
||||
border: 1px solid #CADAEC;
|
||||
border-radius: 5px;
|
||||
background: url("/web/20220323135518im_/https://maoremobile.yt/img/arrow_down.svg") no-repeat 99% center #ffffff;
|
||||
min-height: 31px;
|
||||
padding: 10px 20px;
|
||||
cursor: pointer;
|
||||
margin-bottom: 10px; }
|
||||
#faq dt.open {
|
||||
background: url("/web/20220323135518im_/https://maoremobile.yt/img/arrow_up.svg") no-repeat 99% center #ffffff;
|
||||
border-bottom-left-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
border-bottom: none;
|
||||
margin-bottom: 0; }
|
||||
#faq dt.open + dd {
|
||||
height: auto;
|
||||
visibility: visible;
|
||||
padding: 0 20px 10px;
|
||||
opacity: 1;
|
||||
border: 1px solid #CADAEC;
|
||||
border-top: none;
|
||||
border-radius: 0 0 5px 5px; }
|
||||
#faq dd {
|
||||
display: block;
|
||||
visibility: hidden;
|
||||
height: 0;
|
||||
opacity: 0; }
|
||||
|
||||
#help-phone, #help-mail {
|
||||
border: 1px solid #CADAEC;
|
||||
border-radius: 5px;
|
||||
background: #ffffff;
|
||||
padding-top: 20px;
|
||||
padding-bottom: 20px; }
|
||||
#help-phone h2, #help-mail h2 {
|
||||
margin: 20px 0; }
|
||||
#help-phone .invalid-feedback, #help-mail .invalid-feedback {
|
||||
text-align: left; }
|
||||
|
||||
#help-phone {
|
||||
margin-bottom: 10px; }
|
||||
|
||||
.login-block {
|
||||
padding: 10px 0;
|
||||
max-width: 350px;
|
||||
width: 100%; }
|
||||
|
||||
.account-block {
|
||||
padding: 1.5rem;
|
||||
border: 1px solid #c8dde6;
|
||||
border-radius: 0.8rem;
|
||||
background-color: white; }
|
||||
.account-block h6 span {
|
||||
color: #999; }
|
||||
.account-block h6 span.green_txt {
|
||||
color: #34af4f; }
|
||||
|
||||
#cgv dt {
|
||||
margin-bottom: 10px;
|
||||
font-size: 1.1rem; }
|
||||
|
||||
#cgv dd {
|
||||
font-size: 0.9rem; }
|
||||
|
||||
/*# sourceMappingURL=maore.css.map */
|
||||
|
||||
/*
|
||||
FILE ARCHIVED ON 13:55:18 Mar 23, 2022 AND RETRIEVED FROM THE
|
||||
INTERNET ARCHIVE ON 11:17:24 Oct 11, 2025.
|
||||
JAVASCRIPT APPENDED BY WAYBACK MACHINE, COPYRIGHT INTERNET ARCHIVE.
|
||||
|
||||
ALL OTHER CONTENT MAY ALSO BE PROTECTED BY COPYRIGHT (17 U.S.C.
|
||||
SECTION 108(a)(3)).
|
||||
*/
|
||||
/*
|
||||
playback timings (ms):
|
||||
captures_list: 0.563
|
||||
exclusion.robots: 0.027
|
||||
exclusion.robots.policy: 0.016
|
||||
esindex: 0.011
|
||||
cdx.remote: 22.186
|
||||
LoadShardBlock: 106.942 (3)
|
||||
PetaboxLoader3.datanode: 156.966 (4)
|
||||
load_resource: 680.267
|
||||
PetaboxLoader3.resolve: 556.002
|
||||
*/
|
||||
Reference in New Issue
Block a user