Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

#

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

Adapt-1808: Use TW box shadows for v7 #799

Merged
merged 3 commits into from
Feb 11, 2021
Merged

Adapt-1808: Use TW box shadows for v7 #799

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
1616447
Use TW default for box-shadows; update preview page
yvonnetangsu Feb 11, 2021
7fdde56
Forgot sample test page code
yvonnetangsu Feb 11, 2021
016bb47
add accidentally deleted netlify badge back in
yvonnetangsu Feb 11, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
32 changes: 23 additions & 9 deletions dev/src/sample.test.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,9 +8,9 @@
<body class="su-debug-screens">

<!-- MAIN DEVELOPMENT AREA -->
<div class="su-bg-digital-red su-pt-5 su-pb-2">
<div class="su-bg-digital-red su-pt-5 su-pb-1">
<div class="su-cc">
<a class="su-logo su-text-white hover:su-text-white active:su-text-white focus:su-text-whit su-text-20" href="https://stanford.edu">Stanford University</a>
<a class="su-logo su-text-white hover:su-text-white focus:su-text-white su-text-20" href="https://stanford.edu">Stanford University</a>
</div>
</div>
<div role="banner" class="su-rs-py-6 su-bg-gradient-to-b su-from-black su-to-plum su-text-white">
Expand All @@ -36,6 +36,7 @@ <h2 class="su-type-5"><a href="#text" class="su-text-black hover:su-underline fo
</ul>
<h2 class="su-type-5"><a href="#html-elements" class="su-text-black hover:su-underline focus:su-underline">HTML Elements</a></h2>
<ul class="su-list-unstyled su-text-16 md:su-text-20 su-rs-mb-4">
<li class="su-inline-block su-mb-12"><a href="#drop-shadows" class="su-inline-block su-py-8 su-px-20 su-mr-12 su-bg-spirited-dark hover:su-bg-archway-dark focus:su-bg-archway-dark su-rounded-full su-text-white hover:su-text-white focus:su-text-white su-no-underline su-transition-colors">Drop Shadows</a></li>
<li class="su-inline-block su-mb-12"><a href="#text__tables" class="su-inline-block su-py-8 su-px-20 su-mr-12 su-bg-spirited-dark hover:su-bg-archway-dark focus:su-bg-archway-dark su-rounded-full su-text-white hover:su-text-white focus:su-text-white su-no-underline su-transition-colors">Tables</a></li>
<li class="su-inline-block su-mb-12 su-mr-12"><a class="su-inline-block su-py-8 su-px-20 su-bg-spirited-dark hover:su-bg-archway-dark focus:su-bg-archway-dark su-rounded-full su-text-white hover:su-text-white focus:su-text-white su-no-underline su-transition-colors" href="#embedded__images">Images</a></li>
<li class="su-inline-block su-mb-12 su-mr-12"><a class="su-inline-block su-py-8 su-px-20 su-bg-spirited-dark hover:su-bg-archway-dark focus:su-bg-archway-dark su-rounded-full su-text-white hover:su-text-white focus:su-text-white su-no-underline su-transition-colors" href="#embedded__youtube">Embed Streaming Video</a></li>
Expand Down Expand Up @@ -237,6 +238,19 @@ <h2 class="su-type-6 su-text-white su-mb-0 su-text-center">HTML Elements</h2>
</header>
<div class="su-cc su-flex su-flex-col md:su-flex-row su-rs-py-6 su-overflow-x-hidden">
<div class="su-mx-auto su-w-full lg:su-w-8/12">
<article id="drop-shadows" class="su-rs-mb-5">
<header><h3 class="su-type-5 su-text-lagunita-light">Drop Shadows</h3></header>
<div class="su-grid md:su-grid-cols-2 lg:su-grid-cols-3 su-gap-xl md:su-gap-lg 2xl:su-gap-2xl">
<div class="su-rs-py-4 su-rs-px-1 su-flex su-justify-center su-content-center su-text-plum su-font-semibold su-bg-white su-border su-border-solid su-border-black-10 su-shadow-none">.su-shadow-none</div>
<div class="su-rs-py-4 su-rs-px-1 su-flex su-justify-center su-content-center su-text-plum su-font-semibold su-bg-white su-border su-border-solid su-border-black-10 su-shadow-sm">.su-shadow-sm</div>
<div class="su-rs-py-4 su-rs-px-1 su-flex su-justify-center su-content-center su-text-plum su-font-semibold su-bg-white su-border su-border-solid su-border-black-10 su-shadow">.su-shadow</div>
<div class="su-rs-py-4 su-rs-px-1 su-flex su-justify-center su-content-center su-text-plum su-font-semibold su-bg-white su-border su-border-solid su-border-black-10 su-shadow-md">.su-shadow-md</div>
<div class="su-rs-py-4 su-rs-px-1 su-flex su-justify-center su-content-center su-text-plum su-font-semibold su-bg-white su-border su-border-solid su-border-black-10 su-shadow-lg">.su-shadow-lg</div>
<div class="su-rs-py-4 su-rs-px-1 su-flex su-justify-center su-content-center su-text-plum su-font-semibold su-bg-white su-border su-border-solid su-border-black-10 su-shadow-xl">.su-shadow-xl</div>
<div class="su-rs-py-4 su-rs-px-1 su-flex su-justify-center su-content-center su-text-plum su-font-semibold su-bg-white su-border su-border-solid su-border-black-10 su-shadow-2xl">.su-shadow-2xl</div>
<div class="su-rs-py-4 su-rs-px-1 su-flex su-justify-center su-content-center su-text-plum su-font-semibold su-bg-white su-border su-border-solid su-border-black-10 su-shadow-inner">.su-shadow-inner</div>
</div>
</article>
<article id="text__tables" class="su-rs-mb-5">
<header><h3 class="su-type-5 su-text-lagunita-light">Tables</h3></header>
<h4 class="su-type-3">Default Table</h4>
Expand Down Expand Up @@ -406,7 +420,7 @@ <h2 class="su-type-6 su-text-white su-mb-0 su-text-center">Form Elements</h2>
<div class="su-cc su-flex su-flex-col md:su-flex-row su-rs-py-6 su-overflow-x-hidden">
<div class="su-mx-auto su-w-full lg:su-w-8/12">
<form>
<fieldset id="forms__input">
<fieldset id="forms__input" class="su-rs-mb-3">
<legend>Input fields</legend>
<p>
<label for="input__text">Text Input</label>
Expand Down Expand Up @@ -446,7 +460,7 @@ <h2 class="su-type-6 su-text-white su-mb-0 su-text-center">Form Elements</h2>
</p>
</fieldset>

<fieldset id="forms__select">
<fieldset id="forms__select" class="su-rs-mb-3">
<legend>Select menus</legend>
<p>
<label for="select">Select</label>
Expand All @@ -460,7 +474,7 @@ <h2 class="su-type-6 su-text-white su-mb-0 su-text-center">Form Elements</h2>
</p>
</fieldset>

<fieldset id="forms__checkbox">
<fieldset id="forms__checkbox" class="su-rs-mb-3">
<legend>Checkboxes</legend>
<ul>
<li><input id="checkbox1" name="checkbox" type="checkbox" checked="checked" /><label for="checkbox1">Choice A</label></li>
Expand All @@ -469,7 +483,7 @@ <h2 class="su-type-6 su-text-white su-mb-0 su-text-center">Form Elements</h2>
</ul>
</fieldset>

<fieldset id="forms__radio">
<fieldset id="forms__radio" class="su-rs-mb-3">
<legend>Radio buttons</legend>
<ul>
<li><input id="radio1" name="radio" type="radio" class="radio" checked="checked" /><label for="radio1">Option 1</label></li>
Expand All @@ -478,15 +492,15 @@ <h2 class="su-type-6 su-text-white su-mb-0 su-text-center">Form Elements</h2>
</ul>
</fieldset>

<fieldset id="forms__textareas">
<fieldset id="forms__textareas" class="su-rs-mb-3">
<legend>Textareas</legend>
<p>
<label for="textarea">Textarea</label>
<textarea id="textarea" rows="8" cols="48" placeholder="Enter your message here" class="su-input-base"></textarea>
</p>
</fieldset>

<fieldset id="forms__html5">
<fieldset id="forms__html5" class="su-rs-mb-3">
<legend>HTML5 inputs</legend>
<p>
<label for="ic">Color input</label>
Expand Down Expand Up @@ -522,7 +536,7 @@ <h2 class="su-type-6 su-text-white su-mb-0 su-text-center">Form Elements</h2>
</p>
</fieldset>

<fieldset id="forms__action">
<fieldset id="forms__action" class="su-rs-mb-3">
<legend>Action buttons</legend>
<p>
<input type="submit" value="<input type=submit>">
Expand Down
12 changes: 2 additions & 10 deletions dist/decanter-base.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,9 +5,6 @@
* plugins.
*/

/*! tailwindcss v2.0.3 | MIT License | https://tailwindcss.com
*/

/*! modern-normalize v1.0.0 | MIT License | https://github.com/sindresorhus/modern-normalize */

/*
Expand Down Expand Up @@ -452,28 +449,23 @@ textarea {
}

input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
opacity: 1;
color: #a1a1aa;
}

input::-moz-placeholder, textarea::-moz-placeholder {
opacity: 1;
color: #a1a1aa;
}

input:-ms-input-placeholder, textarea:-ms-input-placeholder {
opacity: 1;
color: #a1a1aa;
}

input::-ms-input-placeholder, textarea::-ms-input-placeholder {
opacity: 1;
color: #a1a1aa;
}

input::placeholder,
textarea::placeholder {
opacity: 1;
color: #a1a1aa;
}

Expand Down Expand Up @@ -830,8 +822,8 @@ button:hover, button:focus, [type="button"]:hover, [type="button"]:focus, [type=
}

button:focus, [type="button"]:focus, [type="submit"]:focus, [type="reset"]:focus, [type="image"]:focus{
-webkit-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.13), 0px 3px 6px rgba(0, 0, 0, 0.1);
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.13), 0px 3px 6px rgba(0, 0, 0, 0.1);
-webkit-box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

a{
Expand Down
Loading