mqxu

Football (soccer) match score component

Recreated this Dribbble-shot: https://dribbble.com/shots/7735602-GitBets-Match/attachments/438485?mode=media

A Pen by Håvard Brynjulfsen on CodePen.

License.

mqxu

Card component with floating labels

Recreated this Dribble-shot by Vishnu Prasad: https://dribbble.com/shots/11522673-Landing-Page-Components

Image by Jakub Dziubak from Unsplash: https://unsplash.com/photos/XtUd5SiX464

A Pen by Håvard Brynjulfsen on CodePen.

License.

mqxu

404 Page

A Pen by Kasper De Bruyne on CodePen.

License.

mqxu

CSS Filter Cards

A Pen by Steve Meredith on CodePen.

License.

mqxu

section.c-section
  h2.c-section__title
    span Our Services
  ul.c-services
    li.c-services__item
      h3 Responsive Web Design
      p
        | We leverage the concept of mobile-first design. Through our work, we focus on designing an experience that works across different screen sizes.
    li.c-services__item
      h3 UX Auditing

mqxu

<div class="container">

    <div class="status-bar">
      
      <span class="status-bar__clock" onload="showTime()"></span>

      <div>

        <img class="status-bar__img img" src="http://utopian-drink.surge.sh/images/icon/status-bar.svg" alt="status-bar">

mqxu

		<div class="container right-panel-active">
			<!-- Sign Up -->
			<div class="container__form container--signup">
				<form action="#" class="form" id="form1">
					<h2 class="form__title">Sign Up</h2>
					<input type="text" placeholder="User" class="input" />
					<input type="email" placeholder="Email" class="input" />
					<input type="password" placeholder="Password" class="input" />
					<button class="btn">Sign Up</button>
				</form>

mqxu

Book Store UI

Inspired by Dwinawan https://dribbble.com/shots/2425824--Exploration-Book-Store-Website

A Pen by Aysenur Turk on CodePen.

License.

mqxu

       <div class="wrapper" id="app">
      <div class="player">
        <div class="player__top">
          <div class="player-cover">
            <transition-group :name="transitionName">
                <div class="player-cover__item" v-if="$index === currentTrackIndex" :style="{ backgroundImage: `url(${track.cover})` }"  v-for="(track, $index) in tracks" :key="$index"></div>
            </transition-group>
          </div>
          <div class="player-controls">
            <div class="player-controls__item -favorite" :class="{ active : currentTrack.favorited }" @click="favorite">

mqxu

<div class="login-box">
  <h2>Login</h2>
  <form>
    <div class="user-box">
      <input type="text" name="" required="">
      <label>Username</label>
    </div>
    <div class="user-box">
      <input type="password" name="" required="">
      <label>Password</label>