[第二十八只羊] 迷雾森林顶尖对决 登入介面套版

天亮了 昨晚是平安夜

关於迷雾森林故事

香水

在场本来许多animal们牵着喜鹊儿的翅膀小手跳舞
都纷纷放下了手 小脚步的移动与他们保持距离
Lulu则是用翅膀摸自己的额头说 笑死
也不想想你几两重 在这边大小声
看你这样欺骗大家的感情我也觉得你很辛苦
不如这样
如果你兔崽子你嫩讲出任何一个证据证明我是坏人
那你刚就直接说了不用在那边吱吱呜呜还扯什麽我推你下海
你自己投海我还不知道为什麽你会出现在这呢？

来源
兔兔马上接着说
凶手不用在那边情感发言
洛神之所以让12人的游戏继续进行
就算人数只有10个人也不吭声就是因为
身为神职的技能施予者
她也自带预言家功能
当你把我们两个推下海之後
是她开了量子穿隧通道让我们直接回到舞会现场
况且你根本就瞒不住，洛神也跟我说了你的阴谋
大家只有看看那海马就知道 你就别演了快点自爆吧
众animal黑人问号的把头转向旋木周遭漂浮的海马
可爱的海马在空气中游动～还不时吐着泡泡 看不出哪里有可疑之处
Lulu则是脸带惊讶的说 没想到洛神还留了这一手
那就没办法了
乌云笼罩在旋木上空
旋木上漂浮的海马从悠游自在地飘
海马身上的金色幻化成金粉
空气中先是出现了金色的粉状物 飘在整个森林之中

图片来源
待续..

动物园派对

今天把登入介面稍微套版也同时再练习一下 tailwind css

<section class="flex max-h-full">
  <main class="w-96 bg-yellow-500 p-7 space-y-5 hidden md:block">
    <header>
      <nav class="p-3">
        <h4 style="font-family: 'montserrat regular';" class="text-xl text-white font-normal uppercase">动物园派对</h4>
      </nav>
    </header>

    <div class="p-3 my7 space-y-6">
      <h1 style="font-family: 'montserrat regular';" class="text-2xl  text-white font-semibold">
        一起趴踢趴踢 all night
      </h1>
      <p class="text-white text-sm" style="font-family: 'inter';">
        Lorem ipsum dolor, sit amet consectetur adipisicing elit. Corrupti iusto nostrum sit placeat reprehenderit
        temporibus, fuga nihil mollitia id culpa?
      </p>
    </div>

    <img src="<%= asset_path("halloween_cute_black_cat.svg")%>", alt="wolf_bg" class="justify-center">
  </main>
  <main class="flex-auto bg-white space-y-7 p-2">
    <header class="py-5 px-5 my-4">
      <nav>
        <ul class="flex items-center justify-end space-x-4">
          <a href="#">
            <li>
              <svg class="w-5 h-5 text-red-500" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
                <path fill-rule="evenodd" d="M3.172 5.172a4 4 0 015.656 0L10 6.343l1.172-1.171a4 4 0 115.656 5.656L10 17.657l-6.828-6.829a4 4 0 010-5.656z" clip-rule="evenodd"></path>
              </svg>
            </li>
          </a>
          <a href="#">
            <li>
              <svg class="w-5 h-5 text-red-500" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
                <path d="M3 1a1 1 0 000 2h1.22l.305 1.222a.997.997 0 00.01.042l1.358 5.43-.893.892C3.74 11.846 4.632 14 6.414 14H15a1 1 0 000-2H6.414l1-1H14a1 1 0 00.894-.553l3-6A1 1 0 0017 3H6.28l-.31-1.243A1 1 0 005 1H3zM16 16.5a1.5 1.5 0 11-3 0 1.5 1.5 0 013 0zM6.5 18a1.5 1.5 0 100-3 1.5 1.5 0 000 3z"></path>
              </svg>
            </li>
          </a>
          <a href="#">
            <li>
              <svg class="w-5 h-5 text-red-500" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
                <path fill-rule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-6-3a2 2 0 11-4 0 2 2 0 014 0zm-2 4a5 5 0 00-4.546 2.916A5.986 5.986 0 0010 16a5.986 5.986 0 004.546-2.084A5 5 0 0010 11z" clip-rule="evenodd"></path>
              </svg>
            </li>
          </a>
        </ul>
      </nav>
    </header>

    <div class="flex items-center justify-center p-5">
      <h4 style="font-family: 'montserrat regular';" class="text-3xl font-black text-black">
        帐号登入
      </h4>
    </div>

    <section class="flex flex-col items-center justify-center">
      <%= simple_form_for(resource, as: resource_name, html: { class: 'space-y-4' }, url: session_path(resource_name)) do |f| %>
        <div class="form-inputs text-4xl text-black">
          <div class="email">
            <div class="relative mt-1">
              <div class="input email required user_email bg-white">
                <input autocomplete="email" class="string email required p-4 w-80 h-10 rounded pl-10 text-sm focus:outline-none border border-gray-200 focus:border-red-400 font-light" autofocus="autofocus" required="required" aria-required="true" placeholder="email address" type="email" value="" name="user[email]" id="user_email">
              </div>
              <svg class="w-4 h-4 absolute top-1 ml-8 m-3 text-gray-300" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
                <path fill-rule="evenodd" d="M14.243 5.757a6 6 0 10-.986 9.284 1 1 0 111.087 1.678A8 8 0 1118 10a3 3 0 01-4.8 2.401A4 4 0 1114 10a1 1 0 102 0c0-1.537-.586-3.07-1.757-4.243zM12 10a2 2 0 10-4 0 2 2 0 004 0z" clip-rule="evenodd"></path>
              </svg>
            </div>
          </div>
          <div class="password">
            <div class="relative mt-1 mb-2">
              <div class="input password required user_password bg-white">
                <input autocomplete="current-password" class="password required p-4 w-80 h-10 rounded pl-10 text-sm focus:outline-none border border-gray-200 focus:border-red-400 font-light" required="required" aria-required="true" type="password" name="user[password]" id="user_password">
              </div>
              <svg class="w-4 h-4 absolute top-1 ml-8 m-3 text-gray-300" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
                <path fill-rule="evenodd" d="M18 8a6 6 0 01-7.743 5.743L10 14l-1 1-1 1H6v2H2v-4l4.257-4.257A6 6 0 1118 8zm-6-4a1 1 0 100 2 2 2 0 012 2 1 1 0 102 0 4 4 0 00-4-4z" clip-rule="evenodd"></path>
              </svg>
            </div>
          </div>
          <div class="remember_me">
            <div class="relative mt-1 mb-2">
              <div class="input boolean optional user_remember_me bg-white">
                <input value="0" type="hidden" name="user[remember_me]">
                <label class="boolean optional checkbox" for="user_remember_me">
                  <input class="boolean optional mr-3" type="checkbox" value="1" name="user[remember_me]" id="user_remember_me">Remember
                me</label></div>
            </div>
          </div>
        </div>

        <div class="form-actions">
          <button class="w-full  focus:ring focus:ring-red-200 w-80 h-9 btn btn-primary" type="submit" name="commit" value="Log in" >进入动物园</button>
        </div>
      <% end %>

    </section>

    <section class="flex flex-col items-center justify-center space-y-4">
    </section>
  </main>
</section>

阿虎每日选币

$dydx