Files
MYSOPHAL/css/publication.css
2025-08-07 13:15:31 +01:00

341 lines
7.0 KiB
CSS

.flex-container {
display: flex;
flex-wrap: nowrap;
}
.flex-container > div {
margin: 2px;
}
.grid-container {
margin-bottom: 10px;
padding: 10px;
width: 500px;
margin-left:auto;
margin-right:auto;
background-color: #ffffff;
border: 1px solid #dddfe2;
border-radius: 11px;
box-shadow: 0 1px 15px 1px rgba(0, 0, 0, 0.12);
position : relative;
}
.grid-container > div {
background-color: rgba(255, 255, 255, 0.8);
}
.link {
border-collapse:separate;
color:rgb(56, 88, 152);
cursor:pointer;
display:inline;
font-family:"Bitstream Vera Sans", Verdana, Tahoma, "Sans serif";
font-size:11px;
font-weight:700;
height:auto;
text-decoration-color:rgb(58, 86, 147);
text-decoration-line:none;
text-decoration-style:solid;
}
.BUTTON_BDX {
background: #3A5693;
-webkit-border-radius: 7px;
-moz-border-radius: 7px;
border-radius: 7px;
height: 0;
line-height: 0;
color: #FFFFFF;
font-family: Arial;
font-size: 15px;
font-weight: 300;
padding: 15px;
text-shadow: 1px 1px 20px #000000;
border: solid #3e5994 1px;
text-decoration: none;
display: inline-block;
cursor: pointer;
text-align: center;
}
.BUTTON_BDX:hover {
border: solid #3e5994 1px;
background: #3e5993;
}
.textarea-replace1 {
padding: 10px 10px 0px 10px;
background-color: #f2f3f5;
border-radius: 18px;
}
.textarea-replace {
padding: 3px 10px 10px 0px;
min-height: 10px;
font-size: 14px;
font-family: Times New Roman;
color: #414141;
word-wrap: break-word;
direction: ltr;
text-align: left;
}
.textarea-replace:focus {
outline: none;
}
.textarea-replace:before {
content: attr(placeholder);
display: block; /* For Firefox */
}
.center {
text-align: center;
}
.pagination {
display: inline-block;
}
.pagination a {
color: black;
float: left;
padding: 8px 16px;
text-decoration: none;
transition: background-color .3s;
border: 1px solid #ddd;
margin: 0 4px;
}
.pagination a.active {
background-color: #3A5693;
color: white;
border: 1px solid #3A5693;
}
.pagination a:hover:not(.active) {
background-color: #ddd;
}
textarea {
width: 470px;
height: 250px; /* optional change it to your height */
background: transparent;
vertical-align: middle; /* removes whitespace as textarea is inline element */
border: 0;
font-size: 14px;
font-weight: normal;
line-height: 1.38;
outline: none;
width: 100%;
}
.Stitre {
padding-left : 12px;
max-width:480px;
word-wrap: break-word;
font-size: 14px;
font-weight: normal;
line-height: 1.38;
padding-bottom: 10px;
}
.ligneB {
border-top:0.1px solid #dddfe2;
margin-top : 0px;
}
.ligneA {
border-top:0.1px solid #dddfe2;
margin : 0px;
}
.button {
text-align: center;
/*padding : 8px 8px 8px 8px;*/
cursor: pointer;
}
.button:hover {
background-color: #F2F3F5;
}
.imo {
position: absolute;
width: 225px; height: 40px;border: 1px solid #cecece; bottom: 17px;
animation-duration:0.2s;
animation-fill-mode:forwards;
animation-iteration-count:1;
animation-name:e5hlw9lw-B;
background-color:rgb(255, 255, 255);
border-bottom-left-radius:40px;
border-bottom-right-radius:40px;
border-top-left-radius:40px;
border-top-right-radius:40px;
box-shadow:rgba(0, 0, 0, 0.1) 0px 0px 0px 1px, rgba(0, 0, 0, 0.1) 0px 2px 2px 0px;
color:rgb(28, 30, 33);
direction:ltr;
font-size:12px;
line-height:16.08px;
padding-bottom:5px;
padding-top:5px;
pointer-events:auto;
white-space:nowrap;
}
#messageBar {
opacity: 0.5;
background-color: white;
z-index: 100000;
position: fixed;
top: 0px;
width: 100%;
height: 100%;
}
.Buttoncomment {
position:relative;
cursor: pointer;
line-height: 20px;
padding: 9px ;
color: #606770;
font-weight: 600;
}
/* facebook reactions*/
/* Button */
.FB_reactions {
position:relative;
cursor: pointer;
display: inline-block;
line-height: 20px;
padding: 2px ;
transition: all 20ms ease-out;
color: #606770;
font-weight: 600;
width:90px;
background:url(../file_upload/emojis/default.png) center left no-repeat;
background-position: left 10px top 2px;
}
[data-emoji-class="jaime"]{background:url("../file_upload/emojis/jaime.svg") center left no-repeat; background-size: 25px 25px; background-position: left 10px top 6px;}
[data-emoji-class="Jadore"]{background:url("../file_upload/emojis/Jadore.svg") center left no-repeat; background-size: 25px 25px; background-position: left 10px top 6px;}
[data-emoji-class="haha"]{background:url(../file_upload/emojis/haha.svg) center left no-repeat;background-size: 25px 25px; background-position: left 10px top 6px;}
[data-emoji-class="wow"]{background:url(../file_upload/emojis/wow.svg) center left no-repeat;background-size: 25px 25px; background-position: left 10px top 6px;}
[data-emoji-class="Triste"]{background:url(../file_upload/emojis/Triste.svg) center left no-repeat;background-size: 25px 25px; background-position: left 10px top 6px;}
[data-emoji-class="Grrr"]{background:url(../file_upload/emojis/Grrr.svg) center left no-repeat;background-size: 25px 25px; background-position: left 10px top 6px;}
.FB_reactions span{display:block; padding:9px 0px 4px 40px; text-align:left;}
._bar ._inner img {
width: 40px;
position: relative;
cursor: pointer;
float:left;
transform: scale(.8, .8) translate(0, 0);
transition: transform 200ms ease;
}
._bar ._inner img:nth-child(1) {
-webkit-animation:bounce .21s .1s;
}
._bar ._inner img:nth-child(2) {
-webkit-animation:bounce .25s .1s;
}
._bar ._inner img:nth-child(3) {
-webkit-animation:bounce .29s .1s;
}
._bar ._inner img:nth-child(4) {
-webkit-animation:bounce .3s .1s;
}
._bar ._inner img:nth-child(5) {
-webkit-animation:bounce .35s .1s;
}
._bar ._inner img:nth-child(6) {
-webkit-animation:bounce .4s .1s
}
@-webkit-keyframes bounce {
0% { bottom:5px; }
25%{ bottom:55px; }
50% { bottom:20px; }
75% { bottom:15px; }
100% {bottom:0; }
}
._bar ._inner img:hover {
transform: scale(1, 1) translate(0, -6px);
opacity: 1;
}
._bar{display:none;}
._inner {
position: relative;
overflow: hidden;
background-color: white;
margin: auto;
padding: 0px 0px 1px 1px;
border-radius: 20px;
-moz-box-shadow: 2px 2px 8px 1px rgba(0, 0, 0, 0.2);
-webkit-box-shadow: 2px 2px 8px 1px rgba(0, 0, 0, 0.2);
box-shadow: 2px 2px 8px 1px rgba(0, 0, 0, 0.2);
-moz-backface-visibility: hidden;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
-moz-transform-style: preserve-3d;
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
}
.ov_visi{ overflow:visible;}
/* facebook reactions*/
@media (max-width: 500px) {
.grid-container {
/* background-color: red;*/
width: 100%;
margin-left:0;
margin-right:0;
min-width: 0;
box-sizing :border-box;
}
}