Ela_Front/src/styles/components/_new_s_article_2025.scss

855 lines
16 KiB
SCSS

.new_s_article_2025 {
@media only screen and (max-width: 600px) {
.img_note_class {
width: 25%;
height: 25%;
}
.btn-success {
font-size: x-small !important;
font-family: "DM Sans", "sans-serif";
//width: 50%!important;
padding: 0.2rem !important;
}
.media_sociaux {
svg {
margin-top: 0 !important;
text-align: left !important;
}
.SocialIcon {
height: 20px !important;
width: 20px !important;
}
}
.rech_middlebox {
float: left;
border-width: 2px;
width: 100%;
height: 100%;
margin: auto;
padding: 0.1rem;
border-radius: 30px;
margin-right: 0.5%;
}
.div_row {
//border: 0px solid black;
border-width: 0.01rem;
width: 100%;
margin-bottom: 1rem;
border-radius: 1rem;
margin-left: auto;
margin-right: auto;
}
.div_row_gauche {
float: left;
border: 0px solid black;
border-width: 0.01rem;
width: 98%;
border-radius: 5px;
text-align: left;
font-family: "DM Sans", "sans-serif";
font-size: small;
margin-bottom: 5px;
padding: 5px;
margin-right: 5px;
cursor: pointer;
}
.div_row_droite {
float: right;
border: 0px solid black;
border-width: 0.01rem;
width: 49.8%;
border-radius: 5px;
text-align: left;
font-family: "DM Sans", "sans-serif";
font-size: small;
margin-bottom: 5px;
padding: 5px;
}
.okUpdateData {
font-size: small;
color: green;
font-style: italic;
}
.koUpdateData {
font-size: small;
color: red;
font-style: italic;
}
.img_categorie {
width: 100%;
border-radius: 10px !important;
padding: 5px;
}
.met_container {
text-align: center;
padding: 1px 2px;
letter-spacing: 2px;
font-size: small;
color: #3b3e40;
}
.met_text {
margin-bottom: 0.1rem;
// letter-spacing: 1px;
min-height: 60px;
font-family: Verdana, Georgia, Arial;
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 22px;
text-align: justify;
color: #0A043C;
margin-top: 1rem;
line-height: 30px;
font-weight: 600;
}
.met_text:hover {
font-style: italic;
}
.met_text_detail {
margin-bottom: 0.1rem;
font-size: small;
font-weight: normal;
//white-space: nowrap;
//overflow: hidden;
text-align: left;
margin-top: 1rem;
margin-bottom: 1rem;
}
.art_criteres {
font-family: "DM Sans", "sans-serif";
color: #104277;
font-size: small;
padding-bottom: 0rem;
margin-bottom: 0rem;
width: 12%;
float: left;
margin-bottom: 0.5rem;
font-weight: bold;
}
.art_criteres_value {
width: 100%;
float: left;
margin-bottom: 0.5rem;
text-align: left;
font-family: Verdana, Georgia, Arial;
//height: 20rem;
line-height: 30px;
font-size: 14px;
}
.art_criteres_value_left {
width: 50%;
float: left;
text-align: left;
margin-bottom: 0.5rem;
}
.art_criteres_value_right {
width: 35%;
float: left;
text-align: right;
margin-bottom: 0.5rem;
}
.gauche_img {
width: 100%;
float: left;
}
.droite_txt {
width: 100%;
float: right;
padding: 5px;
height: 20rem;
}
.div_row_border {
float: left;
// border: 1px solid #d5d8dc;
border-width: 0.01rem;
width: 100%;
border-radius: 5px;
text-align: left;
font-family: "DM Sans", "sans-serif";
font-size: small;
margin-bottom: 15px;
background: #FFF;
// padding: 5px;
// margin-right: 5px;
//cursor: pointer;
}
}
@media only screen and (min-width: 601px) and (max-width: 991px) {
.img_note_class {
width: 15%;
height: 15%;
}
.btn-success {
font-size: x-small !important;
font-family: "DM Sans", "sans-serif";
//width: 50%!important;
padding: 0.2rem !important;
}
.media_sociaux {
svg {
margin-top: 0 !important;
text-align: left !important;
}
.SocialIcon {
height: 20px !important;
width: 20px !important;
}
}
.rech_middlebox {
float: left;
border-width: 2px;
width: 100%;
height: 100%;
margin: auto;
padding: 0.1rem;
border-radius: 30px;
margin-right: 0.5%;
}
.div_row {
//border: 0px solid black;
border-width: 0.01rem;
width: 100%;
margin-bottom: 1rem;
border-radius: 1rem;
margin-left: auto;
margin-right: auto;
}
.div_row_gauche {
//float: left;
border: 0px solid black;
border-width: 0.01rem;
width: 98%;
border-radius: 5px;
text-align: left;
font-family: "DM Sans", "sans-serif";
font-size: small;
margin-bottom: 5px;
padding: 5px;
margin-right: auto;
margin-left: auto;
cursor: pointer;
}
.div_row_droite {
float: right;
border: 0px solid black;
border-width: 0.01rem;
width: 49.8%;
border-radius: 5px;
text-align: left;
font-family: "DM Sans", "sans-serif";
font-size: small;
margin-bottom: 5px;
padding: 5px;
}
.okUpdateData {
font-size: small;
color: green;
font-style: italic;
}
.koUpdateData {
font-size: small;
color: red;
font-style: italic;
}
.img_categorie {
width: 100%;
border-radius: 10px !important;
padding: 5px;
}
.met_container {
text-align: center;
padding: 1px 2px;
letter-spacing: 2px;
font-size: small;
color: #3b3e40;
}
.met_text {
margin-bottom: 0.1rem;
// letter-spacing: 1px;
min-height: 60px;
font-family: Verdana, Georgia, Arial;
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 22px;
text-align: left;
color: #0A043C;
margin-top: 1rem;
line-height: 30px;
font-weight: 600;
}
.met_text:hover {
font-style: italic;
}
.met_text_detail {
margin-bottom: 0.1rem;
font-size: small;
font-weight: normal;
//white-space: nowrap;
//overflow: hidden;
text-align: left;
margin-top: 1rem;
// margin-bottom: 1rem;
}
.art_criteres {
font-family: "DM Sans", "sans-serif";
color: #104277;
font-size: small;
padding-bottom: 0rem;
margin-bottom: 0rem;
width: 12%;
float: left;
margin-bottom: 0.5rem;
font-weight: bold;
}
.art_criteres_value {
width: 100%;
float: left;
margin-bottom: 0.5rem;
text-align: left;
font-family: Verdana, Georgia, Arial;
height: 15rem;
line-height: 30px;
font-size: 14px;
}
.art_criteres_value_left {
width: 50%;
float: left;
text-align: left;
margin-bottom: 0.5rem;
}
.art_criteres_value_right {
width: 35%;
float: left;
text-align: right;
margin-bottom: 0.5rem;
}
.gauche_img {
width: 100%;
float: left;
}
.droite_txt {
width: 100%;
float: right;
padding: 5px;
height: 33rem;
}
.div_row_border {
float: left;
// border: 1px solid #d5d8dc;
border-width: 0.01rem;
width: 100%;
border-radius: 5px;
text-align: left;
font-family: "DM Sans", "sans-serif";
font-size: small;
margin-bottom: 25px;
padding: 5px;
margin-right: 5px;
//cursor: pointer;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.img_note_class {
width: 10%;
height: 10%;
}
.btn-success {
font-size: x-small !important;
font-family: "DM Sans", "sans-serif";
//width: 40%!important;
padding: 0.2rem !important;
}
.media_sociaux {
svg {
margin-top: 0 !important;
text-align: left !important;
}
.SocialIcon {
height: 20px !important;
width: 20px !important;
}
}
.rech_middlebox {
float: left;
border-width: 2px;
width: 100%;
height: 100%;
margin: auto;
padding: 0.1rem;
border-radius: 30px;
margin-right: 0.5%;
}
.div_row {
//border: 0px solid black;
border-width: 0.01rem;
width: 100%;
margin-bottom: 1rem;
border-radius: 1rem;
margin-left: auto;
margin-right: auto;
}
.div_row_border {
float: left;
// border: 1px solid #d5d8dc;
border-width: 0.01rem;
width: 100%;
border-radius: 5px;
text-align: left;
font-family: "DM Sans", "sans-serif";
font-size: small;
margin-bottom: 25px;
padding: 5px;
margin-right: 5px;
// cursor: pointer;
}
.div_row_gauche {
float: left;
border: 0px solid black;
border-width: 0.01rem;
width: 49%;
border-radius: 5px;
text-align: left;
font-family: "DM Sans", "sans-serif";
font-size: small;
margin-bottom: 5px;
padding: 5px;
margin-right: 5px;
cursor: pointer;
}
.div_row_droite {
float: right;
border: 0px solid black;
border-width: 0.01rem;
width: 49.8%;
border-radius: 5px;
text-align: left;
font-family: "DM Sans", "sans-serif";
font-size: small;
margin-bottom: 5px;
padding: 5px;
}
.okUpdateData {
font-size: small;
color: green;
font-style: italic;
}
.koUpdateData {
font-size: small;
color: red;
font-style: italic;
}
.img_categorie {
width: 100%;
border-radius: 10px !important;
padding: 5px;
}
.met_container {
text-align: center;
padding: 1px 2px;
letter-spacing: 2px;
font-size: small;
color: #3b3e40;
}
.met_text {
margin-bottom: 0.1rem;
// letter-spacing: 1px;
min-height: 60px;
font-family: Verdana, Georgia, Arial;
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 22px;
text-align: left;
color: #0A043C;
margin-top: 1rem;
line-height: 30px;
font-weight: 600;
}
.met_text:hover {
font-style: italic;
}
.met_text_detail {
margin-bottom: 0.1rem;
font-size: small;
font-weight: normal;
//white-space: nowrap;
//overflow: hidden;
text-align: left;
margin-top: 1rem;
// margin-bottom: 1rem;
}
.art_criteres {
font-family: "DM Sans", "sans-serif";
color: #104277;
font-size: small;
padding-bottom: 0rem;
margin-bottom: 0rem;
width: 15%;
float: left;
margin-bottom: 0.5rem;
font-weight: bold;
}
.art_criteres_value {
width: 100%;
float: left;
margin-bottom: 0.5rem;
text-align: left;
font-family: Verdana, Georgia, Arial;
height: 15rem;
line-height: 28px;
font-size: 14px;
}
.art_criteres_value_left {
width: 50%;
float: left;
text-align: left;
margin-bottom: 0.5rem;
}
.art_criteres_value_right {
width: 35%;
float: left;
text-align: right;
margin-bottom: 0.5rem;
}
.gauche_img {
width: 100%;
float: left;
}
.droite_txt {
width: 100%;
float: right;
padding: 5px;
height: 28rem;
}
}
@media only screen and (min-width: 1200px) {
.img_note_class {
width: 8%;
}
.btn-success {
font-size: x-small !important;
font-family: "DM Sans", "sans-serif";
//width: 40%!important;
padding: 0.2rem !important;
}
.media_sociaux {
svg {
margin-top: 0 !important;
text-align: left !important;
}
.SocialIcon {
height: 25px !important;
width: 25px !important;
}
}
.rech_middlebox {
float: left;
border-width: 2px;
width: 100%;
height: 100%;
margin: auto;
padding: 0.1rem;
border-radius: 30px;
margin-right: 0.5%;
}
.div_row {
//border: 0px solid black;
border-width: 0.01rem;
width: 100%;
margin-bottom: 1rem;
border-radius: 1rem;
margin-left: auto;
margin-right: auto;
}
.div_row_border {
float: left;
// border: 1px solid #d5d8dc;
border-width: 0.01rem;
width: 100%;
border-radius: 5px;
text-align: left;
font-family: "DM Sans", "sans-serif";
font-size: small;
margin-bottom: 25px;
padding: 5px;
margin-right: 5px;
//cursor: pointer;
}
.div_row_gauche {
float: left;
border: 0px solid black;
border-width: 0.01rem;
width: 49%;
border-radius: 5px;
text-align: left;
font-family: "DM Sans", "sans-serif";
font-size: small;
margin-bottom: 5px;
padding: 5px;
margin-right: 5px;
cursor: pointer;
}
.div_row_droite {
float: right;
border: 0px solid black;
border-width: 0.01rem;
width: 49.8%;
border-radius: 5px;
text-align: left;
font-family: "DM Sans", "sans-serif";
font-size: small;
margin-bottom: 5px;
padding: 5px;
}
.okUpdateData {
font-size: small;
color: green;
font-style: italic;
}
.koUpdateData {
font-size: small;
color: red;
font-style: italic;
}
.img_categorie {
width: 100%;
border-radius: 10px !important;
padding: 5px;
height: 15rem;
}
.met_container {
text-align: center;
padding: 1px 2px;
letter-spacing: 2px;
font-size: small;
color: #3b3e40;
}
.met_text {
margin-bottom: 0.1rem;
// letter-spacing: 1px;
height: 60px;
font-family: Verdana, Georgia, Arial;
font-style: normal;
font-weight: 400;
font-size: 17px;
line-height: 22px;
text-align: left;
color: #0A043C;
margin-top: 2rem;
line-height: 30px;
font-weight: 600;
width: 100%;
float: left;
}
.met_text:hover {
font-style: italic;
}
.met_text_detail {
margin-bottom: 0.1rem;
font-size: small;
font-weight: normal;
//white-space: nowrap;
//overflow: hidden;
text-align: left;
margin-top: 1rem;
// margin-bottom: 1rem;
width: 100%;
float: left;
//height: 14rem;
}
.art_criteres {
font-family: "DM Sans", "sans-serif";
color: #104277;
font-size: small;
padding-bottom: 0rem;
margin-bottom: 0rem;
width: 12%;
float: left;
margin-bottom: 0.5rem;
font-weight: bold;
}
.art_criteres_value {
width: 100%;
float: left;
text-align: left;
margin-bottom: 0.5rem;
text-align: left;
font-family: Verdana, Georgia, Arial;
line-height: 25px;
height: 10rem;
line-height: 30px;
font-size: 14px;
}
.art_criteres_value_left {
width: 50%;
float: left;
text-align: left;
margin-bottom: 0.5rem;
}
.art_criteres_value_right {
width: 35%;
float: left;
text-align: right;
margin-bottom: 0.5rem;
}
.gauche_img {
width: 100%;
float: left;
}
.droite_txt {
width: 100%;
float: right;
padding: 5px;
height: 20rem;
padding-left: 1rem;
padding-right: 1rem;
}
}
.lire_plus {
cursor: pointer;
width: 100%;
text-align: center;
border: 1px solid #d5d8dc;
border-radius: 5px;
padding-top: 10px;
background: #f8f9f9;
box-shadow: 3px 0px 5px 3px rgba(0, 0, 0, 0.1);
height: 3rem;
float: left;
font-style: normal;
}
.lire_plus:hover {
font-style: italic;
}
.tox-dialog {
z-index: 150002 !important;
}
// end media
}
.grid8p {
font-family: Roboto, sans-serif;
color: #005e5d;
font-size: 1rem;
line-height: 1.5rem;
width: 100%;
text-align: left;
padding-right: 10px;
float: left;
height: 2rem;
font-style: italic;
cursor: pointer;
}
.grid8p:hover {
font-style: italic;
letter-spacing: 1px;
}