diff --git a/src/pages/SearchCombinationPage/components/CombinationBox.css b/src/pages/SearchCombinationPage/components/CombinationBox.css index 170b26eed802a89051bf79b212b9b04059d61af1..b886b05ea6c85acc03d16518a5e3010c6ca87ddd 100644 --- a/src/pages/SearchCombinationPage/components/CombinationBox.css +++ b/src/pages/SearchCombinationPage/components/CombinationBox.css @@ -11,16 +11,27 @@ .share-button { padding: 0.5rem 1rem; - background-color: #4CAF50; + background-color: var(--primary-color); color: white; - border: none; - border-radius: 4px; + border: 1px solid var(--primary-color); + border-radius: 8px; cursor: pointer; - transition: background-color 0.3s; + font-weight: 500; + transition: all 0.3s ease; } .share-button:hover { - background-color: #45a049; + background-color: var(--primary-color); + box-shadow: 0 0 0 3px var(--primary-light); + transform: translateY(-1px); +} + +.share-button:disabled { + background-color: var(--primary-light); + border-color: var(--primary-light); + cursor: not-allowed; + transform: none; + box-shadow: none; } .title { diff --git a/src/pages/SharedCombinationPage/SharedCombinationPage.css b/src/pages/SharedCombinationPage/SharedCombinationPage.css index 571b0f793decac0da64db9ac3add7de43cfeb024..e4a4ac725ff86719951bc210b0234667f20f5d8e 100644 --- a/src/pages/SharedCombinationPage/SharedCombinationPage.css +++ b/src/pages/SharedCombinationPage/SharedCombinationPage.css @@ -24,14 +24,25 @@ .share-button { padding: 0.5rem 1rem; - background-color: #4CAF50; + background-color: var(--primary-color); color: white; - border: none; - border-radius: 4px; + border: 1px solid var(--primary-color); + border-radius: 8px; cursor: pointer; - transition: background-color 0.3s; + font-weight: 500; + transition: all 0.3s ease; } .share-button:hover { - background-color: #45a049; + background-color: var(--primary-color); + box-shadow: 0 0 0 3px var(--primary-light); + transform: translateY(-1px); +} + +.share-button:disabled { + background-color: var(--primary-light); + border-color: var(--primary-light); + cursor: not-allowed; + transform: none; + box-shadow: none; } \ No newline at end of file