diff --git a/index.html b/index.html index e93a903..a175e46 100644 --- a/index.html +++ b/index.html @@ -1,18 +1,43 @@ - - - - - Alperen İsa Nalbant - - - -
-
-

Site yapım aşamasında.

-

Lütfen daha sonra tekrar gelin.


- GitHub - Web sitenin kaynak kodu -
-
- + + + + + + + + Alperen'nin Web Sitesi + + + + + +
+

Alperen İsa Nalbant

+
+
+ Hakkımda +
+

+ Ben 13 yaşında bir GNU/Linux kullanısıyım. 10 yaşımda + GNU/Linux ile tanıştım ve 11 yaşımda Python öğrenmeye çalıştım. + Şimdi ise Libadwaita ve web siteleri + üzerinde odaklanıyorum. +

+
+
+
+
Projeler
+
+
+
+
Blog (yakında)
+
+
+
Bana ulaşın
+
+
+
+
+ + \ No newline at end of file diff --git a/style.css b/style.css index 40de9af..18d59a2 100644 --- a/style.css +++ b/style.css @@ -1,63 +1,190 @@ -#center { - display: flex; - padding: 2vh 2vw; - height: 90vh; - min-height: 300px; - max-width: 100%; - align-items: center; - justify-content: center; -} - -* { - padding: 0; - margin: 10px; - transition: color background 500ms ease-in-out !important; -} - -.card { - transition: 200ms ease-in-out; - transition: 500ms ease-in-out; - background: #fafafa; - padding: 30px 20px; - border: 1px solid #e0e0e0; - border-radius: 12px; - box-shadow: 0 10px 20px -10px #7e7e7e; - font-family: system-ui; -} - -.button { - transition: 200ms ease-in-out; - border: 1px solid #cacdfa; - background: #e5e7fd; - padding: 10px 15px; - color: black; - text-decoration: none; - border-radius: 20px; -} - -.button:hover { - border: 1px solid #b6bbff; - background: #b4baff; - color: blue; -} - -@media (prefers-color-scheme: dark) { - * { - color: white !important; - } - body { - background-color: rgb(20, 20, 20); - } - .card { - background: rgb(17, 17, 17); - border-color: #424242; - box-shadow: 0 10px 20px -10px #080808; - } - .button { - background: #1c1c1f; - } - .button:hover { - background: blue; - border-color: blue; - } +/* CSS reset: start */ +html, body, div, span, object, iframe, +h1, h2, h3, h4, h5, h6, p, blockquote, pre, +abbr, address, cite, code, +del, dfn, em, img, ins, kbd, q, samp, +small, strong, sub, sup, var, +b, i, +dl, dt, dd, ol, ul, li, +fieldset, form, label, legend, +table, caption, tbody, tfoot, thead, tr, th, td, +article, aside, canvas, details, figcaption, figure, +footer, header, hgroup, menu, nav, section, summary, +time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + outline: 0; + font-size: 100%; + vertical-align: baseline; + background: transparent; +} + +body { + line-height: 1; +} + +article,aside,details,figcaption,figure, +footer,header,hgroup,menu,nav,section { + display: block; +} + +nav ul { + list-style :none; +} + +blockquote, q { + quotes: none; +} + +blockquote:before, blockquote:after, +q:before, q:after { + content: ''; + content: none; +} + +a { + margin: 0; + padding: 0; + font-size: 100%; + vertical-align: baseline; + background: transparent; +} + +table { + border-collapse: collapse; + border-spacing: 0; +} + +input, select { + vertical-align :middle; +} +/* CSS reset: end */ + +:root { + --primary: #006b53; + --on-primary: #ffffff; + --primary-container: #1dffcf; + --on-primary-container: #002117; + --secondary: #4b635a; + --on-secondary: #ffffff; + --secondary-container: #cee9dd; + --on-secondary-container: #072018; + --tertiary: #406376; + --on-tertiary: #ffffff; + --tertiary-container: #c3e7fe; + --on-tertiary-container: #001e2c; + --error: #B3261E; + --on-error: #FFFFFF; + --error-container: #F9DEDC; + --on-error-container: #410E0B; + --background: #fbfdfa; + --on-background: #e1e3e0; + --surface: #fbfdfa; + --on-surface: #191c1b; + --outline: #79747E; + --outline-surface-variant: #E7E0EC; + --on-outline-surface-variant: #49454F; +} +@media (prefers-color-scheme: light) { + :root { + --primary: #006b53; + --on-primary: #ffffff; + --primary-container: #1dffcf; + --on-primary-container: #002117; + --secondary: #4b635a; + --on-secondary: #ffffff; + --secondary-container: #cee9dd; + --on-secondary-container: #072018; + --tertiary: #406376; + --on-tertiary: #ffffff; + --tertiary-container: #c3e7fe; + --on-tertiary-container: #001e2c; + --error: #B3261E; + --on-error: #FFFFFF; + --error-container: #F9DEDC; + --on-error-container: #410E0B; + --background: #fbfdfa; + --on-background: #e1e3e0; + --surface: #fbfdfa; + --on-surface: #191c1b; + --outline: #79747E; + --outline-surface-variant: #E7E0EC; + --on-outline-surface-variant: #49454F; + } +} +@media (prefers-color-scheme: dark) { + :root { + --primary: #00e0b2; + --on-primary: #00382a; + --primary-container: #00513e; + --on-primary-container: #1bffd0; + --secondary: #b2ccc1; + --on-secondary: #1d352d; + --secondary-container: #344b43; + --on-secondary-container: #cee9dd; + --tertiary: #a8cce2; + --on-tertiary: #0d3446; + --tertiary-container: #284b5e; + --on-tertiary-container: #c3e7fe; + --error: #ffb4a9; + --on-error: #680003; + --error-container: #930006; + --on-error-container: #ffdad4; + --background: #191c1b; + --on-background: #e1e3e0; + --surface: #191c1b; + --on-surface: #e1e3e0; + --outline: #89938e; + --outline-surface-variant: #3f4945; + --on-outline-surface-variant: #bfc9c3; + } + aside img { + color: var(--on-background); + } +} +* { + font-family: cantarell, system-ui; +} +h1, h2, h3 { + font-family: Prompt, system-ui; +} +body { + background: var(--surface); +} +h1 { + font-size: 60px; +} +h2 { + font-size: 40px; +} +h3 { + font-size: 30px; +} +h4 { + font-size: 25px; +} +header { + display: flex; + align-items: center; + padding: 20px; + background: var(--surface); + position: sticky; + top: 0; +} +header a { + font-family: Prompt; + font-weight: 500; + color: var(--on-surface); + text-decoration: none; +} + +aside img { + width: 25px; + +} +aside img::before { + height: 30px; + width: 50px; + background: var(--on-primary); } \ No newline at end of file