Skip to content

Commit

Permalink
Add about
Browse files Browse the repository at this point in the history
  • Loading branch information
tarikakyol committed Aug 22, 2024
1 parent 2585855 commit 80fdfdf
Show file tree
Hide file tree
Showing 32 changed files with 492 additions and 979 deletions.
File renamed without changes.
File renamed without changes
File renamed without changes.
File renamed without changes.
Binary file added content/pages/About/DSC0439.JPG
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
27 changes: 20 additions & 7 deletions content/pages/About/page.md
Original file line number Diff line number Diff line change
@@ -1,8 +1,21 @@
<style>
body {
background: var(--black);
color: var(--white);
}
</style>
---
date: 08.22.2024
cover: 'DSC0439.JPG'
backgroundColor: '#1f1c19'
textColor: '#faead6'
accentColor: palevioletred
youtube: https://www.youtube.com/watch?v=k-WbLdzU2jc
summary: ''
---
Exploring themselves at the intersection of meditative improvisations and psychedelic oscillations,
with their broad sound spectrum, can wink at any genre of jazz and world music.

This is us. This is about us.
Having released their first album and live session video in 2019, Uç! Uç! followed up with the “Faery Journey” album
and the “Sadness of Illusion” single in November 2023.

In August 2024, they released the album “Feeding the crows by hand”

Onur Nevşehir (Keyboards)
Tarık Akyol (Electronics)
Mustafa Kemal Emirel (Drums)
Hakan Öktem (Visuals)
Binary file added docs/about/DSC0439.JPG
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
29 changes: 17 additions & 12 deletions docs/about/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -44,31 +44,36 @@ <h1 class="header-logo">
<a class="header-menu-link" style="--i: 1" href="/album">albums</a>
<a class="header-menu-link" style="--i: 2" href="/concert">concerts</a>
<a class="header-menu-link" style="--i: 3" href="/performance">performances</a>
<a class="header-menu-link" style="--i: 4" href="/single">singles</a>
</nav>
</header>

<main data-region-id="main" >
<article class="subpage subpage--basic">
<header class="subpage-header">
<h2>About</h2>
<h2 class="subpage-title">About</h2>
</header>
<section class="subpage-content">
<style>
body {
background: var(--black);
color: var(--white);
}
</style>

<p>This is us. This is about us.</p>
<section class="grid-card grid-card-wide">
<div class="subpage-content">

<img
class="subpage-cover "
src="/about/DSC0439.JPG"
alt="">

<p>Exploring themselves at the intersection of meditative improvisations and psychedelic oscillations,<br>with their broad sound spectrum, can wink at any genre of jazz and world music. </p>
<p>Having released their first album and live session video in 2019, Uç! Uç! followed up with the “Faery Journey” album<br>and the “Sadness of Illusion” single in November 2023. </p>
<p>In August 2024, they released the album “Feeding the crows by hand” </p>
<p>Onur Nevşehir (Keyboards)<br>Tarık Akyol (Electronics)<br>Mustafa Kemal Emirel (Drums)<br>Hakan Öktem (Visuals) </p>

<iframe class="subpage-youtube" src="https://www.youtube-nocookie.com/embed/k-WbLdzU2jc" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
</div>
</section>
<footer class="subpage-footer">
<section class="subpage-footer-section">
<table class="subpage-metadata">
<tr class="subpage-metadata-date">
<td>Published at</td>
<td>Aug 16, 2024</td>
<td>Aug 22, 2024</td>
</tr>
</table>
</section>
Expand Down
1 change: 0 additions & 1 deletion docs/album/faerie-journey/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,6 @@ <h1 class="header-logo">
<a class="header-menu-link" style="--i: 1" href="/album">albums</a>
<a class="header-menu-link" style="--i: 2" href="/concert">concerts</a>
<a class="header-menu-link" style="--i: 3" href="/performance">performances</a>
<a class="header-menu-link" style="--i: 4" href="/single">singles</a>
</nav>
</header>

Expand Down
3 changes: 1 addition & 2 deletions docs/album/feed.xml
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,7 @@
<category>album</category>
<category>concert</category>
<category>performance</category>
<category>single</category>
<lastBuildDate>Wed Aug 21 2024 07:47:35 GMT+0100 (British Summer Time)</lastBuildDate>
<lastBuildDate>Thu Aug 22 2024 08:35:28 GMT+0100 (British Summer Time)</lastBuildDate>
<copyright>All rights reserved 2024, Uç! Uç!</copyright>
<docs>https://www.rssboard.org/rss-specification</docs>
<generator>writ-cms</generator>
Expand Down
1 change: 0 additions & 1 deletion docs/album/feeding-the-crows-by-hand/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,6 @@ <h1 class="header-logo">
<a class="header-menu-link" style="--i: 1" href="/album">albums</a>
<a class="header-menu-link" style="--i: 2" href="/concert">concerts</a>
<a class="header-menu-link" style="--i: 3" href="/performance">performances</a>
<a class="header-menu-link" style="--i: 4" href="/single">singles</a>
</nav>
</header>

Expand Down
1 change: 0 additions & 1 deletion docs/album/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,6 @@ <h1 class="header-logo">
<a class="header-menu-link" style="--i: 1" href="/album">albums</a>
<a class="header-menu-link" style="--i: 2" href="/concert">concerts</a>
<a class="header-menu-link" style="--i: 3" href="/performance">performances</a>
<a class="header-menu-link" style="--i: 4" href="/single">singles</a>
</nav>
</header>

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,6 @@ <h1 class="header-logo">
<a class="header-menu-link" style="--i: 1" href="/album">albums</a>
<a class="header-menu-link" style="--i: 2" href="/concert">concerts</a>
<a class="header-menu-link" style="--i: 3" href="/performance">performances</a>
<a class="header-menu-link" style="--i: 4" href="/single">singles</a>
</nav>
</header>

Expand Down
1 change: 1 addition & 0 deletions docs/assets/custom/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -5,3 +5,4 @@
@import url('./style/layouts/grid.css');
@import url('./style/components/header.css');
@import url('./style/components/post.css');
@import url('./style/components/subpage.css');
218 changes: 218 additions & 0 deletions docs/assets/custom/style/components/subpage.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,218 @@
.subpage {
--background-color: var(--black);
--text-color: var(--white);
--title-color: var(--text-color, var(--white));
--accent-color: hotpink;
--gap: min(5vw, 12vh);
--padding-top: 35dvw;
padding-top: var(--padding-top);
min-height: 100dvh;
padding-bottom: 2rem;
display: grid;
grid-template-columns: repeat(
auto-fit,
minmax(
calc(49vw - var(--gap) / 2),
1fr
)
);
justify-items: center;
align-items: center;
gap: var(--gap);
background: var(--background-color);
color: var(--text-color);
}

.subpage-header,.subpage-footer {
align-self: center;
justify-self: center;
grid-column-start: 1;
grid-column-end: -1;
position: relative;
}

.subpage-category-name {
position: absolute;
display: none;
top: 0;
left: 50%;
transform: translateX(-50%) translateY(-120%);
color: var(--accent-color);
text-decoration: none;
font-family: monospace;
font-variant: small-caps;
letter-spacing: 0.1em;
font-size: 1.3em;
font-size: clamp(.8rem, 1.5rem, 2.5dvmin);
}

.subpage-title {
font-size: clamp(.08rem, 6rem, 7dvmin);
font-family: "Montagu Slab", serif;
font-optical-sizing: auto;
font-weight: 600;
font-style: normal;
text-align: center;
line-height: 1.1;
color: var(--title-color);
}

@keyframes title-weight {
33% {
font-weight: 700
}
to {
font-weight: 600
}
}

.subpage-title-link {
color: inherit;
text-decoration-style: wavy;
text-decoration-thickness: 0.08em;
text-underline-offset: 0.2em;
}

.subpage-released {
margin: 0;
display: none;
padding-top: 1em;
font-size: clamp(.8rem, 1.2rem, 2dvmin);
font-family: times, serif;
font-style: italic;
text-align: center;
}

.subpage-content {
font-size: clamp(1rem, 2rem, 3vmin);
}

.subpage-content p {
font-size: clamp(1.1rem, 1.5rem, 4vmin);
padding: 1em 1em 0;
line-height: 1.4;
text-wrap: balance;
letter-spacing: -0.02em;
word-spacing: 0.01em;
}

.subpage-content p:first-of-type {
margin-block-start: 0;
}

.subpage-cover {
text-align: end;
}

.only-card .subpage-cover {
text-align: center;
}

.subpage-spotify {
width: clamp(100%, 320px, 20vw);
height: 55dvh;
}

.subpage-youtube {
width: 100%;
aspect-ratio: 16/9;
max-width: initial;
max-height: initial;
}

/*
* In listing view of subpage (.subpage.summary),
* if there are both cover and spotify or youtube cards (cards taking priority in mobile),
* then initially hide the cover (then adapt to viewport later).
*
* Set display: none to the cover's card.
* Obviously we want to do it when the cover's card is among many.
* */
.subpage.summary .grid-card:not(.only-card):not(.grid-card-wide):has(.subpage-cover) {
display: none;
}

/* and get the mobile card to quack like a .only-card */
.subpage.summary .grid-card:not(.only-card):not(.grid-card-wide):has(.subpage-mobile-poster):nth-child(even) {
grid-column: span 2;
justify-self: center;
padding: 0 1em;
box-sizing: border-box;
}

@media (min-height: 321px) {
.subpage {
--padding-top: 50dvw;
}
}

@media (min-width: 431px) {
.subpage {
--padding-top: 15dvh;
}

.subpage-released {
display: block;
}
}

@media (min-height: 500px) {
.subpage-category-name {
display: inline-block;
}
}

/*
* Dotted underline renders as squares in mobile,
* so use them only on bigger screens.
*
* Similarly, variable font animation is smooth
* only in bigger screens.
* */
@media ((min-width: 420px) and (min-height: 900px)),
((min-width: 900px) and (min-height: 420px)) {
.subpage-title-link {
text-decoration-thickness: 0.12em;
text-decoration-style: dotted;
text-underline-offset: 0.09em;
}

.subpage-title {
font-weight: 100;
}

.active-panel .subpage-title,
.Page-subpage .subpage-title {
animation: title-weight 1s forwards;
}
}

@media (min-width: 700px) {
.subpage-content .subpage-cover {
float: left;
width: 100%;
margin: 0 1.5rem 1.25rem 0;
}

.style-abstract .subpage-cover-image {
object-fit: cover;
height: 50dvh;
}

.subpage-content p {
padding: 0;
}

/*
* revert the fabricated card-only effect in listing-view (subpage summary)
* */
.subpage.summary .grid-card:not(.only-card):not(.grid-card-wide):has(.subpage-cover) {
display: flex;
}

.subpage.summary .grid-card:not(.only-card):not(.grid-card-wide):has(.subpage-mobile-poster):nth-child(even) {
grid-column: initial;
justify-self: start;
padding: initial;
}
}
3 changes: 1 addition & 2 deletions docs/concert/feed.xml
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,7 @@
<category>album</category>
<category>concert</category>
<category>performance</category>
<category>single</category>
<lastBuildDate>Wed Aug 21 2024 07:47:35 GMT+0100 (British Summer Time)</lastBuildDate>
<lastBuildDate>Thu Aug 22 2024 08:35:28 GMT+0100 (British Summer Time)</lastBuildDate>
<copyright>All rights reserved 2024, Uç! Uç!</copyright>
<docs>https://www.rssboard.org/rss-specification</docs>
<generator>writ-cms</generator>
Expand Down
1 change: 0 additions & 1 deletion docs/concert/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,6 @@ <h1 class="header-logo">
<a class="header-menu-link" style="--i: 1" href="/album">albums</a>
<a class="header-menu-link" style="--i: 2" href="/concert">concerts</a>
<a class="header-menu-link" style="--i: 3" href="/performance">performances</a>
<a class="header-menu-link" style="--i: 4" href="/single">singles</a>
</nav>
</header>

Expand Down
1 change: 0 additions & 1 deletion docs/concert/karga-fest/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,6 @@ <h1 class="header-logo">
<a class="header-menu-link" style="--i: 1" href="/album">albums</a>
<a class="header-menu-link" style="--i: 2" href="/concert">concerts</a>
<a class="header-menu-link" style="--i: 3" href="/performance">performances</a>
<a class="header-menu-link" style="--i: 4" href="/single">singles</a>
</nav>
</header>

Expand Down
Loading

0 comments on commit 80fdfdf

Please sign in to comment.