Un código por códice

1,911 codex

Abrir en el editor Publica tu código

Recomendado

21 October 2024

Entradas de un solo dígito con un elemento

16 April 2026

Código fuente HTML5 del juego Level Devil

HTML

<div class="lunch menu-restaurant">
          <span class="clearfix">
            <a class="menu-title" href="#">Grilled Chicken Salad</a>
            <span style="left: 166px; right: 44px;" class="menu-line"></span>
            <span class="menu-price">$18.49</span>
          </span>
          <span class="menu-subtitle">Grilled chicken breast with a mix of fresh greens and a vinaigrette dressing.</span>
        </div>
        <div class="lunch menu-restaurant">
          <span class="clearfix">
            <a class="menu-title" href="#">BBQ Pulled Pork Sandwich</a>
            <span style="left: 166px; right: 44px;" class="menu-line"></span>
            <span class="menu-price">$14.99</span>
          </span>
          <span class="menu-subtitle">Slow-cooked pulled pork with barbecue sauce, served with fries.</span>
        </div>

<div class="dinner menu-restaurant">
          <span class="clearfix">
            <a class="menu-title" href="#">Grilled Salmon</a>
            <span style="left: 166px; right: 44px;" class="menu-line"></span>
            <span class="menu-price">$22.99</span>
          </span>
          <span class="menu-subtitle">Perfectly grilled salmon served with mashed potatoes and steamed vegetables.</span>
        </div>
        <div class="dinner menu-restaurant">
          <span class="clearfix">
            <a class="menu-title" href="#">Steak Frites</a>
            <span style="left: 166px; right: 44px;" class="menu-line"></span>
            <span class="menu-price">$29.99</span>
          </span>
          <span class="menu-subtitle">Juicy steak served with crispy fries and garlic butter.</span>
        </div>
      </div>
    </div>
  </div>
</section>

CSS

.header-h {
    font-size: 35px;
    color: #F26B38; /* Updated color */
    font-size: 46px;
    font-family: 'Satisfy', sans-serif;
    font-weight: 300;
}

ul {
    list-style: none;
}

.header-p {
    color: #9C9C9C; /* Updated color */
    font-size: 16px;
}
.section-padding {
    padding: 60px 0px;
}

.marb-35 {
    margin-bottom: 35px;
}

.menu-restaurant {
    width: 50%;
    float: left;
    padding: 15px;
    position: relative;
}

.menu-restaurant .menu-title {
    float: left;
    font-family: Montserrat, arial;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #F26B38; /* Updated color */
}

.menu-restaurant .menu-line {
    position: absolute;
    bottom: 6px;
    border-bottom: 1px dotted rgba(0, 0, 0, .3);
    margin-left: .6em;
    margin-right: .6em;
}

.menu-restaurant .menu-price {
    font-weight: 600;
    position: absolute;
    right: 0;
    top: 0;
}

.menu-restaurant .menu-subtitle {
    display: block;
    float: left;
    color: #A9A9A9; /* Updated color */
    font-family: Satisfy, 'Open Sans', arial;
    font-size: 1.2rem;
}

.menu-restaurant span.clearfix {
    position: relative;
    display: block;
}

#menu-filters ul li a.active, #menu-filters ul li a:hover {
    background: #F26B38; /* Updated color */
    color: #fff;
    border: 1px solid #F26B38; /* Updated color */
}

#menu-filters ul li {
    display: inline-block;
    color: #fff;
    text-transform: capitalize;
    letter-spacing: 1px;
    margin-bottom: 40px;
}

#menu-filters ul li a {
    padding: 10px 20px;
    font-size: 14px;
    color: #565656;
    border-radius: 0px;
    border: 1px solid #BBBBBB;
    text-decoration: none;
    cursor: pointer;
}

@media (min-width: 20px) and (max-width: 450px) {
    .menu-restaurant {
        width: 100%;
    }
    .header-h {
        font-size: 35px;
    }
    .header-p {
        font-size: 14px;
    }
}

.msg-row {
    margin-top: 56px;
}

.media-body, .media-left, .media-right {
    display: table-cell;
    vertical-align: top;
}

.bg-1 {
    background-color: #FFA500; /* Updated color */
    width: 70px;
    height: 70px;
    border-radius: 50%;
}

.bg-14 {
    background-color: #A1D36A; /* Updated color */
    width: 70px;
    height: 70px;
    border-radius: 50%;
}

.dark-blue {
    color: #2A2D36; /* Updated color */
    font-size: 24px;
    margin-top: 0;
}

.light-blue {
    color: #9C9C9C; /* Updated color */
    font-size: 16px;
    margin-bottom: 1px;
}

.media-body {
    margin-left: 10px;
    padding-left: 13px;
}

.media-2 {
    margin-top: 30px;
}

.form-group {
    margin: 8px 0 9px !important;
    padding-bottom: 10px;
}

.contact-form .form-control {
    color: #000 !important;
    font-size: 16px;
    font-weight: normal;
    height: 38px;
    line-height: 1.42857;
    padding: 7px 0;
}

.form-control, .form-group .form-control {
    border: 0;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#E65F00), to(#E65F00)), -webkit-gradient(linear, left top, left bottom, from(#D2D2D2), to(#D2D2D2));
    background-image: -webkit-linear-gradient(#E65F00, #E65F00), -webkit-linear-gradient(#D2D2D2, #D2D2D2);
    background-image: -o-linear-gradient(#E65F00, #E65F00), -o-linear-gradient(#D2D2D2, #D2D2D2);
    background-image: linear-gradient(#E65F00, #E65F00), linear-gradient(#D2D2D2, #D2D2D2);
    -webkit-background-size: 0 2px, 100% 1px;
    background-size: 0 2px, 100% 1px;
    background-repeat: no-repeat;
    background-position: center bottom, center -webkit-calc(100% - 1px);
    background-position: center bottom, center calc(100% - 1px);
    background-color: rgba(0, 0, 0, 0);
    -webkit-transition: background 0s ease-out;
    -o-transition: background 0s ease-out;
    transition: background 0s ease-out;
    float: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 0;
}

.contact-form {
    margin: 8px 0 9px !important;
    padding-bottom: 10px;
}

.phone-in-talk, .hour-icon {
    font-size: 35px;
    line-height: 70px;
    color: rgb(255, 255, 255);
}

.contact-form textarea.form-control {
    color: #000 !important;
    height: auto;
}

.contacts-btn {
    background-color: #F26B38 !important; /* Updated color */
    color: #ffffff !important;
    width: 170px;
    height: 54px;
    border-radius: 3px;
    font-size: 16px;
    font-family: 'Roboto', sans-serif;
    font-weight: normal;
    text-transform: capitalize;
    border: 0px;
    color: #000 !important;
}

.validation {
    color: red;
    display: none;
    margin: 0 0 20px;
    font-weight: 400;
    font-size: 13px;
}

#sendmessage {
    color: green;
    border: 1px solid green;
    display: none;
    text-align: center;
    padding: 15px;
    font-weight: 600;
    margin-bottom: 15px;
}

#errormessage {
    color: red;
    display: none;
    border: 1px solid red;
    text-align: center;
    padding: 15px;
    font-weight: 600;
    margin-bottom: 15px;
}

#sendmessage.show, #errormessage.show, .show {
    display: block;
}