helloworldhellwoorldeofoehfafihuofijoahfgyioafjpafhzguirg uvuizerurg_ozerygvoiuhrgreqiogrehh

This commit is contained in:
Gzod01 2023-10-22 10:14:09 +02:00
parent 3379242f31
commit c00a301523
79 changed files with 1614 additions and 3 deletions

View file

@ -0,0 +1,225 @@
/* Carousel and grid css (the carousels and the feature grid, etc.)*/
.home-top-carousel{
height:300px;
}
.home-top-carousel .item, .home-top-carousel .item>a{
display:flex;
background-color:var(--primary-color-3);
color: var(--secondary-color);
flex-direction:row;
width:calc(100% - 40px); /* 260px */
padding: 0px 20px;
}
.home-top-carousel .item .text{
display:flex;
flex-direction: column;
flex:2 0;
height:260px;/*100%*/
}
.home-top-carousel .item .text .title{
min-height:10%;
max-height:20%;
vertical-align:middle;
text-align:center;
font-size:120%;
}
.home-top-carousel .item .text .description {
flex: 2 0;
overflow:auto;
max-height:90%;
display:flex;
flex-direction:column;
}
.home-top-carousel .item .img {
vertical-align:center;
line-height:280px;
display:flex;
flex-direction:column;
justify-content:center;
align-content:center;
height:280px;
padding:10px 0px;
}
.home-top-carousel .item .img img {
max-height:250px !important;
max-width: calc(100vw /3);
}
/*Team carousel */
.employees-carousel{
margin:20px 0px;
height:500px;
}
.employees-carousel .item{
display:flex;
flex-direction:column;
background-color:var(--secondary-color-darklight);
border-radius:20px;
margin: 0px 5px;
height:500px;
}
.employees-carousel .item .text {
height:400px;
overflow:auto;
padding-bottom:5px;
}
.employees-carousel .item .text .title{}
.employees-carousel .item .text .description{}
.employees-carousel .item .img {
padding-top:5px;
justify-self:center;
align-self:center;
}
.employees-carousel .item .img img{
height:100px;
border:2px solid var(--primary-color-darkest);
border-radius:100%;
}
/* LAST NEWS CAROUSEL */
.last-news-carousel{
position:relative;
height:300px;
}
.last-news-carousel .item, .last-news-carousel .item>a{
position:relative;
display:flex;
background-color:var(--primary-color-3);
font-size:150%;
-webkit-text-stroke: 1px var(--primary-color-darkest);
-webkit-text-fill-color: var(--secondary-color);
flex-direction:row;
width:calc(100% - 40px); /* 260px */
padding: 0px 20px;
}
.last-news-carousel .item .text{
display:flex;
z-index:2;
flex-direction: column;
justify-content:center;
align-items:center;
text-align:center;
width:100%;
height:260px;/*100%*/
}
.last-news-carousel .item .text .title{
min-height:20%;
max-height:20%;
vertical-align:middle;
text-align:center;
font-size:120%;
overflow:auto;
line-break:break-word;
word-break:break-all;
}
.last-news-carousel .item .text .description {
overflow:auto;
max-height:80%;
display:flex;
flex-direction:column;
}
@media (max-width:700px){
.last-news-carousel .item .text .description {
display:none;
}
.last-news-carousel .item .text .title{
color: red;
height:250px;
max-height:250px;
line-break:unset;
word-break:unset;
overflow:auto;
}
}
.last-news-carousel .item .img {
position:absolute;
left:50%;
top:50%;
transform:translate(-50%, -50%);
z-index:1;
height:100%;
max-width:80vw!important;
overflow:hidden;
}
.last-news-carousel .item .img img {
height:100%;
z-index:3;
max-width:80vw!important;
}
.features{ /*not a carousel but a grid */
display:flex;
flex-wrap:wrap;
flex-direction:row;
justify-content:space-around;
width:calc(100% - 20px);
padding:10px;
}
.features .item, .features .item>a{
display:flex;
flex-direction:column;
width: 300px;
height: 250px;
color: var(--primary-color);
}
.features .item .icon {
align-self:center;
display:flex;
align-items:center;
justify-content:center;
height: 90px;
width:90px;
align-self:center;
border-radius:100%;
border: var(--primary-color) solid 5px;
}
.features .item .text .title{
text-align:center;
}
.features .item .text .description {
text-align:center;
}
.last-articles-grid-3{ /*not a carousel but a grid */
display:flex;
flex-wrap:wrap;
flex-direction:row;
justify-content:space-around;
width:calc(100% - 20px);
padding:10px;
}
.last-articles-grid-3 .item, .last-articles-grid-3 .item>a{
display:flex;
flex-direction:column;
width: 300px;
height: 250px;
color: var(--primary-color);
}
.last-articles-grid-3 .item .baneer {
align-self:center;
display:flex;
align-items:center;
justify-content:center;
height: 90px;
width:90px;
align-self:center;
border-radius:100%;
border: var(--primary-color) solid 5px;
overflow:hidden;
}
.last-articles-grid-3 .item .baneer img{
max-height:90px!important;
}
.last-articles-grid-3 .item .text .title{
text-align:center;
}
.last-articles-grid-3 .item .text .description {
text-align:center;
}

View file

@ -0,0 +1,82 @@
/* Background */ .chroma { color: #f8f8f2; background-color: #272822 }
/* Other */ .chroma .x { }
/* Error */ .chroma .err { color: #960050; background-color: #1e0010 }
/* LineTableTD */ .chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; }
/* LineTable */ .chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; width: auto; overflow: auto; display: block; }
/* LineHighlight */ .chroma .hl { display: block; width: 100%;background-color: #ffffcc }
/* LineNumbersTable */ .chroma .lnt { margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f }
/* LineNumbers */ .chroma .ln { margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f }
/* Keyword */ .chroma .k { color: #66d9ef }
/* KeywordConstant */ .chroma .kc { color: #66d9ef }
/* KeywordDeclaration */ .chroma .kd { color: #66d9ef }
/* KeywordNamespace */ .chroma .kn { color: #f92672 }
/* KeywordPseudo */ .chroma .kp { color: #66d9ef }
/* KeywordReserved */ .chroma .kr { color: #66d9ef }
/* KeywordType */ .chroma .kt { color: #66d9ef }
/* Name */ .chroma .n { }
/* NameAttribute */ .chroma .na { color: #a6e22e }
/* NameBuiltin */ .chroma .nb { }
/* NameBuiltinPseudo */ .chroma .bp { }
/* NameClass */ .chroma .nc { color: #a6e22e }
/* NameConstant */ .chroma .no { color: #66d9ef }
/* NameDecorator */ .chroma .nd { color: #a6e22e }
/* NameEntity */ .chroma .ni { }
/* NameException */ .chroma .ne { color: #a6e22e }
/* NameFunction */ .chroma .nf { color: #a6e22e }
/* NameFunctionMagic */ .chroma .fm { }
/* NameLabel */ .chroma .nl { }
/* NameNamespace */ .chroma .nn { }
/* NameOther */ .chroma .nx { color: #a6e22e }
/* NameProperty */ .chroma .py { }
/* NameTag */ .chroma .nt { color: #f92672 }
/* NameVariable */ .chroma .nv { }
/* NameVariableClass */ .chroma .vc { }
/* NameVariableGlobal */ .chroma .vg { }
/* NameVariableInstance */ .chroma .vi { }
/* NameVariableMagic */ .chroma .vm { }
/* Literal */ .chroma .l { color: #ae81ff }
/* LiteralDate */ .chroma .ld { color: #e6db74 }
/* LiteralString */ .chroma .s { color: #e6db74 }
/* LiteralStringAffix */ .chroma .sa { color: #e6db74 }
/* LiteralStringBacktick */ .chroma .sb { color: #e6db74 }
/* LiteralStringChar */ .chroma .sc { color: #e6db74 }
/* LiteralStringDelimiter */ .chroma .dl { color: #e6db74 }
/* LiteralStringDoc */ .chroma .sd { color: #e6db74 }
/* LiteralStringDouble */ .chroma .s2 { color: #e6db74 }
/* LiteralStringEscape */ .chroma .se { color: #ae81ff }
/* LiteralStringHeredoc */ .chroma .sh { color: #e6db74 }
/* LiteralStringInterpol */ .chroma .si { color: #e6db74 }
/* LiteralStringOther */ .chroma .sx { color: #e6db74 }
/* LiteralStringRegex */ .chroma .sr { color: #e6db74 }
/* LiteralStringSingle */ .chroma .s1 { color: #e6db74 }
/* LiteralStringSymbol */ .chroma .ss { color: #e6db74 }
/* LiteralNumber */ .chroma .m { color: #ae81ff }
/* LiteralNumberBin */ .chroma .mb { color: #ae81ff }
/* LiteralNumberFloat */ .chroma .mf { color: #ae81ff }
/* LiteralNumberHex */ .chroma .mh { color: #ae81ff }
/* LiteralNumberInteger */ .chroma .mi { color: #ae81ff }
/* LiteralNumberIntegerLong */ .chroma .il { color: #ae81ff }
/* LiteralNumberOct */ .chroma .mo { color: #ae81ff }
/* Operator */ .chroma .o { color: #f92672 }
/* OperatorWord */ .chroma .ow { color: #f92672 }
/* Punctuation */ .chroma .p { }
/* Comment */ .chroma .c { color: #75715e }
/* CommentHashbang */ .chroma .ch { color: #75715e }
/* CommentMultiline */ .chroma .cm { color: #75715e }
/* CommentSingle */ .chroma .c1 { color: #75715e }
/* CommentSpecial */ .chroma .cs { color: #75715e }
/* CommentPreproc */ .chroma .cp { color: #75715e }
/* CommentPreprocFile */ .chroma .cpf { color: #75715e }
/* Generic */ .chroma .g { }
/* GenericDeleted */ .chroma .gd { color: #f92672 }
/* GenericEmph */ .chroma .ge { font-style: italic }
/* GenericError */ .chroma .gr { }
/* GenericHeading */ .chroma .gh { }
/* GenericInserted */ .chroma .gi { color: #a6e22e }
/* GenericOutput */ .chroma .go { }
/* GenericPrompt */ .chroma .gp { }
/* GenericStrong */ .chroma .gs { font-weight: bold }
/* GenericSubheading */ .chroma .gu { color: #75715e }
/* GenericTraceback */ .chroma .gt { }
/* GenericUnderline */ .chroma .gl { }
/* TextWhitespace */ .chroma .w { }

View file

@ -0,0 +1,297 @@
:root{
--primary-color:blue;
--secondary-color:white;
--primary-color-contrast: white;
--secondary-color-darkest: grey; /* the "darkest" and "darklight" variables are*/
--primary-color-darkest: darkblue;/* for the elements that can't have filter*/
--secondary-color-darklight: lightgrey;
--primary-color-darklight: rgb(0,0,200);
--primary-color-3 : rgb(0,0,150);
--primary-color-4: rgb(0,0,255);
--tertiary-really-dark-color: rgb(50,50,50);
--tertiary-medium-dark-color:rgb(100,100,100);
--default-text-color:black;
}
body{
margin:0;
height:100vh;
width:100%;
display:flex;
flex-direction:column;
}
.list-style-none{
list-style:none;
justify-content:space-around;
}
header.navbar{
position:relative;
height:70px;
display: flex;
margin:0px;
flex-direction:row;
box-shadow: 0 4px 2px -2px gray;
}
header.navbar .navbar-logo-container {
padding-left:5px;
height:70px;
}
header.navbar .navbar-logo {
height:70px;
}
header.navbar .navbar-list{
position: absolute;
padding:0;
padding-right: 15px;
right:0px;
height: calc(100%);
display: flex;
flex-direction: row;
margin: 0px;
list-style-type: none;
justify-content: center;
align-items: center;
}
header.navbar .navbar-list-item{
color:var(--primary-color);
height:100%;
line-height:70px;
vertical-align:middle;
text-align:center;
padding: 0px 10px;
}
header.navbar .navbar-list-item *{
color:var(--primary-color);
}
header.navbar .navbar-list-item a{
text-decoration:none;
}
header.navbar .navbar-list-item:hover a{
text-decoration:underline;
}
header.navbar .navbar-list-item:hover{
background-color:var(--primary-color-darkest);
color:var(--secondary-color);
}
header.navbar .navbar-list-item.active{
background-color:var(--primary-color-darklight);
color:var(--secondary-color);
}
header.navbar .navbar-list-item:hover *, header.navbar .navbar-list-item.active *{
color:var(--secondary-color);
}
@media (max-width: 700px){
header.navbar #navbar-list-toggler-label{
position:absolute;
right:5px;
height: 100%;
width: 70px;
font-size:70px;
text-align:center;
line-height:70px;
vertical-align:middle;
}
header.navbar .navbar-list-item{
height:unset;
width:100%;
padding: 10px 0px;
}
header.navbar #navbar-list-toggler:checked ~ .navbar-list{
display:flex !important;
z-index:5;
flex-direction:column;
position:fixed;
bottom:0px;
left:0px;
width:100vw;
align-content:center;
justify-content:center;
backdrop-filter:blur(10px);
background-color: rgba(50,50,50,0.5);
height: calc(100vh - 70px);
}
header.navbar #navbar-list-toggler:checked ~ .navbar-list .navbar-list-item{}
}
main.main{
flex: 2 0;
}
main.main h1, main.main h2, main.main h3, main.main h4, main.main h5, main.main h6, main.main p{
padding: 0px 20px;
color: var(--primary-color-darkest);
}
main.main h1, main.main h2, main.main h3{
text-align:center;
padding:0px;
width:calc(100%);
}
main.main h1{
font-weight:500;
text-decoration:underline;
}
main.main h2{
}
footer.footer{
justify-content:space-around;
background-color:var(--tertiary-really-dark-color);
color:var(--secondary-color);
display:flex;
flex-direction:column;
}
footer.footer .row{
padding:20px 0px;
display:flex;
flex-direction:row;
justify-content:space-around;
text-align:center;
}
footer.footer .row.top{}
footer.footer .row.bottom{}
footer.footer .col {
display:flex;
flex-direction:column;
color:var(--secondary-color);
}
footer.footer .col li {
padding:10px;
color:var(--secondary-color);
}
footer.footer .col a {
color:var(--secondary-color);
}
footer.footer .col.left{}
footer.footer .col.middle{}
footer.footer .col.right{}
.articles-list{
display:flex;
flex-direction:row;
flex-wrap:wrap;
}
.articles-list .article-item{
display:flex;
color: var(--primary-color);
flex-direction:column;
width:300px;
height:300px;
justify-content:center;
align-items:center;
border:2px solid;
}
.articles-list .article-item .article-item-main{
display:flex;
color:var(--primary-color);
flex-direction:column;
width:100%;
justify-content:center;
align-items:center;
text-align:center;
}
.articles-list .article-item .article-item-main *{
text-align:center;
}
.articles-list .article-item .article-item-main .baneer{
border-radius:100%;
height:120px!important;
border:2px solid var(--primary-color-darkest);
width:120px!important;
}
.articles-list .article-item .infos{}
.articles-list .article-item .infos .authors{}
.articles-list .article-item .infos .authors .author{color:var(--primary-color-darkest);font-weight:600}
.blogarticle{
display:flex;
flex-direction:column;
}
.blogarticle .blogarticlehead{
display:flex;
flex-direction:row;
}
.blogarticle .blogarticletitle{
flex:2 0;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
/*font-weight:700;
font-size:200%;
text-decoration:underline;
color:var(--primary-color);*/
}
.blogarticle .blogarticleinfos {
display:flex;
flex-direction:row;
background-color:var(--tertiary-medium-dark-color);
color:var(--primary-color-darklight);
justify-content: space-around;
align-items: center;
padding: 20px;
width:fit-content;
}
.blogarticle .blogarticleinfos .categories {}
.blogarticle .blogarticleinfos .category {
background-color:var(--primary-color);
color:var(--primary-color-contrast);
display:inline-block;
padding:5px;
}
.blogarticle .blogarticleinfos .tags {}
.blogarticle .blogarticleinfos .tag {
background-color:var(--primary-color);
color:var(--primary-color-contrast);
display:inline-block;
padding:5px;
}
.blogarticle .blogarticleinfos .authors{}
.blogarticle .blogarticleinfos .authors .author{ color:var(--primary-color-4); font-weight:500; text-decoration:underline;}
.blogarticle .blogarticleinfos .date{}
.blogarticle .blogarticlecontent{padding: 10px 30px;}
.blogarticle .blogarticlecomments{}
/* width */
::-webkit-scrollbar {
width: 10px;
}
/* Track */
::-webkit-scrollbar-track {
box-shadow: inset 0 0 5px grey;
background: var(--secondary-color-darklight);
}
/* Handle */
::-webkit-scrollbar-thumb {
background: var(--primary-color-darklight);
}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
background: var(--primary-color-darkest);
}
@media (max-width:700px){
*.desktop-only-element{
display:none !important;
}
}
@media (min-width: 700px){
*.mobile-only-element{
display:none !important;
}
}

View file

@ -0,0 +1,13 @@
document.addEventListener('DOMContentLoaded',function(){
if($('.carousel').length>1){
$('.carousel').each(i=>{
let toslick = $(i).attr('data-to-slick')
console.log(toslick)
$(i).slick(JSON.parse(toslick));
});
}else{
let toslick = $('.carousel').attr('data-to-slick')
console.log(toslick)
$('.carousel').slick(JSON.parse(toslick));
}
})