명상 앱 개발

초 단순 프로토타이핑.

<div class="flex text-center">
    <div class="flex-grow">
        <div class="flex flex-col">
            <div>일</div>
            <div>22</div>
        </div>
    </div>
    <div class="flex-grow relative">
        <div class="flex w-full h-full absolute">
            <div class="flex-grow"></div>
            <div class="flex-grow w-6 rounded-lg bg-blue-300"></div>
            <div class="flex-grow"></div>
        </div>
        <div class="flex flex-col text-white relative">
            <div>수</div>
            <div>25</div>
        </div>
    </div>
    <div class="flex-grow">
        <div class="flex flex-col">
            <div>토</div>
            <div>28</div>
        </div>
    </div>
</div>

하늘색 선택 영역은 오늘을 나타낸다. 이 하늘색 배경은 요일 한 칸의 넓이보다 얇고 중앙에 배치돼야 하기에 3cols divs를 넣고 가운데 div에 배경색을 칠했다. 매우 변태적.

Leave a comment

Your email address will not be published. Required fields are marked *