Skip to content
New issue

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

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

Already on GitHub? Sign in to your account

Remove bg-black #2022

Merged
merged 6 commits into from
Jul 26, 2024
Merged
Show file tree
Hide file tree
Changes from 5 commits
Commits
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
2 changes: 1 addition & 1 deletion app/components/contest-page/how-it-works-card.hbs
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<div class="dark:bg-gray-950 rounded-md w-full border dark:border-gray-800" ...attributes>
<div class="dark:bg-gray-900 rounded-md w-full border dark:border-gray-800" ...attributes>
<div class="p-4 pt-3 sm:p-6 sm:pt-5">
<h2 class="font-semibold border-b dark:border-gray-800 pb-2 mb-5 text-lg dark:text-teal-400">How it works</h2>

Expand Down
2 changes: 1 addition & 1 deletion app/components/contest-page/leaderboard-card.hbs
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<div class="dark:bg-gray-950 rounded-md w-full border dark:border-gray-800" ...attributes>
<div class="dark:bg-gray-900 rounded-md w-full border dark:border-gray-800" ...attributes>
<div class="p-4 pt-3 sm:p-6 sm:pt-5">
<h2 class="font-semibold border-b dark:border-gray-800 pb-2 mb-5 text-lg dark:text-teal-400">Leaderboard</h2>

Expand Down
2 changes: 1 addition & 1 deletion app/components/contest-page/prize-details-card.hbs
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<div class="dark:bg-gray-950 rounded-md border dark:border-gray-800" ...attributes>
<div class="dark:bg-gray-900 rounded-md border dark:border-gray-800" ...attributes>
<div class="p-4 pt-3 sm:p-6 sm:pt-5">
<h2 class="font-semibold border-b dark:border-gray-800 pb-2 mb-5 text-lg dark:text-teal-400">Prize</h2>

Expand Down
2 changes: 1 addition & 1 deletion app/components/course-card.hbs
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<LinkTo
class="group bg-white dark:bg-gray-950 p-5 rounded-md shadow hover:shadow-md transition-all cursor-pointer flex flex-col justify-between border dark:border-gray-800 relative"
class="group bg-white dark:bg-gray-925 p-5 rounded-md shadow hover:shadow-md transition-all cursor-pointer flex flex-col justify-between border dark:border-gray-800-alpha-70 relative"
@route={{this.linkToRoute.name}}
@model={{this.linkToRoute.model}}
@query={{this.linkToRoute.query}}
Expand Down
2 changes: 1 addition & 1 deletion app/components/course-page/instructions-card.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
{{did-update this.handleContentIdentifierDidUpdate @contentIdentifier}}
>
<div
class="bg-white dark:bg-gray-950 border border-gray-300 dark:border-gray-800 relative
class="bg-white dark:bg-gray-900 border border-gray-300 dark:border-gray-800 relative
{{if (has-block 'footer') 'rounded-t border-b-0' 'rounded'}}"
>
<div class="p-4 pt-3 sm:p-6 sm:pt-5 {{if (has-block 'footer') 'pb-4'}}">
Expand Down
2 changes: 1 addition & 1 deletion app/components/course-page/sidebar.hbs
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<div
class="bg-gray-100 dark:bg-black border-r border-gray-300 dark:border-gray-800 flex flex-col pt-4 px-3"
class="bg-gray-100 dark:bg-gray-950 border-r border-gray-300 dark:border-gray-800 flex flex-col pt-4 px-3"
data-test-course-page-sidebar
...attributes
>
Expand Down
2 changes: 1 addition & 1 deletion app/components/course-page/test-results-bar.hbs
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<div
class="bg-black border-t border-gray-800 dark flex flex-col items-center"
class="bg-gray-950 border-t border-gray-800 dark flex flex-col items-center"
style={{if this.isExpanded this.customHeight}}
data-test-test-results-bar
...attributes
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -74,7 +74,7 @@
>Learn more</a>.
</div>

<BlurredOverlay @isBlurred={{this.diffIsBlurred}} @overlayClass="bg-black bg-opacity-20">
<BlurredOverlay @isBlurred={{this.diffIsBlurred}} @overlayClass="bg-gray-950 bg-opacity-20">
<:content>
{{#each @autofixRequest.changedFiles key="filename" as |changedFile|}}
<FileDiffCard
Expand Down
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<div
class="flex items-center justify-center gap-2 relative py-2 group/test-results-bar-bottom-section {{if @barIsExpanded 'bg-black'}}"
class="flex items-center justify-center gap-2 relative py-2 group/test-results-bar-bottom-section {{if @barIsExpanded 'bg-gray-950'}}"
{{on "click" (if this.barIsCollapsed @onExpandButtonClick @onCollapseButtonClick)}}
role="button"
data-test-bottom-section
Expand Down
2 changes: 1 addition & 1 deletion app/components/file-contents-card.hbs
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<div
class="bg-white dark:bg-gray-950 shadow-sm rounded border border-gray-300 dark:border-gray-800"
class="bg-white dark:bg-gray-900 shadow-sm rounded border border-gray-300 dark:border-gray-800"
...attributes
{{did-insert this.handleDidInsertContainer}}
>
Expand Down
6 changes: 3 additions & 3 deletions app/components/footer.hbs
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<div class="bg-black border-t border-gray-800">
<div class="bg-gray-950 border-t border-gray-800-alpha-70">
<footer aria-labelledby="footer-heading" class="container lg:max-w-screen-lg mx-auto">
<h2 id="footer-heading" class="sr-only">Footer</h2>
<div class="max-w-7xl mx-auto py-12 px-4 sm:px-6 lg:py-16 lg:px-8">
Expand Down Expand Up @@ -55,8 +55,8 @@
{{/each}}
</div>
</div>
<div class="mt-12 border-t border-gray-700 pt-8">
<p class="text-base text-gray-600 xl:text-center">
<div class="mt-12 border-t dark:border-gray-800-alpha-70 pt-8">
<p class="text-base text-gray-700 xl:text-center">
&copy; 2024 CodeCrafters, Inc. All rights reserved.
</p>
</div>
Expand Down
6 changes: 3 additions & 3 deletions app/components/header.hbs
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<div
class="shadow relative bg-white dark:bg-black dark:border-b dark:border-gray-800"
class="shadow relative bg-white dark:bg-gray-950 dark:border-b dark:border-gray-800-alpha-70"
{{did-insert this.handleDidInsert}}
{{will-destroy this.handleWillDestroy}}
data-test-header
Expand Down Expand Up @@ -51,8 +51,8 @@
<div
role="button"
class="rounded border
{{if dd.isOpen 'border-gray-600 dark:border-gray-300' 'border-gray-200 dark:border-gray-600'}}
text-gray-600 dark:text-gray-300 hover:border-gray-600 dark:hover:border-gray-300 transition-colors px-2 py-1 text-xs"
{{if dd.isOpen 'border-gray-600 dark:border-gray-400' 'border-gray-200 dark:border-gray-800'}}
text-gray-600 dark:text-gray-400 hover:border-gray-600 dark:hover:border-gray-400 transition-colors px-2 py-1 text-xs"
data-test-feedback-button
>
Feedback
Expand Down
2 changes: 1 addition & 1 deletion app/components/modal-body.hbs
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<div
class="rounded-md shadow-sm overflow-hidden border-gray-300 relative flex-shrink overflow-y-auto px-4 py-12 sm:px-12 min-h-0 bg-white dark:bg-black
class="rounded-md shadow-sm overflow-hidden border-gray-300 relative flex-shrink overflow-y-auto px-4 py-12 sm:px-12 min-h-0 bg-white dark:bg-gray-950
{{if @isWide 'max-w-screen-lg' 'max-w-xl'}}"
{{on-click-outside this.handleClickOutside}}
...attributes
Expand Down
2 changes: 1 addition & 1 deletion app/components/pill.ts
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ export default class PillComponent extends Component<Signature> {
blue: 'bg-blue-50 text-blue-700 ring-blue-600/20 dark:bg-blue-950 dark:text-blue-300 dark:ring-blue-400/20',
gray: 'bg-gray-50 text-gray-700 ring-gray-600/20 dark:bg-gray-900 dark:text-gray-300 dark:ring-gray-400/20',
'dark-gray': 'bg-gray-200 text-gray-700 ring-gray-600/20 dark:bg-gray-800 dark:text-gray-300 dark:ring-gray-400/20',
white: 'bg-white text-gray-600 ring-gray-600/20 dark:bg-gray-950 dark:text-gray-300 dark:ring-gray-400/20',
white: 'bg-white text-gray-600 ring-gray-600/20 dark:bg-gray-900 dark:text-gray-300 dark:ring-gray-400/20',
}[this.args.color];
}
}
Expand Down
2 changes: 1 addition & 1 deletion app/components/settings/form-section.hbs
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<div class="grid grid-cols-1 sm:grid-cols-2" ...attributes>
<div class="pb-6 pr-0 sm:pb-0 sm:pr-4">
<div class="text-gray-700 dark:text-gray-200 font-semibold text-lg">{{@title}}</div>
<div class="text-gray-400 dark:text-gray-600 text-xs mt-1">{{@description}}</div>
<div class="text-gray-500 text-xs mt-1">{{@description}}</div>

{{#if (has-block "belowDescription")}}
<div class="mt-2">
Expand Down
4 changes: 2 additions & 2 deletions app/components/settings/profile-page/about-section.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
{{! template-lint-disable require-input-label }}
<Textarea
@value={{@user.profileDescriptionMarkdown}}
class="text-sm rounded px-3 py-2 placeholder-gray-300 focus:outline-none focus:ring-2 focus:ring-teal-500 border border-gray-300 shadow-sm w-full dark:border-gray-800 dark:bg-black"
class="text-sm rounded px-3 py-2 placeholder-gray-300 focus:outline-none focus:ring-2 focus:ring-teal-500 border border-gray-300 shadow-sm w-full dark:border-gray-800 dark:bg-gray-925"
placeholder="I'm a software engineer who loves building things. Here are some of my projects..."
rows="3"
required
Expand All @@ -24,7 +24,7 @@
Saved!
</span>
{{else}}
<span class="text-gray-400 dark:text-gray-600">
<span class="text-gray-500">
Displayed on your profile page. Markdown supported.
</span>
{{/if}}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
{{on "click" this.handleToggle}}
data-test-anonymous-mode-toggle
/>
<div class="text-gray-600 dark:text-gray-400 text-sm">Enable anonymous mode</div>
<div class="text-gray-500 text-sm">Enable anonymous mode</div>

{{#unless @user.canAccessMembershipBenefits}}
{{#if @user.hasAnonymousModeEnabled}}
Expand All @@ -25,7 +25,7 @@
{{/if}}
{{/unless}}
</div>
<p class="text-gray-400 dark:text-gray-600 text-xs mt-4 leading-relaxed">
<p class="text-gray-500 text-xs mt-4 leading-relaxed">
When anonymous mode is enabled, your GitHub username &amp; avatar will be hidden on CodeCrafters. Your code examples &amp; profile page will
still be visible to the public, but under a random username.
<a href="https://codecrafters.io/anon" target="_blank" class="underline" rel="noopener noreferrer">Learn more.</a>
Expand Down
2 changes: 1 addition & 1 deletion app/components/settings/profile-page/avatar-section.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
<EmberTooltip @text="This image is synced with your GitHub account." />
{{/if}}
</div>
<div class="text-gray-400 dark:text-gray-600 text-xs mt-2">
<div class="text-gray-500 text-xs mt-2">
{{#if @user.hasAnonymousModeEnabled}}
Your profile has anonymous mode enabled. Your GitHub avatar is not visible to others.
{{else}}
Expand Down
2 changes: 1 addition & 1 deletion app/components/settings/profile-page/username-section.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
{{/if}}
</div>

<div class="text-gray-400 dark:text-gray-600 text-xs mt-2">
<div class="text-gray-500 text-xs mt-2">
{{#if @user.hasAnonymousModeEnabled}}
Your profile has anonymous mode enabled. Your GitHub username is not visible to others.
{{else}}
Expand Down
2 changes: 1 addition & 1 deletion app/components/tertiary-button.hbs
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<BaseButton
@size={{@size}}
@isDisabled={{@isDisabled}}
class="transition-colors duration-75 bg-white dark:bg-black hover:bg-gray-50 dark:text-gray-400 text-gray-800 border-gray-300 dark:border-gray-800 dark:hover:border-gray-700 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-600"
class="transition-colors duration-75 bg-white dark:bg-gray-950 hover:bg-gray-50 dark:text-gray-400 text-gray-800 border-gray-300 dark:border-gray-800 dark:hover:border-gray-700 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-600"
...attributes
>
{{yield}}
Expand Down
2 changes: 1 addition & 1 deletion app/components/tertiary-link-button.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
@isDisabled={{@isDisabled}}
@query={{@query}}
@shouldOpenInNewTab={{@shouldOpenInNewTab}}
class="transition-colors duration-75 bg-white dark:bg-black hover:bg-gray-50 dark:text-gray-400 text-gray-800 border-gray-300 dark:border-gray-800 dark:hover:border-gray-700 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-600"
class="transition-colors duration-75 bg-white dark:bg-gray-950 hover:bg-gray-50 dark:text-gray-400 text-gray-800 border-gray-300 dark:border-gray-800 dark:hover:border-gray-700 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-600"
...attributes
>
{{yield}}
Expand Down
2 changes: 1 addition & 1 deletion app/components/toggle.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
{{if (and @isOn this.sizeIsRegular) 'translate-x-5' 'translate-x-0'}}
{{if this.sizeIsSmall 'h-2.5 w-2.5'}}
{{if this.sizeIsRegular 'h-5 w-5'}}
pointer-events-none relative inline-block transform rounded-full shadow ring-0 transition duration-100 ease-in-out bg-white dark:bg-black"
pointer-events-none relative inline-block transform rounded-full shadow ring-0 transition duration-100 ease-in-out bg-white dark:bg-gray-950"
>
<span
class="{{if
Expand Down
4 changes: 2 additions & 2 deletions app/components/tracks-page/track-card.hbs
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<div
class="group bg-white dark:bg-gray-950 p-5 rounded-md shadow-sm hover:shadow transition-all cursor-pointer flex flex-col justify-between border dark:border-gray-800 relative"
class="group bg-white dark:bg-gray-925 p-5 rounded-md shadow-sm hover:shadow transition-all cursor-pointer flex flex-col justify-between border dark:border-gray-800-alpha-70 relative"
role="button"
{{on "click" this.navigateToTrack}}
data-test-track-card
Expand All @@ -12,7 +12,7 @@
{{! Text }}
<div class="mb-8">
<div class="flex items-center flex-wrap gap-y-2 pr-16">
<div class="text-gray-600 dark:text-gray-400 mr-2" data-test-track-name>
<div class="text-gray-700 dark:text-gray-300 mr-2" data-test-track-name>
{{@language.name}}
</div>

Expand Down
2 changes: 1 addition & 1 deletion app/templates/application.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

{{page-title "CodeCrafters"}}

<div class="application-container min-h-screen {{if this.darkMode.isEnabled 'dark bg-black' 'bg-gray-50'}}">
<div class="application-container min-h-screen {{if this.darkMode.isEnabled 'dark bg-gray-950' 'bg-gray-50'}}">
{{#if this.layout.shouldShowHeader}}
<Header />
{{/if}}
Expand Down
2 changes: 1 addition & 1 deletion app/templates/badges.hbs
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{{page-title "Badges"}}

<div class="dark:bg-black">
<div class="dark:bg-gray-950">
<div class="container mx-auto lg:max-w-screen-lg pt-6 md:pt-10 pb-10 md:pb-48 px-3 md:px-6">
<div class="border-b border-gray-800 pb-2 mb-6">
<h1 class="text-3xl text-gray-200 font-bold tracking-tighter">Badges</h1>
Expand Down
4 changes: 2 additions & 2 deletions app/templates/catalog.hbs
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{{page-title "Catalog"}}

<div class="container mx-auto lg:max-w-screen-lg pt-6 md:pt-10 pb-10 md:pb-48 px-3 md:px-6">
<div class="border-b dark:border-gray-800 pb-2 mb-6">
<div class="border-b dark:border-gray-800-alpha-70 pb-2 mb-6">
<h1 class="text-3xl text-gray-700 dark:text-gray-300 font-bold tracking-tighter">Challenges</h1>
</div>

Expand All @@ -21,7 +21,7 @@
{{/each}}
</div>

<div class="border-b dark:border-gray-800 pb-2 mb-6">
<div class="border-b dark:border-gray-800-alpha-70 pb-2 mb-6">
<h1 class="text-3xl text-gray-700 dark:text-gray-300 font-bold tracking-tighter">Language Tracks</h1>
</div>

Expand Down
2 changes: 1 addition & 1 deletion app/templates/contest.hbs
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{{page-title "Contest"}}

<div class="dark:bg-black">
<div class="dark:bg-gray-950">
<div class="container mx-auto lg:max-w-screen-lg pt-6 md:pt-10 pb-10 md:pb-48 px-3 md:px-6">
<ContestPage::Header @allContests={{@model.allContests}} @contest={{@model.contest}} class="mb-6" />
<div class="flex flex-col-reverse gap-3 md:gap-6 items-start md:flex-row">
Expand Down
8 changes: 4 additions & 4 deletions app/templates/course.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -67,7 +67,7 @@
@activeStep={{this.coursePageState.activeStep}}
@nextStep={{this.coursePageState.nextStep}}
@onMobileSidebarButtonClick={{fn (mut this.sidebarIsExpandedOnMobile) true}}
class="px-3 md:px-6 lg:pl-10 bg-gray-50 dark:bg-black pt-6 pb-5"
class="px-3 md:px-6 lg:pl-10 bg-gray-50 dark:bg-gray-950 pt-6 pb-5"
/>

<CoursePage::Header::StickySection
Expand All @@ -76,9 +76,9 @@
@currentStep={{this.coursePageState.currentStep}}
@activeStep={{this.coursePageState.activeStep}}
@nextStep={{this.coursePageState.nextStep}}
class="px-3 md:px-6 lg:pl-10 bg-gray-50 dark:bg-black"
class="px-3 md:px-6 lg:pl-10 bg-gray-50 dark:bg-gray-950"
/>
<div class="flex flex-grow bg-white dark:bg-black">
<div class="flex flex-grow bg-white dark:bg-gray-950">
<CoursePage::StepContent
@step={{this.coursePageState.currentStep}}
@repository={{@model.activeRepository}}
Expand All @@ -89,7 +89,7 @@

<div
class="{{if this.leaderboardIsExpanded 'w-64 xl:w-80 pr-6' 'pr-4'}}
pt-6 flex-shrink-0 border-l dark:border-gray-800 bg-gray-50 dark:bg-black hidden md:block group relative"
pt-6 flex-shrink-0 border-l dark:border-gray-800 bg-gray-50 dark:bg-gray-950 hidden md:block group relative"
>
{{#if this.leaderboardIsExpanded}}
<CoursePage::CollapseLeaderboardButton
Expand Down
2 changes: 1 addition & 1 deletion app/templates/demo.hbs
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{{page-title "Demo"}}

<div class="dark:bg-black">
<div class="dark:bg-gray-950">
<div class="container mx-auto lg:max-w-screen-lg pt-6 md:pt-10 pb-10 md:pb-48 px-3 md:px-6">
<h1 class="text-3xl text-gray-700 dark:text-gray-200 font-bold tracking-tighter mb-3">Demo</h1>

Expand Down
2 changes: 1 addition & 1 deletion app/templates/settings.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
{{/each}}
</ul>

<div class="bg-white dark:bg-black rounded-md p-4 md:p-6 border dark:border-gray-800">
<div class="bg-white dark:bg-gray-925 rounded-md p-4 md:p-6 border dark:border-gray-800-alpha-70">
{{outlet}}
</div>
</div>
8 changes: 7 additions & 1 deletion tailwind.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ module.exports = {
black: 'black',
blue: colors.sky,
current: 'currentColor',
gray: colors.slate,
gray: colors.gray,
green: colors.green,
indigo: colors.indigo,
red: colors.red,
Expand All @@ -49,6 +49,12 @@ module.exports = {
brightness: {
102: '1.02',
},
colors: {
gray: {
925: '#050A17',
'800-alpha-70': 'rgba(31, 41, 55, 0.7)', // #1f2937 with 70% opacity
},
},
typography: {
DEFAULT: {
css: {
Expand Down
Loading