commit e48f9f8918aa5f7740aaae55033c19329a371d09 Author: asandikci Date: Thu Nov 9 17:10:13 2023 +0300 initial commit diff --git a/about.html b/about.html new file mode 100644 index 0000000..d13da22 --- /dev/null +++ b/about.html @@ -0,0 +1,86 @@ + + + + + + + + + + + + + + + + + + + + + + Hakkımızda | iflpanel + + + + + +
+ + +
+ + + +
+
+

Hakkımızda

+
+

iflpanel, topluluk ekosistemi kurmak için ortaya çıkmış bir + girişimdir. Topluluğun ihtiyaçlarını göz önünde bulundurarak ortak çalışmaya dayalı uygulamalar ile verimi en + üst seviyeye çıkarmayı amaçlar. Sağladığı servisler ile kullanıcıların, editörlerin ve yöneticilerin + işlemlerini hızlı bir şekilde gerçekleştirmesine olanak sağlar. Aynı zamanda topluluğun verilerini kendi + içinde tutmasını sağlayarak büyük şirketler tarafından kullanılmasını engeller ve dışa bağımlılığı azaltır. +

+
+

SSA VPN

+

kesintisiz, hızlı, gizli ve güvenli VPN servisimiz. Fatih (MEB) internetinde çalışır. Detaylı bilgi için VPN bilgi sayfamızı ziyaret edebilirsiniz

+

Galeri

+

Topluluk için Galeri servisi. Fotoğraflarınızı orijinal boyutunda saklar. Topluluk Editörleri; + etiketler, albümler ve açıklamalar ile kolay sınıflandırma yapabilir. Kullanıcılar ise yorum yapma ve puanlama + özellikleri sayesinde etikileşimde bulunabilir.

+

Kütüphane

+

Topluluk için Kütüphane servisi. Pdf ve diğer dosya formatlarını yükleyebilirsiniz.

+

Anket

+

Topluluk Editörleri için gelişmiş anket servisi. Kullanıcı verilerinizi ustalıkla yönetmenizi ve özelleşmiş + anketler oluşturmanızı sağlar. Detaylı bilgi için Editörler için Anket + Kullanımı - Hızlı Bakış sayfasına göz atabilirsiniz.

+

Wiki

+

Servislerin kullanım ayrıntıları için wiki

+
+

+

Giderlerimizi karşılamamızda yardımcı olmak için bağış yapmayı düşünebilirsiniz +
+

+

Aliberk Sandıkçı - 2023

+
+
+ +
+
2023 © Aliberk Sandıkçı
+
+
+ + + \ No newline at end of file diff --git a/assets/css/main.css b/assets/css/main.css new file mode 100644 index 0000000..95a7666 --- /dev/null +++ b/assets/css/main.css @@ -0,0 +1,410 @@ +.ssavpn-logo:before { + display: inline-block; + position: absolute; + width: 48px; + height: 48px; + background-size: 48px; + background-repeat: no-repeat; + left: 10%; + z-index: 10; + content: " "; + background-image: url("https://vpn.iflpanel.com/assets/iflpanel/ssavpn48x48.png"); +} + +.android-logo:before { + display: inline-block; + position: absolute; + width: 48px; + height: 48px; + background-size: 48px; + background-repeat: no-repeat; + left: 10%; + z-index: 10; + content: " "; + background-image: url("/assets/images/misc/android-logo.png"); +} + +@keyframes shake-x { + 0% { + transform: translate(0, 0); + } + 5% { + transform: translate(5px, 0); + } + 10% { + transform: translate(0, 0); + } + 15% { + transform: translate(5px, 0); + } + 20% { + transform: translate(0, 0); + } + 25% { + transform: translate(5px, 0); + } + 30% { + transform: translate(0, 0); + } + 100% { + transform: translate(0, 0); + } +} +.HIDDEN { + display: none; +} + +html, +body { + display: flex; + flex-direction: column; + box-sizing: border-box; + height: 100%; + padding: 0; + margin: 0; + font-family: "Noto Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", Arial, "Helvetica Neue", sans-serif; + background-color: #131a21; + color: #EEEEEE; +} +html header, +body header { + display: flex; + align-items: center; + justify-content: left; + padding: 0px 10px; + min-height: 60px; + background-color: #131a21; + border-bottom: #00ADB5 0.2vh solid; + user-select: none; +} +html header #hlogo > img, +body header #hlogo > img { + max-height: 45px; + max-width: 200px; + margin-top: 5px; + padding: auto; +} +html nav, +body nav { + display: flex; + flex-direction: row; + margin-left: auto; +} +html nav ul, +body nav ul { + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: center; + align-items: center; + column-gap: 20px; + box-sizing: border-box; + margin: 0px; + padding: 0px; + list-style-type: none; +} +html article, +body article { + display: flex; + flex-direction: column; + justify-content: flex-start; + align-items: start; + gap: 10px; + width: auto; + min-height: 100%; + box-sizing: border-box; +} +html article h1, +body article h1 { + align-self: center; + text-align: center; + font-size: xx-large; +} +html article h2, +body article h2 { + align-self: center; + text-align: center; + font-size: x-large; + text-decoration: underline; + text-wrap: balance; +} +html article h3, +body article h3 { + align-self: center; +} +html article.plain, +body article.plain { + background-color: #393E46; + border: #10161d double 3px; + padding: 10px; +} +html article.sections, +body article.sections { + margin-block-start: 10px; +} +html article.sections > .section, +body article.sections > .section { + display: flex; + flex-direction: column; + align-self: center; + box-sizing: border-box; + width: 95vw; + background-color: #393E46; +} +html article.sections > .section:first-child, +body article.sections > .section:first-child { + border-top-left-radius: 10px; + border-top-right-radius: 10px; + border-bottom-right-radius: 0px; + border-bottom-left-radius: 0px; +} +html article.sections > .section:last-child, +body article.sections > .section:last-child { + border-top-right-radius: 0px; + border-top-left-radius: 0px; + border-bottom-left-radius: 10px; + border-bottom-right-radius: 10px; +} +html article.sections > .section:only-child, +body article.sections > .section:only-child { + border-top-right-radius: 10px; + border-top-left-radius: 10px; + border-bottom-left-radius: 10px; + border-bottom-right-radius: 10px; +} +html article.sections > .section .grid, +body article.sections > .section .grid { + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: center; + align-items: center; + column-gap: 20px; + box-sizing: border-box; + margin: 0px; + padding: 0px; + list-style-type: none; +} +html article.sections > .section .grid .element, +body article.sections > .section .grid .element { + width: 90%; + box-sizing: border-box; + padding: 0rem 0; + margin: 0.5rem 0; + position: relative; + text-align: center; + border: #EEEEEE groove 2px; + background-color: #222831; +} +html article.sections > .section .grid .element:first-child, +body article.sections > .section .grid .element:first-child { + border-top-left-radius: 10px; + border-top-right-radius: 10px; + border-bottom-right-radius: 0px; + border-bottom-left-radius: 0px; +} +html article.sections > .section .grid .element:last-child, +body article.sections > .section .grid .element:last-child { + border-top-right-radius: 0px; + border-top-left-radius: 0px; + border-bottom-left-radius: 10px; + border-bottom-right-radius: 10px; +} +html article.sections > .section .grid .element:only-child, +body article.sections > .section .grid .element:only-child { + border-top-right-radius: 10px; + border-top-left-radius: 10px; + border-bottom-left-radius: 10px; + border-bottom-right-radius: 10px; +} +html article.sections > .section .grid .element p, +body article.sections > .section .grid .element p { + padding: 0 0.5rem; + flex-grow: 1; +} +html article.sections > .section .grid .element p.explanation, +body article.sections > .section .grid .element p.explanation { + margin-top: 3px; +} +html article.sections > .section .grid .element h3.with-explanation, +body article.sections > .section .grid .element h3.with-explanation { + font-size: x-large; + margin-bottom: 0; +} +html article.sections > .section .grid > .hover, +body article.sections > .section .grid > .hover { + transition: transform 1.2s cubic-bezier(0.075, 0.82, 0.165, 1); +} +html article.sections > .section .grid > .hover:hover, +body article.sections > .section .grid > .hover:hover { + transform: translateX(15px); +} +@media screen and (min-width: 768px) { + html article.sections > .section .grid2x2 > .element, + body article.sections > .section .grid2x2 > .element { + width: 45%; + } + html article.sections > .section .grid2x2 > .element:first-child, + body article.sections > .section .grid2x2 > .element:first-child { + border-top-right-radius: 0px; + border-top-left-radius: 10px; + border-bottom-left-radius: 0px; + border-bottom-right-radius: 0px; + } + html article.sections > .section .grid2x2 > .element:nth-child(2), + body article.sections > .section .grid2x2 > .element:nth-child(2) { + border-top-right-radius: 10px; + border-top-left-radius: 0px; + border-bottom-left-radius: 0px; + border-bottom-right-radius: 0px; + } + html article.sections > .section .grid2x2 > .element:nth-last-child(2), + body article.sections > .section .grid2x2 > .element:nth-last-child(2) { + border-top-right-radius: 0px; + border-top-left-radius: 0px; + border-bottom-left-radius: 10px; + border-bottom-right-radius: 0px; + } + html article.sections > .section .grid2x2 > .element:last-child, + body article.sections > .section .grid2x2 > .element:last-child { + border-top-right-radius: 0px; + border-top-left-radius: 0px; + border-bottom-left-radius: 0px; + border-bottom-right-radius: 10px; + } + html article.sections > .section .grid2x2 > .hover:hover, + body article.sections > .section .grid2x2 > .hover:hover { + transform: translateY(-15px); + } +} +html article.sections > .section .grid-img > .element, +body article.sections > .section .grid-img > .element { + display: flex; + flex-direction: row; + align-items: center; + justify-content: flex-start; +} +html article.sections > .section .grid-img > .element div.block, +body article.sections > .section .grid-img > .element div.block { + flex-grow: 2; + display: block; +} +html article.sections > .section .grid-img > .element div.block > h3, +body article.sections > .section .grid-img > .element div.block > h3 { + text-align: center; + text-wrap: balance; + font-size: x-large; +} +html article.sections > .section .grid-img > .element img, +body article.sections > .section .grid-img > .element img { + margin-left: 1vw; + width: 50px; +} +html article.sections > .section .grid-plain > .element, +body article.sections > .section .grid-plain > .element { + width: 80%; + border: none; + background-color: inherit; + list-style-type: disc; + text-align: justify; + text-align-last: left; + line-break: loose; +} +html article.sections > .section > .note, +body article.sections > .section > .note { + font-style: italic; + text-align: center; + margin: 1vh 1vw; +} +html article.sections > .section > .note > .symbol, +body article.sections > .section > .note > .symbol { + display: inline-block; + animation: shake-x 4.72s ease infinite; + transform-origin: 50% 50%; +} +html footer, +body footer { + display: flex; + flex-direction: column; + align-items: center; + justify-content: space-evenly; + min-height: 50px; + background-color: #10161d; + border-top: #00ADB5 0.2vh solid; + margin-top: auto; + margin-block-start: 10px; + padding-top: 10px; +} +html a, +body a { + background-color: transparent; + text-decoration: none; +} +html a:link, +body a:link { + color: #00ADB5; +} +html a:visited, +body a:visited { + color: #129da3; +} +html a:hover, +body a:hover { + color: #00adb5; + text-decoration: underline; +} +html a:active, +body a:active { + color: #2d8488; +} +html .main-scrollable, +body .main-scrollable { + height: 100%; + overflow-y: auto; + -ms-overflow-style: none; + scrollbar-width: none; +} +html .main-scrollable::-webkit-scrollbar, +body .main-scrollable::-webkit-scrollbar { + display: none; +} +html .tooltip, +body .tooltip { + position: relative; + display: inline-block; +} +html .tooltip .tooltiptext, +body .tooltip .tooltiptext { + visibility: hidden; + width: 140px; + background-color: #555; + color: #fff; + text-align: center; + border-radius: 6px; + padding: 5px; + position: absolute; + z-index: 1; + bottom: 150%; + left: 50%; + margin-left: -75px; + opacity: 0; + transition: opacity 0.3s; +} +html .tooltip .tooltiptext::after, +body .tooltip .tooltiptext::after { + content: ""; + position: absolute; + top: 100%; + left: 50%; + margin-left: -5px; + border-width: 5px; + border-style: solid; + border-color: #555 transparent transparent transparent; +} +html .tooltip:hover .tooltiptext, +body .tooltip:hover .tooltiptext { + visibility: visible; + opacity: 1; +} + +/*# sourceMappingURL=main.css.map */ diff --git a/assets/css/main.css.map b/assets/css/main.css.map new file mode 100644 index 0000000..c56c036 --- /dev/null +++ b/assets/css/main.css.map @@ -0,0 +1 @@ +{"version":3,"sourceRoot":"","sources":["../scss/_images.scss","../scss/_animation.scss","../scss/main.scss","../scss/_fonts.scss","../scss/_colors.scss","../scss/_header.scss","../scss/_nav.scss","../scss/_article.scss","../scss/_utils.scss","../scss/_footer.scss","../scss/_copy.scss"],"names":[],"mappings":"AAGE;EACE;EACA;EAEA;EACA;EACA;EACA;EAEA;EACA;EAEA;EACA;;;AAbF;EACE;EACA;EAEA;EACA;EACA;EACA;EAEA;EACA;EAEA;EACA;;;AChBJ;EACE;IACE;;EAGF;IACE;;EAGF;IACE;;EAGF;IACE;;EAGF;IACE;;EAGF;IACE;;EAGF;IACE;;EAGF;IACE;;;AClBJ;EACE;;;AAGF;AAAA;EAEE;EACA;EAEA;EACA;EAEA;EACA;EAEA,aC3BM;ED4BN,kBEjBS;EFkBT,OEXa;;AFeb;AAAA;EG9BA;EACA;EACA;EAEA;EACA;EAEA,kBDCS;ECAT;EAEA;;AAEA;AAAA;EACE;EACA;EACA;EACA;;AHmBF;AAAA;EIrCA;EACA;EACA;;AAEA;AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EAEA;;AJ0BF;AAAA;EKtCA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;;AAEA;AAAA;EACE;EACA;EACA;;AAGF;AAAA;EACE;EACA;EACA;EACA;EACA;;AAGF;AAAA;EACE;;ALiBA;AAAA;EKZF,kBHfa;EGgBb;EACA;;ALcE;AAAA;EKVF;;AAEA;AAAA;EACE;EACA;EACA;EAEA;EACA;EAEA,kBH/BW;;AIVb;AAAA;EACE,wBDyCgC;ECxChC,yBDwCgC;ECvChC;EACA;;AAGF;AAAA;EACE;EACA;EACA,2BDgCgC;EC/BhC,4BD+BgC;;AC5BlC;AAAA;EACE,yBD2BgC;EC1BhC,wBD0BgC;ECzBhC,2BDyBgC;ECxBhC,4BDwBgC;;AAGhC;AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EAEA;;AAEA;AAAA;EACE;EACA;EACA;EACA;EACA;EAEA;EAEA;EACA,kBH5DO;;AITb;AAAA;EACE,wBDqEoC;ECpEpC,yBDoEoC;ECnEpC;EACA;;AAGF;AAAA;EACE;EACA;EACA,2BD4DoC;EC3DpC,4BD2DoC;;ACxDtC;AAAA;EACE,yBDuDoC;ECtDpC,wBDsDoC;ECrDpC,2BDqDoC;ECpDpC,4BDoDoC;;AAEhC;AAAA;EACE;EACA;;AAEA;AAAA;EACE;;AAIJ;AAAA;EACE;EACA;;AAIJ;AAAA;EACE;;AAEA;AAAA;EACE;;AAMJ;EACE;AAAA;IACE;;EC3ER;AAAA;IACE;IACA,wBD0E+B;ICzE/B;IACA;;EAGF;AAAA;IACE,yBDoE+B;ICnE/B;IACA;IACA;;EAGF;AAAA;IACE;IACA;IACA,2BD2D+B;IC1D/B;;EAGF;AAAA;IACE;IACA;IACA;IACA,4BDmD+B;;EAIzB;AAAA;IACE;;;AAQN;AAAA;EACE;EACA;EACA;EACA;;AAEA;AAAA;EACE;EACA;;AAEA;AAAA;EACE;EACA;EACA;;AAIJ;AAAA;EACE;EACA;;AAOJ;AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAKJ;AAAA;EAOE;EACA;EACA;;AARA;AAAA;EACE;EACA;EACA;;AL5GN;AAAA;EOtDA;EACA;EACA;EACA;EAEA;EACA,kBLCS;EKAT;EAEA;EACA;EAEA;;AP+CA;AAAA;EACE;EACA;;AAEA;AAAA;EACE,OE9CS;;AFiDX;AAAA;EACE;;AAGF;AAAA;EACE;EACA;;AAGF;AAAA;EACE;;AAIJ;AAAA;EACE;EACA;EMjFF;EACA;;AALA;AAAA;EACE;;AEDF;AAAA;EACE;EACA;;AAGF;AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;AAAA;EACE;EACA","file":"main.css"} \ No newline at end of file diff --git a/assets/images/icons/favicon.png b/assets/images/icons/favicon.png new file mode 100644 index 0000000..10bf2ab Binary files /dev/null and b/assets/images/icons/favicon.png differ diff --git a/assets/images/icons/logo.png b/assets/images/icons/logo.png new file mode 100644 index 0000000..a573172 Binary files /dev/null and b/assets/images/icons/logo.png differ diff --git a/assets/js/copy.js b/assets/js/copy.js new file mode 100644 index 0000000..eea525f --- /dev/null +++ b/assets/js/copy.js @@ -0,0 +1,11 @@ +function copy2Clipboard(id) { + var copyText = document.getElementById(id); + + // copyText.select(); + // copyText.setSelectionRange(0, 99999); // For mobile devices + + navigator.clipboard.writeText(copyText.innerHTML); + + var tooltip = document.getElementById(id+'-tip'); + tooltip.innerHTML = "Kopyalandı: " + copyText.innerHTML; +} \ No newline at end of file diff --git a/assets/js/main.js b/assets/js/main.js new file mode 100644 index 0000000..e69de29 diff --git a/assets/scss/_animation.scss b/assets/scss/_animation.scss new file mode 100644 index 0000000..3103fb8 --- /dev/null +++ b/assets/scss/_animation.scss @@ -0,0 +1,33 @@ +@keyframes shake-x { + 0% { + transform: translate(0, 0) + } + + 5%{ + transform: translate(5px, 0) + } + + 10% { + transform: translate(0, 0) + } + + 15% { + transform: translate(5px, 0) + } + + 20% { + transform: translate(0, 0) + } + + 25% { + transform: translate(5px, 0) + } + + 30% { + transform: translate(0, 0) + } + + 100% { + transform: translate(0, 0) + } +} diff --git a/assets/scss/_article.scss b/assets/scss/_article.scss new file mode 100644 index 0000000..824bce0 --- /dev/null +++ b/assets/scss/_article.scss @@ -0,0 +1,174 @@ +@use "colors" as c; +@use "utils" as util; +@use "animation"; + +@mixin main { + display: flex; + flex-direction: column; + justify-content: flex-start; + align-items: start; + gap: 10px; + + width: auto; + min-height: 100%; + box-sizing: border-box; + + h1 { + align-self: center; + text-align: center; + font-size: xx-large; + } + + h2 { + align-self: center; + text-align: center; + font-size: x-large; + text-decoration: underline; + text-wrap: balance; + } + + h3 { + align-self: center; + } +} + +@mixin plain { + background-color: c.$lighter; + border: c.$dark double 3px; + padding: 10px; +} + +@mixin sections { + margin-block-start: 10px; + + >.section { + display: flex; + flex-direction: column; + align-self: center; + + box-sizing: border-box; + width: 95vw; + + background-color: c.$lighter; + @include util.border-first-last(10px); + + // Grid Sizes + .grid { + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: center; + align-items: center; + column-gap: 20px; + box-sizing: border-box; + + margin: 0px; + padding: 0px; + + list-style-type: none; + + .element { + width: 90%; + box-sizing: border-box; + padding: 0rem 0; + margin: 0.5rem 0; + position: relative; + + text-align: center; + + border: c.$text groove 2px; + background-color: c.$light; + @include util.border-first-last(10px); + + p { + padding: 0 0.5rem; + flex-grow: 1; + + &.explanation { + margin-top: 3px; + } + } + + h3.with-explanation { + font-size: x-large; + margin-bottom: 0; + } + } + + >.hover { + transition: transform 1.2s cubic-bezier(0.075, 0.82, 0.165, 1); + + &:hover { + transform: translateX(15px); + } + } + } + + .grid2x2 { + @media screen and (min-width:768px) { + >.element { + width: 45%; + @include util.border-2x2(10px); + } + + >.hover { + &:hover { + transform: translateY(-15px); + } + } + } + } + + // Extra Grid Types + .grid-img { + >.element { + display: flex; + flex-direction: row; + align-items: center; + justify-content: flex-start; + + div.block { + flex-grow: 2; + display: block; + + >h3 { + text-align: center; + text-wrap: balance; + font-size: x-large; + } + } + + img { + margin-left: 1vw; + width: 50px; + // aspect-ratio: 1/1; + } + } + } + + .grid-plain { + >.element { + width: 80%; + border: none; + background-color: inherit; + list-style-type: disc; + text-align:justify; + text-align-last:left; + line-break:loose; + } + } + + // Extra Section Elements + >.note { + >.symbol { + display: inline-block; + animation: shake-x 4.72s ease infinite; + transform-origin: 50% 50%; + } + + font-style: italic; + text-align: center; + margin: 1vh 1vw; + } + } +} \ No newline at end of file diff --git a/assets/scss/_colors.scss b/assets/scss/_colors.scss new file mode 100644 index 0000000..f0dc35e --- /dev/null +++ b/assets/scss/_colors.scss @@ -0,0 +1,34 @@ +//! Copyright 2023, Aliberk Sandıkçı +// See active color palettes at the end of the file +// LINK ./_colors.scss#active + + +// +// COLOR PALETTES +// + +// Forgejo color palette +$forgejo0: #10161d; +$forgejo1: #131a21; +$forgejo2: #171e26; +$forgejo3: #2b3642; +$forgejo4: #d2e0f0; +$forgejo5: #fb923c; + +// Colorhunt-1 color palette, https://colorhunt.co/palette/222831393e4600adb5eeeeee +$colorhunt1-0: #EEEEEE; +$colorhunt1-1: #222831; +$colorhunt1-2: #393E46; +$colorhunt1-3: #00ADB5; + + + +// ANCHOR[id=active] +// Active color palette +$bg: $forgejo1; +$accent: $colorhunt1-3; + +$dark: $forgejo0; +$light: $colorhunt1-1; +$lighter: $colorhunt1-2; +$text: $colorhunt1-0; \ No newline at end of file diff --git a/assets/scss/_copy.scss b/assets/scss/_copy.scss new file mode 100644 index 0000000..faf1e0f --- /dev/null +++ b/assets/scss/_copy.scss @@ -0,0 +1,39 @@ +@mixin copy{ + .tooltip { + position: relative; + display: inline-block; + } + + .tooltip .tooltiptext { + visibility: hidden; + width: 140px; + background-color: #555; + color: #fff; + text-align: center; + border-radius: 6px; + padding: 5px; + position: absolute; + z-index: 1; + bottom: 150%; + left: 50%; + margin-left: -75px; + opacity: 0; + transition: opacity 0.3s; + } + + .tooltip .tooltiptext::after { + content: ""; + position: absolute; + top: 100%; + left: 50%; + margin-left: -5px; + border-width: 5px; + border-style: solid; + border-color: #555 transparent transparent transparent; + } + + .tooltip:hover .tooltiptext { + visibility: visible; + opacity: 1; + } +} \ No newline at end of file diff --git a/assets/scss/_fonts.scss b/assets/scss/_fonts.scss new file mode 100644 index 0000000..574a51a --- /dev/null +++ b/assets/scss/_fonts.scss @@ -0,0 +1 @@ +$font1: "Noto Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", Arial, 'Helvetica Neue', sans-serif; \ No newline at end of file diff --git a/assets/scss/_footer.scss b/assets/scss/_footer.scss new file mode 100644 index 0000000..477c522 --- /dev/null +++ b/assets/scss/_footer.scss @@ -0,0 +1,21 @@ +@use "colors" as c; + +@mixin main { + display: flex; + flex-direction: column; + align-items: center; + justify-content: space-evenly; + + min-height: 50px; + background-color: c.$dark; + border-top: c.$accent 0.2vh solid; + + margin-top: auto; + margin-block-start: 10px; + + padding-top: 10px; + + div { + text-align: center; + } +} \ No newline at end of file diff --git a/assets/scss/_header.scss b/assets/scss/_header.scss new file mode 100644 index 0000000..f63587c --- /dev/null +++ b/assets/scss/_header.scss @@ -0,0 +1,22 @@ +@use "colors" as c; + +@mixin main { + display: flex; + align-items: center; + justify-content: left; + + padding: 0px 10px; + min-height: 60px; + + background-color: c.$bg; + border-bottom: c.$accent 0.2vh solid; + + user-select: none; + + #hlogo>img { + max-height: 45px; + max-width: 200px; + margin-top:5px; + padding:auto; + } +} \ No newline at end of file diff --git a/assets/scss/_images.scss b/assets/scss/_images.scss new file mode 100644 index 0000000..dc17174 --- /dev/null +++ b/assets/scss/_images.scss @@ -0,0 +1,27 @@ +// POSSIBLE DEPRECATED + +@mixin logo-default ($image-path) { + &:before { + display: inline-block; + position: absolute; + + width: 48px; + height: 48px; + background-size: 48px; + background-repeat: no-repeat; + + left: 10%; + z-index: 10; + + content: " "; + background-image: url($image-path) + } +} + +.ssavpn-logo { + @include logo-default("https://vpn.iflpanel.com/assets/iflpanel/ssavpn48x48.png"); +} + +.android-logo { + @include logo-default("/assets/images/misc/android-logo.png"); +} \ No newline at end of file diff --git a/assets/scss/_nav.scss b/assets/scss/_nav.scss new file mode 100644 index 0000000..bef7dcb --- /dev/null +++ b/assets/scss/_nav.scss @@ -0,0 +1,20 @@ +@mixin main { + display: flex; + flex-direction: row; + margin-left: auto; + + ul { + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: center; + align-items: center; + column-gap: 20px; + box-sizing: border-box; + + margin: 0px; + padding: 0px; + + list-style-type: none; + } +} \ No newline at end of file diff --git a/assets/scss/_utils.scss b/assets/scss/_utils.scss new file mode 100644 index 0000000..7a839c0 --- /dev/null +++ b/assets/scss/_utils.scss @@ -0,0 +1,64 @@ +@mixin hide-scroll { + &::-webkit-scrollbar { + display: none + } + + -ms-overflow-style: none; // Edge + scrollbar-width: none; // Firefox +} + +@mixin border-first-last($radius) { + &:first-child { + border-top-left-radius: $radius; + border-top-right-radius: $radius; + border-bottom-right-radius: 0px; + border-bottom-left-radius: 0px; + } + + &:last-child { + border-top-right-radius: 0px; + border-top-left-radius: 0px; + border-bottom-left-radius: $radius; + border-bottom-right-radius: $radius; + } + + &:only-child { + border-top-right-radius: $radius; + border-top-left-radius: $radius; + border-bottom-left-radius: $radius; + border-bottom-right-radius: $radius; + } +} + +@mixin border-2x2($radius) { + + &:first-child { + border-top-right-radius: 0px; + border-top-left-radius: $radius; + border-bottom-left-radius: 0px; + border-bottom-right-radius: 0px; + } + + &:nth-child(2) { + border-top-right-radius: $radius; + border-top-left-radius: 0px; + border-bottom-left-radius: 0px; + border-bottom-right-radius: 0px; + } + + &:nth-last-child(2) { + border-top-right-radius: 0px; + border-top-left-radius: 0px; + border-bottom-left-radius: $radius; + border-bottom-right-radius: 0px; + } + + &:last-child { + border-top-right-radius: 0px; + border-top-left-radius: 0px; + border-bottom-left-radius: 0px; + border-bottom-right-radius: $radius; + } + + +} \ No newline at end of file diff --git a/assets/scss/main.scss b/assets/scss/main.scss new file mode 100644 index 0000000..2253cdd --- /dev/null +++ b/assets/scss/main.scss @@ -0,0 +1,92 @@ +//! Copyright 2023, Aliberk Sandıkçı +@use "colors" as c; +@use "fonts" as font; +@use "utils" as util; +@use "images" as im; +@use "copy" as copy; + +@use "header" as h; +@use "nav" as n; +@use "article" as a; +@use "footer" as f; + +.HIDDEN { + display: none; +} + +html, +body { + display: flex; + flex-direction: column; + + box-sizing: border-box; + height: 100%; + + padding: 0; + margin: 0; + + font-family: font.$font1; + background-color: c.$bg; + color: c.$text; + + + // Header Types + header { + @include h.main; + } + + // Navigation Menu Types + nav { + @include n.main + } + + // Article Types + article { + + @include a.main; + + &.plain { + @include a.plain; + } + + &.sections { + @include a.sections; + } + } + + // Footer Types + footer { + @include f.main; + } + + // General + a { + background-color: transparent; + text-decoration: none; + + &:link { + color: c.$accent; + } + + &:visited { + color: desaturate($color: c.$accent, $amount: 20); + } + + &:hover { + color: saturate($color: c.$accent, $amount: 100); + text-decoration: underline; + } + + &:active { + color: desaturate($color: c.$accent, $amount: 50); + } + } + + .main-scrollable{ + height: 100%; + overflow-y: auto; + @include util.hide-scroll; + } + + @include copy.copy; +} \ No newline at end of file diff --git a/bagis.html b/bagis.html new file mode 100644 index 0000000..54628a4 --- /dev/null +++ b/bagis.html @@ -0,0 +1,83 @@ + + + + + + + + + + + + + + + + + + + + + + Bağış | iflpanel + + + + + +
+ + +
+ + + +
+
+

Bağış

+
+ TR28 0004 6003 3588 8000 0776 55 | +
+
+
+
+ + 1444318251 | +
+
+
+
+ +

Açıklama kısmını "iflpanel Bağış - isim" şeklinde doldurunuz. Eklediğiniz isim burada gözükecektir

+
+
+
+

Bağışçılar

+

-

+
+
+ +
+
2023 © Aliberk Sandıkçı
+
+
+ + + + + \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..948a7f1 --- /dev/null +++ b/index.html @@ -0,0 +1,146 @@ + + + + + + + + + + + + + + + + + + + + + + iflpanel + + + + + +
+ + +
+ + + +
+ + + +
+ + + \ No newline at end of file